由于自己的代码问题失误来思考一下前后端数据传输的事儿

前言

我对自己的后台(express)进行接口测试的时候发现取不到req.body请求体,后来百度了一下了解到因为我用的REST Client插件使用的post传参是以request payload形式发送后台的而这种格式需要以数据流的模式来接受或者使用express.json()数据处理中间件,还有一个常用的数据处理中间件express.urlencoded 用来解析application/x-www-form-urlencoded格式数据,随后增加中间件后问题还是没有得到解决,遂再次百度无果,最后发现是自己设置请求时请求头内容和数据体内容之间没有隔开导致请求头被当做数据一起发送了。

引发思考的问题1-前后台交互式传送的数据格式和编码类型

HTTP请求中Request Payload 和 From Data的区别

浏览器这两种格式的选择是依据Content Type的类型来决定的

  • 当Content Type为application/x-www-form-urlencoded(键值&键值)时将会是Form Data
  • 当Content Type为application/json或者multipart/form-data时则是Request Payload

Content Type各类型有什么区别

Content Type 描述
application/x-www-form-urlencoded 常见,form表单默认提交方式,ajax也常以这种方式提交
multipart/form-data 不对字符编码。在使用包含文件上传控件的表单时,必须使用该值
application/json 序列化的JSON字符串,支持复杂的结构化数据,适合RESTful风格接口
text/plain 空格转换为 "+" 加号,但不对特殊字符编码
text/xml xml可扩展标记语言,逐渐被JSON取代

引发思考的问题2-如何接受数据流模式以及数据处理中间件的使用

以express为例:

方式 处理
Form Data req.body
Request Payload var str="";req.on("data",function(chunk){str+=chunk})

使用数据处理中间件后Request Payload也可以通过req.body拿到数据

express 4.16.0之前 我们可以使用border-parser插件
app.use(borderParser.json())解析application/json格式
app.use(borderParser.urlencoded({extend:false}))解析application/x-www-form-urlencode格式
express 4.16.0之后 我们要将borderParser替换为express
const express = require('express')就是这个express
因为他们被内置了 芜湖~~~~ 不用再装插件了

PS 题外话

众所众知http请求一般分为简单请求和非简单请求,简单请求就是单纯发送一条请求
而非简单请求则会提前发送一条预检请求来向服务器确定正式请求能否正确发送,而正式请求的进入队列的timing是早于预检请求的,而开始timing则是晚于预检请求,所以顺序应该是正式请求进入队列->预检请求进入队列->预检请求开始执行->正式请求开始执行

上一篇:热更新


下一篇:「计算机基础」在0和1的世界里来来回回