您现在的位置是:网站首页> 编程资料编程资料
Node.js 搭建后端服务器内置模块( http+url+querystring 的使用)_node.js_
2023-05-24
289人已围观
简介 Node.js 搭建后端服务器内置模块( http+url+querystring 的使用)_node.js_
前言
这一节我们去学习NodeJs的内置模块:http、url、querystring ,并使用它们来搭建我们的node后端服务器,正式迈入后端开发!
一、创建服务器
http是node的内置模块,我们可以直接引入它进行使用,http这个模块内有一个createServer方法,这个方法可以帮助我们快速创建一个服务器:
// 引入http模块 const http = require("http"); // 创建服务器 http.createServer((req, res) => { // req:接受浏览器传的参数 // res:返回渲染的内容 }).listen(3000, () => { // 服务器端口号为3000 console.log("服务器启动啦!"); });另一种写法(推荐写法):
const http = require("http"); // 创建服务器 const server = http.createServer(); server.on("request", (req, res) => { // req:接受浏览器传的参数 // res:返回渲染的内容 }); server.listen(3000,() => { // 服务器端口号为3000 console.log("服务器启动啦!"); });createServer方法返回一个服务器对象,对象内有一个listen方法,可以设置服务器启动的端口号和启动成功的回调内容

通过nodemon运行这个文件(nodemon可以在我们修改文件后帮助我们自动重启服务器),控制台打印出了我们在listen中设置的回调内容,说明服务器启动成功了
我们直接在浏览器访问http://localhost:3000/时会发现浏览器一直在转圈圈加载
注意: 直接在浏览器地址栏里访问服务器接口,相当于是使用
get请求访问服务器接口(并且没有跨域限制)

这是因为我们并没有在我们创建的node服务器中返回任何内容
二、返回响应数据
我们可以通过我们定义的res(response对象)参数向客户端发送响应内容:
const http = require("http"); // 创建服务器 http.createServer((req, res) => { // req:接受浏览器传的参数 // res:返回渲染的内容 // 传递数据 res.write("hello world"); res.write("Ailjx"); res.end(); }).listen(3000, () => { console.log("服务器启动啦!"); });write方法传递内容,可以调用多次write传递多条内容,内容必须是字符串格式最后必须调用end方法告诉请求的调用者我们响应结束了也可以直接在end方法内传递内容,效果与使用write方法相同,但end方法只能调用一次
运行上述代码,我们直接在浏览器调用服务器接口:

如果服务器中不调用end方法,浏览器会收不到服务器传递的响应结束的信号,便会一直加载请求:

返回复杂对象数据
可以传递复杂对象数据,但必须是字符串(JSON)的格式:
const http = require("http"); // 创建服务器 http.createServer((req, res) => { // end方法也可以传递内容,效果与write相同 res.end("{name:{me:'Ailjx'}}"); // 或者res.end(JSON.stringify({ name: { me: "Ailjx" } })); }).listen(3000, () => { console.log("服务器启动啦!"); });
上面浏览器显示的数据被格式化了,是因为我在浏览器中安装了FeHelper(前端助手)插件,能够自动格式化JSON数据
返回html文档数据
const http = require("http"); // 创建服务器 http.createServer((req, res) => { // 传递html内容 res.end(` 我是Ailjx,你好!
`); }).listen(3000, () => { console.log("服务器启动啦!"); });
这时发现我们传递的中文乱码了,我们可以在响应头的Content-Type中指定utf-8的字符集来解析中文,下面会讲到
三、设置响应头和状态码
我们可以使用response对象的writeHead方法来同时设置状态码和响应头信息:
const http = require("http"); // 创建服务器 http.createServer((req, res) => { // 设置相应头,第一参数为状态码,第二个参数为响应头配置,第二个参数可不填 res.writeHead(200, { "Content-Type": "text/html;charset=utf-8" }); // 传递html内容 res.end(` 我是Ailjx,你好!
`); // 直接在end中传递,效果与write方法相同 }).listen(3000, () => { console.log("服务器启动啦!"); });
我们也可以使用setHeader单独设置响应头信息,statusCode单独设置状态码:
const http = require("http"); // 创建服务器 http.createServer((req, res) => { // 设置相应头信息 res.setHeader("Content-Type", "text/html;charset=utf-8"); // 设置状态码 res.statusCode = 200; // 传递html内容 res.end(` 我是Ailjx,你好!
`); // 直接在end中传递,效果与write方法相同 }).listen(3000, () => { console.log("服务器启动啦!"); });四、实现路由接口
上面我们已经成功创建了一个服务器,并能够使用res参数中的write或end方法向调用者发送内容,但发送的这些内容是不会随着我们请求的路径而变化的:
const http = require("http"); // 创建服务器 const server = http.createServer(); server.on("request", (req, res) => { res.end("Ailjx"); }); server.listen(3000);

可以看到,我们请求(访问)不同路径,服务器返回的数据都是一样的,而我们在实际开发中往往是需要不同的路径有不同的数据
这时我们就可以利用我们创建服务器时定义的req参数(request对象)来获取用户请求的路径从而判断需要返回哪些数据:
const http = require("http"); // 创建服务器 const server = http.createServer(); server.on("request", (req, res) => { // req.url拿到用户请求的路径 console.log(req.url); res.end(); }); server.listen(3000);运行代码,之后在浏览器访问调用一下http://localhost:3000/list,控制台会打印出:

可以看到我们访问的/list路径确实被打印出来了,但怎么还打印了一个/favicon.ico呢?
这其实是浏览器在访问一个域名时会自动访问该域名下的/favicon.ico静态文件,来作为网页标签栏的小图标,所以我们的服务器才会打印出/favicon.ico
如果是普通的ajax调用接口是不会出现这种情况的,这里我们是为了方便,直接使用浏览器访问接口来进行演示,所以才出现这种请求,我们可以简单做一下处理:
const http = require("http"); // 创建服务器 const server = http.createServer(); server.on("request", (req, res) => { // req.url获取用户请求的路径 if (req.url === "/favicon.ico") { // 读取本地图标 return; } console.log(req.url); res.end("Ailjx"); }); server.listen(3000);这样当服务器收到/favicon.ico请求时就能直接跳过不对其进行处理
创建简易路由应用
现在,我们开始实现一个简易的路由应用,我们先创建两个模块:
renderContent.js用来根据用户请求路径来返回对应的内容:
function renderContent(url) { switch (url) { case "/api/home": return ` { page:'首页' } `; case "/api/about": return ` { page:'关于页' } `; default: return "404"; } } exports.renderContent = renderContent;renderStatus.js用来根据用户请求的路径来返回对应的响应状态码:
function renderStatus(url) { const arr = ["/api/home", "/api/about"]; return arr.includes(url) ? 200 : 404; } module.exports = { renderStatus, };之后在我们的服务器文件server.js中调用这两个模块:
const http = require("http"); const { renderContent } = require("./module/renderContent"); const { renderStatus } = require("./module/renderStatus"); // 创建服务器 const server = http.createServer(); server.on("request", (req, res) => { // req.url获取用户请求的路径 if (req.url === "/favicon.ico") { return; } // 响应头 res.writeHead(renderStatus(req.url), { // 标志返回JSON数据 "Content-Type": "application/json", }); // 返回的内容 res.end(renderContent(req.url)); }); server.listen(3000);之后启动服务器,在浏览器调用接口查看效果:


五、处理URL
在上面我们通过判断req.url来实现了简易的路由接口应用,但当用户调用带有url参数的接口时,这就会出现问题:

这是因为这时req.url为/api/about?name=ailj而并不是/api/about,我们可以手动的对这个字符串进行处理来获得正确的路由路径,也可以使用node.js的内置模块url来处理
URL格式转换
修改上面的server.js文件:
const http = require("http"); const url = require("url"); const { renderContent } = require
相关内容
- 微信小程序实现简单计算器与秒表_javascript技巧_
- 解决vue3打包过后空白页面的情况_vue.js_
- 微信小程序实现计算器(含历史记录)_javascript技巧_
- Vue3 构建 Web Components使用详解_vue.js_
- Node.js 中常用内置模块(path 路径模块)_node.js_
- React状态管理器Rematch的使用详解_React_
- 小程序实现登录功能_javascript技巧_
- vue使用swiper的时候第二轮事件不会触发问题_vue.js_
- 微信小程序实现简易计算器功能_javascript技巧_
- vue获取token如何实现token登录_vue.js_
点击排行
本栏推荐
