Node.js服务器开发(上)

Posted 橘猫吃不胖~

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Node.js服务器开发(上)相关的知识,希望对你有一定的参考价值。

Node.js服务器开发(上)

1 概述

为什么学习服务器开发:
(1)能够和后端程序员更加紧密配合
(2)网站业务逻辑前置
(3)扩宽知识视野

服务器开发可以做哪些事情:
(1)实现网站的业务逻辑
(2)实现数据的增删改查

一个完整的网站应用程序主要由客户端和服务器端两大部分组成。我们可以将服务器理解为一台计算机,主要负责存储数据和处理应用逻辑。

用Node.js来代替传统的服务端语言(如Java、php语言等),开发服务端的网站应用。客户端和服务器端网站开发流程:

2 一些基本知识

IP地址:互联网设备的唯一标识,代表互联网协议地址。
IPV4:“点分十进制”表示成a.b.c.d的形式(32位),例如:192.168.101.15。IPV4是互联网的核心,也是使用最广泛的网际协议版本,但是IPV4地址已经枯竭了。
IPV6:采用冒号十六进制表示(128位),格式为X:X:X:X:X:X:X:X,其中每个X表示地址中的16b,以十六进制表示,例如:ABCD:EF01:2345:6789:ABCD:EF01:2345:6789

端口:计算机提供的某个服务的接口。计算机系统的端口有65535个,不同的服务端口号不同。一般来说,不使用0到1024之间的数字,因为这是操作系统软件,以及常用软件占用的端口。
mysql的默认端口:3306
MongoDB:27017

URL:统一资源定位符,用于定位互联网上某个资源的编址方式。

本地机作为服务器:
IP:127.0.0.1
域名:localhost

http协议:超文本传输协议。是一个无状态协议
(1)请求消息:是客户端向服务器端发送请求时所携带的数据块
(2)响应消息:是服务器端向客户端发送响应时所携带的数据块
(3)请求方式:规定客户端和服务器端联系的类型

请求方式说明
get在浏览器地址栏输入URL地址或单击网页中的超链接
post在form标签的method中指定为post

3 创建Node.js网站服务器

Node.js网站服务器必须满足以下3个条件:
(1)网站服务器必须是一台计算机;
(2)计算机上需要安装Node.js运行环境;
(3)使用Node.js创建一个能够接收请求和响应请求的对象。

示例代码:在Node.js中创建网站服务器,并实现客户端向服务器端发送请求,服务器端向客户端做出响应。

第一步:创建app.js文件,编写如下代码

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    // req:是request请求对象的简写,封装了客户端的请求信息
    // res:是response响应对象的简写,封装了服务器端给客户端的响应信息
    res.end("<h1>Hello World</h1>"); // 响应信息
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

第二步:运行程序

在终端显示以下内容,并且终端运行不会停止:

在浏览器中输入localhost:3000,会显示以下页面:

如果将程序结束运行则不会显示该页面。

req:是request请求对象的简写,封装了客户端的请求信息
res:是response响应对象的简写,封装了服务器端给客户端的响应信息

4 HTTP协议

4.1 概念

什么是HTTP协议:

  • HTTP(Hyper Text Transfer Protocol)全称为超文本传输协议;
  • HTTP协议规定了如何从网站服务器传输超文本到本地浏览器;
  • HTTP协议基于客户端服务器架构工作,是客户端(用户)和服务器端(网站)请求和应答的标准。
  • HTTP协议可以使浏览器更加高效,使网络传输减少。
  • HTTP协议不仅保证计算机正确快速地传输超文本文档,还确定传输文档中的哪一部分,以及哪部分内容首先显示(如文本先于图形)等。

基于HTTP协议的客户端和服务器端的交互过程

4.2 请求消息

在HTTP请求和响应的过程中传递的数据块就叫HTTP消息,包括要传送的数据和一些附加信息,并且要遵守规定好的格式。

4.2.1 概念

请求消息是指客户端向服务器端发送请求时所携带的数据块。

请求方式用来规定客户端与服务器端联系的类型。

HTTP协议中常用的请求方式主要是GET和POST两种:

  1. 当用户在浏览器地址栏中直接输入某个URL地址或者单击网页上一个超链接时,浏览器将默认使用GET方式发送请求。
  2. 如果将网页上的标签的method属性设置为post,那么就会以POST方式发送请求。

4.2.2 获取请求方式req.method

示例代码1:获取请求方式(GET),在app.js文件中写入以下代码:

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    // req.method:获取客户端的请求方式
    console.log("请求方式为:", req.method);
    res.end("<h1>Hello World</h1>"); // 响应信息
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

在浏览器中输入地址:localhost:3000,出现以下页面:

同时在终端显示以下内容:

示例代码2:新建form表单发送POST请求,新建form.html文件,代码如下

<form method="post" action="http://localhost:3000">
    <input type="submit">
</form>

运行app.js文件,在浏览器中打开form.html文件,点击提交按钮,就会跳转页面:

此时终端输出信息如下:

req.method:获取客户端的请求方式

4.2.3 分开处理GET和POST请求

在服务器收到GET请求和POST请求后,如何分开处理呢,下面用一段代码进行演示。

示例代码1:编写app.js文件

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    if (req.method == "POST")  // 如果请求方式为POST
        console.log("POST请求");
     else if (req.method == "GET")  //如果请求方式为GET
        console.log("GET请求");
    
    res.end("<h1>Hello World</h1>"); // 响应信息
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

运行该程序,在浏览器中访问:localhost:3000,出现以下结果:

同时在终端输出以下信息:

示例代码2:编写form.html文件

<form method="post" action="http://localhost:3000">
    <input type="submit">
</form>

运行form.html,点击页面中的提交,会跳转该页面:

同时终端输出以下信息:

4.2.4 根据不同URL发送不同响应内容

req.url:获取客户端请求的地址。

示例代码:

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    let url = req.url; // 获取客户端请求的地址
    res.end(url);
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

运行上面的程序,在浏览器中输入网址:http://localhost:3000,那么页面上会出现一个“/”:

如果将浏览器的地址修改为:localhost:3000/home,网页会显示“/home”

根据这个特性,我们就可以根据不同的URL向浏览器发送不同的响应内容了,下面根据实例来说明。

示例代码:新建server.js文件,代码如下

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    let url = req.url; // 获取客户端请求的地址
    if (url == "/" || url == "/index") 
        res.end("Welcom to HomePage!");
     else if (url == "/cat") 
        res.end("Welcome to CatPage!");
     else 
        res.end("Not Found!");
    
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

启动服务器,在浏览器中输入:localhost:3000或者localhost:3000/index,页面会显示:Welcom to HomePage!


如果在浏览器中输入地址:localhost:3000/cat,页面上会显示:Welcome to CatPage!

如果输入其他的地址,比如:localhost:3000/dog,页面上就会显示:Not Found!

4.2.5 获取请求头req.headers

请求头是请求消息的一部分,它由客户端浏览器自动发送给服务器,服务器通过请求头可以获取本次请求的相关信息,如浏览器类型。

谷歌浏览器内如何查看请求头信息:https://blog.csdn.net/m0_46612221/article/details/121251287?spm=1001.2014.3001.5502

请求头的格式为键值对,键和值用英文冒号“:”分隔,这些键值对又称为属性。典型的请求头属性如下:

属性说明
User-Agent产生请求的浏览器类型。
Accept客户端可识别的响应内容类型列表。星号 “ * ” 用于按范围将类型分组,用“/”指示可接收全部类型,用“type/*”指示可接收type 类型的所有子类型。
Accept-Language客户端可接收的自然语言。
Accept-Encoding客户端可接收的编码压缩格式。
Accept-Charset可接收的应答的字符集。
Host请求的主机名,允许多个域名同处一个IP 地址,即虚拟主机。
connection连接方式(close 或keepalive)。
Cookie存储于客户端扩展字段,向同一域名的服务器端发送属于该域的cookie。

示例代码:获取请求头

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    // 获取请求头
    let header = req.headers;
    console.log(header);
    // 获取请求头的某一项信息
    console.log("主机名:", header["host"]);
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

启动服务器,在浏览器中输入localhost:3000,就会在终端输出请求头信息,以及某一项信息:

4.3 响应消息

4.3.1 概念

响应消息是指服务器端向客户端进行响应请求时所携带的数据块。

在响应消息中,对于客户端的每一次请求,服务器端都要给予响应,在响应的时候我们可以通过状态码告诉客户端此次请求是成功还是失败。

状态代码由3位数字组成,表示请求是否被理解或被满足。HTTP响应状态码的第一个数字定义了响应的类别,后面两位没有具体的分类,第1位数字有5种可能的取值:
1**:请求已接收,需要继续处理。
2**:请求已成功被服务器接收、理解并接受。
3**:为完成请求,客户端需进一步细化请求。
4**:客户端的请求有错误。
5**:服务器端出现错误。

HTTP协议常见的状态码:

状态码说明
200表示请求—响应的过程已经成功完成
302表示请求地址异常变化
404表示服务器找不到客户端请求的资源(请求的资源不存在)
400表示客户端请求有语法错误
500表示服务器端错误,无法处理客户端的请求

服务器端返回结果给客户端时,通常需要指定内容类型(content-type属性)

属性说明
text/plain返回纯文本格式。
text/html返回HTML格式。
text/css返回CSS格式。
application/javascript返回JavaScript格式。
image/jpeg返回JPEG图片格式。
application/json返回JSON代码格式。

4.3.2 设置内容类型

在了解了响应内容类型后,下面演示通过设置内容类型,将响应内容“<hl>橘猫吃不胖</hl>”中的HTML 标签<h1></h1>作为普通文本输出到页面中。

示例代码:

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    // 设置响应头消息
    res.writeHead(200, 
        "content-type": "text/plain"
    )
    // 响应消息
    res.end("<h1>橘猫吃不胖</h1>");
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");

启动服务器后,在浏览器中输入:localhost:3000,浏览器页面显示如下:

浏览器以纯文本形式显示了信息,如果将content-type属性设置为text/html,则会将标签效果显示出来:

// 引用系统模块
const http = require("http");

// 创建服务器对象
const app = http.createServer();

// 给服务器注册监听事件
app.on("request", (req, res) => 
    // 设置响应头消息
    res.writeHead(200, 
        "content-type": "text/html"
    )
    // 响应消息
    res.end("<h1>橘猫吃不胖</h1>");
)

// 监听3000端口
app.listen(3000);
console.log("服务器已启动,监听3000端口,请访问localhost:3000");


这时我们发现在浏览器中显示的是乱码,我们同样可以通过设置content-type属性来切换,代码如下:

    // 设置响应头消息
    res.writeHead(200, 
        "content-type": "text/html;charset=utf8"
    )

这时浏览器就可以正常显示文字了。

5 Node.js服务器开发(下)

Node.js服务器开发(下):Node.js服务器开发(下)

以上是关于Node.js服务器开发(上)的主要内容,如果未能解决你的问题,请参考以下文章

Node.js系列-http

15K的前端应届毕业生,就因为掌握了这些知识点!(前端企业级开发必备)

15K的前端应届毕业生,就因为掌握了这些知识点!(前端企业级开发必备)

Node.js服务器开发(下)

typescript写给JS老鸟的TS速成教程

在node.js和serial.js上使用AT +命令发送文本消息