Node.js에서 실행할 수 있는 HTML 파일 만들기
Node.js로 실행 가능한 HTML 파일을 쓸 수 있습니다.
Node.js에서 읽은 상태에서 HTML 부분에 대한 설명
브라우저에서 열면 반대로 하면 돼.
간단하네.
<!--
console.log("valid javascript!");
/*
-->
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello World</title>
<script src="hello.html"></script>
</head>
<body>
<h1>Valid HTML</h1>
</body>
</html>
<!--
*/
-->
내일 여기로 오세요.진짜 1File CMS를 보여드릴게요.
이걸 이용해서 1 File CMS를 만들어 보세요.
1 서류에는 다음과 같은 내용이 있다.
리얼 1 File CMS죠.
서버측
서버를 설정하려면 다음 명령을 실행하십시오.
$ node index.html
다음 URL을 열면 편집기가 표시됩니다.http://localhost:1337/
클라이언트
index.브라우저에서 직접 열면 창이 숨겨집니다.
단순한 정적 파일이기 때문에 드롭박스에 올려놓고 공개해도 시작된다.
소스 코드는 다음과 같습니다.
<!--
http = require('http'),
fs = require('fs'),
qs = require('querystring');
http.createServer(function (req, res) {
var someFile = "index.html";
if (req.method === 'POST') {
var body = '';
req.on('data', function (data) {
body += data;
});
req.on('end', function () {
var poststr = JSON.stringify(qs.parse(body));
fs.readFile(someFile, 'utf8', function (err, data) {
if (err) return console.log(err);
var processed = data.replace(/var data = {[^}]*};/g, 'var data = ' + poststr + ';');
fs.writeFile(someFile, processed, 'utf8', function (err) {
if (err) return console.log(err);
res.write("{status: 'ok'}");
res.end();
});
});
});
} else {
fs.readFile(someFile, 'utf8', function (err, data) {
res.write(data);
res.end();
});
}
}).listen(1337, "127.0.0.1");
console.log("http://localhost:1337/");
/*
-->
<html>
<head>
<meta charset="UTF-8">
<title>1File CMS</title>
<script>var data = {"posts[]":[]};</script>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
function reload(){
$("#posts").html("");
data["posts[]"].forEach(function(item){
$("#posts").prepend("<pre>" + item + "</pre>");
});
}
$(function(){
$("#send").click(function(){
var text = $("#contents").val();
data["posts[]"].push(text);
$.post("http://localhost:1337/", data, function(){
reload();
});
});
reload();
if (document.location.hostname == "localhost"){
$("#editor").show();
}
});
</script>
<style>
body{
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHUlEQVQIW2NkwAIY8Qq+fnz5v6isLlgRfpXIxgAA0iQEBsbFbSsAAAAASUVORK5CYII=);
}
.container{
width: 900px;
}
textarea{
margin: 20px;
width: 96%;
}
button{
font-size: 2rem;
margin-left:20px;
}
#posts > pre{
background: white;
margin: 20px;
padding: 20px;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
box-shadow:rgba(153, 153, 153, 0.65098) 0px 1px 3px 1px;
-webkit-box-shadow:rgba(153, 153, 153, 0.65098) 0px 1px 3px 1px;
-moz-box-shadow:rgba(153, 153, 153, 0.65098) 0px 1px 3px 1px;
}
#editor{
display: none;
}
</style>
</head>
<body>
<div class="container">
<h1>1File CMS</h1>
<div id="editor">
<textarea id="contents" rows="20"></textarea><br>
<button id="send">Send</button>
</div>
<div id="posts">
</div>
</div>
</body>
</html>
<!--
*/
-->
Reference
이 문제에 관하여(Node.js에서 실행할 수 있는 HTML 파일 만들기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/hashrock/items/c03415c005d826537d4a텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)