Nodejs之搭建本地服务器

JAY.LIN 收录于 Nodejs

2024-12-17 约 1173 字预计阅读 3 分钟

https://bing.ee123.net/img/rand?artid=90644538

Nodejs之搭建本地服务器

Nodejs之搭建简单服务器

以下内容转载编辑自 ,

以下内容相应代码已上传至GitHub：https://github.com/tsora-c/node-server

引入required模块

我们使用 require 指令来载入 http 模块，并将实例化的 HTTP 赋值给变量 http，实例如下:

const http=require("http");

创建服务器

接下来我们使用 http.createServer() 方法创建服务器，并使用 listen 方法绑定 8888 端口。函数通过 request, response 参数来接收和响应数据。

实例如下，在你项目的根目录下创建一个叫 server.js 的文件，并写入以下代码：

const http =require("http");
// 设置端口
const post=8888;
http.createServer((request,response)=>{
    // 发送 HTTP 头部 
    // HTTP 状态值: 200 : OK
    // 内容类型: text/plain
    response.writeHead(200,{
        "Content-Type":"text/plain"
    });
    // 发送响应数据 "Hello World"
    response.write("Hello World\n"); 
    // 结束
    response.end();
}).listen(post);
// 终端打印如下信息
console.log("Server running at http://127.0.0.1:"+post+"/");

以上代码我们完成了一个可以工作的 HTTP 服务器。

使用 node 命令执行以上的代码：

node server.js
Server running at http://127.0.0.1:8888/

接下来，打开浏览器访问 http://127.0.0.1:8888/ ，你会看到一个写着 “Hello World"的网页。

到这里，一个简单的服务器就基本完成了，但是仅能显示这些并不是服务器该做的事

服务器首页

一个服务器起码得有个显示首页，作为服务器的门户；

新建一个简单的 index.html 作为服务器首页，代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <h1>Index</h1>
</body>
</html>

那么就需要读取html文件的内容，node中的File System模块就提供这样的功能

修改server.js代码

// 声明http协议
const http = require("http");
// 声明文件操作系统对象
const fs = require("fs");
// 声明端口
const post = 8888;
http.createServer((request, response) => {
    // 发送 HTTP 头部 
    // HTTP 状态值: 200 : OK
    // 内容类型: text/html
    response.writeHead(200, {
        "Content-Type": "text/html"
    });
    fs.readFile("./index.html", 'utf-8', (err, data) => {
        if (err) {
            throw err;
        }
        // 发送响应数据
        response.write(data);
        // 结束
        response.end();
    })

}).listen(post);
// 终端打印如下信息
console.log("Server running at http://127.0.0.1:" + post + "/");

打开浏览器访问 http://127.0.0.1:8888/ ，网页就已经变成index页面。

服务器多页面

同样，一个服务器仅有一个首页也是远远不够的；

新建一个简单的 about.html 作为服务器介绍页面，代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <h1>about</h1>
</body>
</html>

那么该如何切换页面？很显然，就是根据地址栏来判断加载相应的页面文件；

那么这些相应的信息在哪里？就在 http.createServer 的回调函数中 request 对象中

修改server.js代码

// 声明http协议
const http = require("http");
// 声明文件操作系统对象
const fs = require("fs");
// 声明端口
const post = 8888;
http.createServer((request, response) => {

    const url = request.url;
    // 发送 HTTP 头部 
    // HTTP 状态值: 200 : OK
    // 内容类型: text/html
    response.writeHead(200, {
        "Content-Type": "text/html"
    });
    if (url === "/" || url === "/index") {
        fs.readFile("./index.html", 'utf-8', (err, data) => {
            if (err) {
                throw err;
            }
            // 发送响应数据
            response.write(data);
            // 结束
            response.end();
        })
    }
    else{
        fs.readFile("./about.html", 'utf-8', (err, data) => {
            if (err) {
                throw err;
            }
            // 发送响应数据
            response.write(data);
            // 结束
            response.end();
        })
    }

}).listen(post);
// 终端打印如下信息
console.log("Server running at http://127.0.0.1:" + post + "/");

打开浏览器访问 http://127.0.0.1:8888/ ， http://127.0.0.1:8888/index ， http://127.0.0.1:8888/about ，网页就已经变成index页面。

调整文件位置

为了方便代码维护以及读取，我们就需要修改文件相应位置以及命名

当然这些依据个人习惯以及项目要求设定

以下仅代表个人观点

拓展

基于现学的相应知识，我们可以拓展完成哪下内容

简单服务器
简单路由