个性化阅读
专注于IT技术分析

node.js开发web服务器,读取html文件并显示html页面

最近项目开发遇到要使用node.js,如何使用node.js开发一个web服务器呢?其实很简单,如何要显示更美观的页面我们就需要去读取html文件在网页中显示。在写web服务前,首先要确保你会JavaScript,有一个在使用的编辑器,这里使用的是VSCode,预先安装了node.js,如果你还没安装node.js或者不是使用nvm安装的,请看这里的安装教程:Windows使用nvm安装node.jsOS X使用nvm安装node.js

node.js开发web服务器

一、使用node.js写一个简单的web服务器

Node.js写web服务器要遵循几个步骤:使用require引入node的http模块、创建http服务器、监听服务器端口、接收请求和响应请求。

1、引入node的http模块

var http = require("http");

2、创建http服务器并监听端口

// 创建一个http服务器
var server = http.createServer(function (request, response){
    // request为客户端请求,response为服务端响应
});
server.listen(8888); // 监听端口

3、接收请求和响应请求

该http服务器完整代码如下:

var http = require("http");

// 创建一个http服务器
var server = http.createServer(function (request, response){
    // request为客户端请求,response为服务端响应
    response.writeHead(200, {"Content-Type": "text/plain"});
    // 返回数据
    response.end("The Message from Node.js Server.");
});
server.listen(8888); // 监听端口
console.log("Sever Running At http://localhost:8888");

4、使用node启动web服务器

在命令行中切换到当前项目路径,在VSCode中使用Ctrl+`打开命令行,输入如下命令启动web服务器:

node启动http服务器

5、打开浏览器访问web服务器

node web服务器显示效果

二、node.js读取html文件并显示页面

以上在浏览器中显示的web服务器内容是不是好简单,而且也不够美观,那么开发中我们该如何做到和别人的网页一样美观呢?这就使用到node中的fs文件模块了,其中的html文件是来自bootstrap的一个示例模板。

读取html文件首先要引入fs模块,使用readFile函数进行读取,将读取的结果传给response的end函数,这样就可以在网页中显示了。

1、引入fs模块

var fs = require("fs");

2、读取html文件并返回给客户端

// request为客户端请求,response为服务端响应
    response.writeHead(200, {"Content-Type": "text/html"});
    // 返回数据
    fs.readFile(__dirname + "/index.html", "utf-8", function (error, data){
        if(error)
            response.end("read html file error.");
        else
            response.end(data.toString());
    });

3、使用node运行web服务器,然后在浏览器中浏览页面

node服务器显示html页面

以上就是使用node.js开发web服务器的完整内容了,上面只是简单地读取并显示HTML页面,如果需要填充数据则需要用到模板,例如ejs或jade模板引擎,node.js完整的web开发框架可以使用express,本节内容比较简单,希望可以帮到你。

赞(0) 打赏
未经允许不得转载:srcmini » node.js开发web服务器,读取html文件并显示html页面
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏