当前位置:网站首页 > 技术博客 > 正文

formdataparam



最近一直都比较忙,坚持月月更新博客的计划不得中止了,今天抽出点时间来说说最近项目中遇到的一个问题,有关request post请求格式中的multipart/form-data格式。

最近在参与一个项目过程中遇到一个问题,相信大部分人都遇到过:

在后端与前端约定好application/json格式传递数据时,因为后台是强类型语言,在定义api接口时,某些字段要求是整型类型,但是对于前端来说输入框或者从url中的search取到的参数都是字符串,不得不进行前端类型转换。

咋一看,对于接口参数比较少的api前端转换没有什么,但是对于一般的交互复杂,参数比较多的接口,要对大部分参数进行类型转换就是一种吃力不讨好的活。好在后端同学还支持另一种的前后端数据交互格式,即。通过该格式后端取到前端传递的数据就是数字了(即使前端传递的是字符串),而不像json格式获取的是字符串。这样,就不需要额外对前端获取的数据进行特殊转换了。下面就来说说form-data。

是基于post方法来传递数据的,并且其请求内容格式为Content-Type: multipart/form-data,用来指定请求内容的数据编码格式。另外,该格式会生成一个字符串来分割请求头与请求体的,具体的是以一个来进行分割,伪码如下:

 

上面之后就是请求体内容了,请求体内容各字段之间以来进行分割,以来结束请求体内容。具体可以参考下面例子:

 

格式一般是用来进行文件上传的。使用表单上传文件时,必须让

表单的 enctype 等于 ,因为该值默认值为。

添加了一个新的接口FormData。利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的方法来异步的提交这个"表单"。

 
 

上面创建了一个FormData对象,通过进行ajax请求时,会自动为其将其转为格式,无需手动添加格式。

对于FormDat对象,像上面那种形式可以直接添加参数比较方便,但是对于对象或者嵌套对象:

 
 

上面形式添加formData参数user,并不会获取到其真正的内容,而是返回userObj的Object.prototype.toString.call(userObj)的值作为user字段的值。

 
 

遗憾的是,FormData对象没有像JSON.stringify那样的方法能批量将对象形式转换为对应的形式,formData而言是将对象的转换为正确formData请求参数字段名,例如如下对象:

 
 

这样转换为FormData对象时,其对应的key应该是下面这样的:

 
 

这样,就需要我们自己手动来实现一个转换数据函数,具体代码如下:

 
 

这样,就可以将对象转化为对应的formData的格式了。

1、四种常见的 POST 提交数据方式
2、转换formdata参数格式
2、gist
3、fetch

版权声明


相关文章:

  • 跳表数据结构与算法2024-11-11 12:30:02
  • 重载乘法运算符的函数原型声明2024-11-11 12:30:02
  • 红黑树的概念2024-11-11 12:30:02
  • opengl教学视频2024-11-11 12:30:02
  • 好看的ui网站2024-11-11 12:30:02
  • 内置声卡精调2024-11-11 12:30:02
  • 创建用户并指定uid2024-11-11 12:30:02
  • c++ map和multimap2024-11-11 12:30:02
  • 多线程编程有什么用途2024-11-11 12:30:02
  • cp-i命令2024-11-11 12:30:02