在很多场景中,我们的服务器都需要跟用户的浏览器打交道,如表单提交。
表单提交到服务器一般都使用 GET/POST 请求。
1、由于GET请求直接被嵌入在路径中,URL是完整的请求路径,包括了?后面的部分,因此你可以手动解析后面的内容作为GET请求的参数。
项目根目录新建server.js 和 form.html
server.js
const http = require('http') var server = http.createServer(function (req,res) { var get = {} if(req.url.indexOf("?") != -1){ // 判断是否有请求在操作 var arr = req.url.split("?"); // arr[0]=>地址 '/aaa' var url = arr[0] // arr[1]=>数据 'user=xxx&pass=xxx' var arr2 = arr[1].split("&") // arr2=>['user=xxx','pass=xxx'] for(var i = 0;i < arr2.length; i++){ var arr3 = arr2[i].split("="); get[arr3[0]] = arr3[1] } console.log(url,get) }else { var url = req.url } }) server.listen(8080)
form.html
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/html"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="http://localhost:8080/aaa" method="get"> 用户:<input type="text" name="user"></br> 密码:<input type="password" name="pass"> <br> <input type="submit" value="提交"> </form> </body> </html>
这样可以看到打印出请求的数据
但是这里提取请求数据很不友好,nodejs提供了库querystring--查询字符串
对上面的代码改造
const http = require('http') const queryString = require("querystring") var server = http.createServer(function (req,res) { var get = {} if(req.url.indexOf("?") != -1){ // 判断是否有请求在操作 var arr = req.url.split("?"); var url = arr[0] get = queryString.parse(arr[1]) console.log(url,get) }else { var url = req.url } }) server.listen(8080)
启动服务,提交表单可以看到打印和之前的一样
但是还是要分隔url和参数,还是觉得麻烦,可以使用url模块
再对代码改造
const http = require('http') const urlLib = require("url") var server = http.createServer(function (req,res) { var obj = urlLib.parse(req.url,true)//第二个参数是是否解析参数 var url = obj.pathname; var get = obj.query console.log(url,get) }) server.listen(8080)
上面就是get请求的处理了
2、POST 请求的内容全部的都在请求体中,http.ServerRequest 并没有一个属性内容为请求体,原因是等待请求体传输可能是一件耗时的工作。
比如上传文件,而很多时候我们可能并不需要理会请求体的内容,恶意的POST请求会大大消耗服务器的资源,所以 node.js 默认是不会解析请求体的,当你需要的时候,需要手动来做。
传输大数据可以全部一起传输,也可以分段传输
const http = require('http') var server = http.createServer(function (req, res) { var str = "" // 接收数据(暂时) var i = 0 // 有一段数据到达(很多段) req.on('data', function (data) { // 通过req的data事件监听函数,每当接受到请求体的数据,就累加到str变量中 console.log(`第${i++}次收到数据`) str += data }) // 数据全部到达(一次) req.on('end', function () { // console.log(str) }) }) server.listen(8080)
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/html"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="http://localhost:8080/aaa" method="post"> 用户:<input type="text" name="user"></br> 密码:<input type="password" name="pass"> <br> <textarea name="content" id="" cols="30" rows="10"></textarea> <input type="submit" value="提交"> </form> </body> </html>
在textarea输入大量的内容提交,可以看到打印的结果显示多少次接受到数据
使用querystring解析数据
const http = require('http') const queryString = require('querystring') var server = http.createServer(function (req, res) { var str = "" var i = 0 // 有一段数据到达(很多段) req.on('data', function (data) { console.log(`第${i++}次收到数据`) str += data }) // 数据全部到达(一次) req.on('end', function () { // 解析参数 var post = queryString.parse(str) console.log(post) }) }) server.listen(8080)