ゆうは

わかりたいことを深堀り

Node.jsでHTMLを表示する

Node.jsを少しずつ勉強しています。

この前、Node.jsでServerを立ち上げるところまでやりましたが、今回はHTMLを表示します。

yuuuha.hatenablog.com

HTMLファイルを表示する

HTMLを表示するためには「fs」を使います。

requireで読み込みます。

let fs = require('fs');

そして、Serverの中に「fs.readFile」を書きます。

let server = http.createServer((req, res) => {
    fs.readFile('./index.html', 'UTF-8', (error, data) => {
        res.writeHead(200, { 'Content-Type': 'text/html' });
        res.write(data);
        res.end();
    });
});

これでServerを起動するとHTMLが表示されます。

Node.jsでHTMLを表示する

無事にHTMLを表示できました。

コード全体

Node.js

let http = require('http');
let fs = require('fs');

let server = http.createServer((req, res) => {
    fs.readFile('./index.html', 'UTF-8', (error, data) => {
        res.writeHead(200, { 'Content-Type': 'text/html' });
        res.write(data);
        res.end();
    });
});

server.listen(3000);
console.log('Start Server!');

HTML

<!DOCTYPE html>
<html lang="en">
    <head>
       <meta charset="UTF-8" />
       <meta http-equiv="X-UA-Compatible" content="IE=edge" />
       <meta name="viewport" content="width=device-width, initial-scale=1.0" />
       <title>Node.js HTML表示</title>
   </head>
    <body>
        <p>Node.jsでHTMLを表示する</p>
    </body>
</html>