位置: IT常识 - 正文

浅谈 JSON 对象和 FormData 相互转换,打通前端与后端的通信血脉(json与对象的区别)

编辑:rootadmin
浅谈 JSON 对象和 FormData 相互转换,打通前端与后端的通信血脉 前言

推荐整理分享浅谈 JSON 对象和 FormData 相互转换,打通前端与后端的通信血脉(json与对象的区别),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:json对象与json字符串的区别,json与对象的区别,json对象是什么类型,json对象和javascript对象,json与对象,json对象和java对象的区别,json对象和java对象的区别,json对象和javascript对象,内容如对您有帮助,希望把文章链接给更多的朋友!

大家都知道,前端在和后台进行交互联调时,肯定避免不了要传递参数,一般情况下,params 在 get 请求中使用,而 post 请求下,我们有两种常见的传参方式: JSON 对象格式和 formData 格式,但是一些场景是需要我们对这两种数据格式进行转换的,例如表单提交,有些是 JSON 对象格式的数据,有些是 FormData 格式的数据,这个时候就需要我们对其进行转换。

常见的 POST 提交数据方式1. application/x-www-form-urlencoded

表单格式提交数据,通过 form 标签的 action 属性,如果不设置 enctype 属性,那么最终就会以 application/x-www-form-urlencoded 方式提交数据。

2. multipart/form-data

这也是一个常见的 post 数据提交的方式,我们使用表单上传文件时,就要让 form 的 enctype 等于这个值,多用于文件上传。

3. application/json

application/json 这个 Content-Type 作为响应头大家肯定不陌生,客观来说,现在越来越多的人把它作为请求头,用来告诉服务端消息主体是序列化后的 json 字符串。由于 json 规范的流行,除了低版本 IE 之外的各大浏览器都原生支持 JSON.stringify,服务端语言也都有处理 json 的函数,使用 json 不会遇上什么麻烦,并且 json 格式支持比键值对复杂的多的结构化数据。

4. text/xml

相比于 json,xml 不能更好的适用于数据交换,它包含了太多的包装,而且它跟大多数编程语言的数据模型不匹配,xml 是面向数据的,json 是面向对象和结构的。目前多用于 XML 存储数据,存储配置文件等需要结构化存储的地方使用。

JSON 格式和 formData 格式的区别

JSON 请求头:

浅谈 JSON 对象和 FormData 相互转换,打通前端与后端的通信血脉(json与对象的区别)

JSON 负荷:

formData 请求头:

formData 负荷:

通过上面的几张图我们就能大概明白了,前端传的都是二进制数据,两者的 content-type 是不同的,json 我们已经序列化好了,而 formdata 还是需要进行处理。

formdata 的两种格式

multipart/form-data:既可以上传文件等二进制数据,也可以上传表单键值对,只是最后会转化为一条信息;x-www-form-urlencoded:只能上传键值对,并且键值对都是间隔分开的。json 对象转 formData

逐个转换

let obj = { id: "001", name: "小蓝", age: "18", sex: "女",};const formData = new FormData();formData.append("id", obj.id);formData.append("name", obj.name);formData.append("age", obj.age);formData.append("sex", obj.sex);console.log(formData);

所有属性值转换

let obj = { id: "001", name: "小蓝", age: "18", sex: "女",};const formData = new FormData();Object.keys(obj).map((key) => { formData.append(key, obj[key]);});console.log(formData);formData 对象转 jsonvar jsonObj = {};formData.forEach((value, key) => (jsonObj[key] = value));
本文链接地址:https://www.jiuchutong.com/zhishi/298322.html 转载请保留说明!

上一篇:机器学习篇-指标:AUC

下一篇:图片格式转换(File、Blob、base64)(图片格式转换pdf)

  • 关于网店推广你可以少走弯路(网店推广文章)

    关于网店推广你可以少走弯路(网店推广文章)

  • 苹果手机通讯录怎么备份(苹果手机通讯录没有了怎么恢复)

    苹果手机通讯录怎么备份(苹果手机通讯录没有了怎么恢复)

  • 360云盘现在还能用吗(360云盘还能登录吗)

    360云盘现在还能用吗(360云盘还能登录吗)

  • 小米10青春版如何设置显示网速(小米10青春版如何换屏幕)

    小米10青春版如何设置显示网速(小米10青春版如何换屏幕)

  • 电脑桌面表格图标x怎么变成S了(电脑桌面表格图标变成白色打不开了)

    电脑桌面表格图标x怎么变成S了(电脑桌面表格图标变成白色打不开了)

  • 怎样用微信充值天府通(怎样用微信充值etc卡)

    怎样用微信充值天府通(怎样用微信充值etc卡)

  • wps会自动保存吗(电脑自动关机wps会自动保存吗)

    wps会自动保存吗(电脑自动关机wps会自动保存吗)

  • 淘宝过了七天无理由还可以退货吗(淘宝过了七天无理由)

    淘宝过了七天无理由还可以退货吗(淘宝过了七天无理由)

  • 如何二次修改微信id(如何二次修改微信名字)

    如何二次修改微信id(如何二次修改微信名字)

  • ttkn是什么文件夹(tkm什么文件)

    ttkn是什么文件夹(tkm什么文件)

  • 笔记本充满电关机能维持多久(笔记本充满电关机后是继续充还是拔掉)

    笔记本充满电关机能维持多久(笔记本充满电关机后是继续充还是拔掉)

  • 苹果位置共享怎么看不到对方(苹果位置共享怎么打开)

    苹果位置共享怎么看不到对方(苹果位置共享怎么打开)

  • 恢复出厂设置后电话号码还在吗(恢复出厂设置后无法激活)

    恢复出厂设置后电话号码还在吗(恢复出厂设置后无法激活)

  • 华为m6怎么接u盘(华为m6插u盘没反应)

    华为m6怎么接u盘(华为m6插u盘没反应)

  • 华为畅享10plus充电速度(华为畅享10plus充电器型号)

    华为畅享10plus充电速度(华为畅享10plus充电器型号)

  • 微信文件删了怎么恢复(微信文件删了怎么撤回)

    微信文件删了怎么恢复(微信文件删了怎么撤回)

  • qq怎么复制别人的名片(qq怎么复制别人的个性签名)

    qq怎么复制别人的名片(qq怎么复制别人的个性签名)

  • 携程10元套餐怎么取消(携程10元套餐怎么退)

    携程10元套餐怎么取消(携程10元套餐怎么退)

  • 苹果x分屏功能怎么打开(苹果x分屏功能怎么关闭)

    苹果x分屏功能怎么打开(苹果x分屏功能怎么关闭)

  • 爱玛小蜜豆充电口在哪(爱玛小蜜豆充电器头是什么样子的)

    爱玛小蜜豆充电口在哪(爱玛小蜜豆充电器头是什么样子的)

  • qq绿钻有什么用(qq绿钻有什么用吗)

    qq绿钻有什么用(qq绿钻有什么用吗)

  • nxtcl00是什么型号

    nxtcl00是什么型号

  • 短横线怎么打(word短横线怎么打)

    短横线怎么打(word短横线怎么打)

  • 最新2020.12win10万能激活秘钥分享 附激活工具+教程(最新windows10)

    最新2020.12win10万能激活秘钥分享 附激活工具+教程(最新windows10)

  • 差额征税是如何计算的
  • 双定户经营所得用申报吗
  • 开诊所会计如何做账
  • 财务要做哪些表
  • 小额支出没有发票怎么做账
  • 三栏式明细账月结
  • 个体户开运输发票怎么开
  • 污水处理企业如何捕捉碳中和减少了的碳足迹
  • 承租人融资租赁设备长期应付款包括租赁资产担保余值
  • 员工内部跑步活动费用怎么做分录?
  • 会计凭证的概念及分类
  • 雇主责任险是否属于财产保险
  • 二手车交易公司需要什么资质
  • etc发票犯法吗
  • 支票结算方式下用其他货币资金账户
  • 半变动成本和延期成本的区别
  • 3%增值税专用发票可以抵扣多少
  • 支付工人保险费计入什么科目里
  • 房屋装修费是否分摊到地下车位成本
  • 无法支付的款项转销
  • 预付款退还的法律规定
  • 没有开工没有收入用书面语言表达
  • php实现的跟QQ和MSN类似的BICQ v2.0.0
  • 如何将iphone照片导入电脑里
  • 未办理土地使用权证房屋买卖 案例
  • 向银行借入长期借款50万元
  • cnqmax.exe进程的详细注解 cnqmax进程是病毒吗 安全吗
  • 请问简单的
  • 验签失败发票如何撤销
  • 商业会计的做账流程
  • 报废车怎么走流程
  • 取得土地使用权的方式
  • 最新前端技术
  • 实际发放股票股利
  • 投资公司如何注册勘察设计工程师证书
  • 快递破损后赔偿还能把东西拿走吗
  • 年金现值系数公式记忆
  • 年终奖发放有法律规定吗
  • 帝国cms扣除会员怎么办
  • 印花税如何记账入账
  • 免征企业所得税的有哪些行业
  • 小型微利企业季度所得税怎么计算
  • 劳务合同的特征有()
  • 航天税盘服务费开的普票可以抵税吗
  • 营业成本怎么理解
  • 税控盘买了怎么用
  • 委托加工物资受托发的会计处理
  • 公司开发的app费用怎么算
  • 房屋销售预收如何交税
  • 在建工程领用物资进项税
  • sqlserver性能优化
  • 如何远程重装系统教程
  • dotnetfx35有什么用
  • 打开win七
  • windows7笔记本无线网络连接
  • win7怎么设置工作组共享
  • js分页逻辑
  • activex控件在哪设置
  • js date类型
  • jQuery+AJAX实现遮罩层登录验证界面(附源码)
  • jquery邮箱正则表达式
  • msoobe命令
  • js实现组件功能
  • js链式编程的原理
  • js unload
  • Node.js中的事件循环是什么意思
  • div style display none
  • cmd替换文件命令
  • 关于angularjs1说法,错误的是
  • unity怎么删除导入的包
  • 谷歌chrome浏览器网页版网址
  • 做网页的流程与步骤
  • jquery访问本地html
  • android判断应用是否在前台
  • 销售农药化肥的经营范围
  • 合伙人转让出资的法律规定
  • 怎样查询一个企业是不是一般纳税人
  • 税务局签合同
  • 重庆税务局app下载官网
  • 北京劲松附近租房信息
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设