位置: 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)

  • 华为nova5怎么设置不休眠(华为nova5怎么设置搜狗输入法)

    华为nova5怎么设置不休眠(华为nova5怎么设置搜狗输入法)

  • 拼多多怎么屏蔽商家(拼多多怎么屏蔽店铺)

    拼多多怎么屏蔽商家(拼多多怎么屏蔽店铺)

  • 华为手机拉黑后会收到短信吗(华为手机拉黑后不想看到对方短信,怎么办?)

    华为手机拉黑后会收到短信吗(华为手机拉黑后不想看到对方短信,怎么办?)

  • 苹果耳机三代充电线怎么用(苹果耳机三代充电仓丢了可以配的到吗)

    苹果耳机三代充电线怎么用(苹果耳机三代充电仓丢了可以配的到吗)

  • 苹果手机不支持支付(苹果手机不支持23g网络的能买吗为什么)

    苹果手机不支持支付(苹果手机不支持23g网络的能买吗为什么)

  • 滴滴出行实名认证不是本人怎么修改(滴滴出行实名认证有风险吗)

    滴滴出行实名认证不是本人怎么修改(滴滴出行实名认证有风险吗)

  • 华为手机振动怎么调(华为手机振动怎么关不了)

    华为手机振动怎么调(华为手机振动怎么关不了)

  • 宽带闪红灯不能上网怎么办(宽带红灯闪怎么回事)

    宽带闪红灯不能上网怎么办(宽带红灯闪怎么回事)

  • 小爱同学的猜人物怎么打开(小爱同学猜人游戏)

    小爱同学的猜人物怎么打开(小爱同学猜人游戏)

  • 蚂蚁视频是什么东西(蚂蚁视频是蚂蚁集团的吗)

    蚂蚁视频是什么东西(蚂蚁视频是蚂蚁集团的吗)

  • 打印显示文档被挂起是怎么回事(打印显示文档被挂起怎么回事)

    打印显示文档被挂起是怎么回事(打印显示文档被挂起怎么回事)

  • 电脑录屏保存在哪里(电脑录屏保存在c盘怎么办)

    电脑录屏保存在哪里(电脑录屏保存在c盘怎么办)

  • 无线反充是什么意思(无线反充是支持哪些手机)

    无线反充是什么意思(无线反充是支持哪些手机)

  • 有核显和没核显区别(有核显和没核显耗电)

    有核显和没核显区别(有核显和没核显耗电)

  • i37100安装什么系统(i3-7100安装win7)

    i37100安装什么系统(i3-7100安装win7)

  • aux接口可以插麦克风吗(aux接口可以接无线话筒吗)

    aux接口可以插麦克风吗(aux接口可以接无线话筒吗)

  • 高德地图收藏在哪里找(高德地图收藏在哪?)

    高德地图收藏在哪里找(高德地图收藏在哪?)

  • 微信商业版和个人版能同时用吗(微信商业版和个性版区别)

    微信商业版和个人版能同时用吗(微信商业版和个性版区别)

  • 华为nova5pro如何使用耳机(华为nova5pro如何开空调)

    华为nova5pro如何使用耳机(华为nova5pro如何开空调)

  • 微信可以群删好友吗(微信可以群删好友是从什么时候开始的)

    微信可以群删好友吗(微信可以群删好友是从什么时候开始的)

  • 苹果自带倒计天数在哪(苹果自带倒计天数在怎么设置到屏幕)

    苹果自带倒计天数在哪(苹果自带倒计天数在怎么设置到屏幕)

  • 魅族的语音助手叫什么(魅族的语音助手在哪里设置)

    魅族的语音助手叫什么(魅族的语音助手在哪里设置)

  • 刷宝怎么自动播放下一个视频(刷宝短视频怎么自动刷)

    刷宝怎么自动播放下一个视频(刷宝短视频怎么自动刷)

  • pencil笔尖多久一换(apple pencil笔尖用多久)

    pencil笔尖多久一换(apple pencil笔尖用多久)

  • qq被冻结怎么办手机(qq涉嫌违规注册qq被冻结怎么办)

    qq被冻结怎么办手机(qq涉嫌违规注册qq被冻结怎么办)

  • Redmi K20 Pro电池容量是多少(红米 k20 pro 电池)

    Redmi K20 Pro电池容量是多少(红米 k20 pro 电池)

  • github是干嘛的(github有什么作用)

    github是干嘛的(github有什么作用)

  • 实收资本增加印花税怎么算
  • 增值税附加税减免
  • 企业关于发票的管理及要求
  • 附加税减免税额不能大于本期应纳税额怎么办
  • 免抵退税申报资料情况表在哪下载
  • 销售费用和管理费用和财务费用
  • 补交以前年度的所得税
  • 公章未备案是否不合法
  • 回单结算卡丢失了严重吗
  • 公司出售房产的税费
  • 外汇结汇的方法有哪些呢?
  • 进出口公司如何避税
  • 购货无法取得发票财务如何处理
  • 金税三期中个税怎么算
  • 专项费用包括哪两种
  • 主营业务税金及附加包括印花税吗
  • 关于企业所得税若干优惠政策的通知
  • 购进的库存商品转自用
  • 应收款计提
  • 中标费用由哪方出
  • 分红个人所得税怎么交
  • 公司购买房子涉及什么税
  • 食堂购买蔬菜计算公式
  • 企业自然人电子税务局怎么申报
  • linux命令执行成功后会返回什么
  • Laravle eloquent 多对多模型关联实例详解
  • incredicle
  • config.cfg是什么文件
  • wrme.exe是什么
  • php实现微信发红包的方法
  • 存货盘盈盘亏影响当期利润吗
  • 'The Wave' sandstone formation in Coyote Buttes North, Paria Canyon-Vermilion Cliffs National Monument, Arizona (© Dennis Frates/Alamy)
  • 微信公众号php开发教程
  • 谷歌浏览器跨域解决方案
  • 路径规划是什么意思
  • msg文件怎么创建
  • 应收账款提了坏账后收回
  • 企业所得税汇算清缴操作流程
  • 捐款 企业
  • phpcms使用教程
  • java中double是什么数据类型
  • php7安装mysqli扩展
  • 小规模租金可以抵税吗
  • 应交增值税减免税款是什么意思
  • 持有至到期投资减值准备
  • 委托代销安排的迹象有哪些
  • 其他权益工具投资公允价值变动计入什么科目
  • 充值优惠怎么写
  • 财务会计期末总结
  • 出口退税综合服务网
  • 普通发票的开具办法是?
  • 一般纳税人弱电包工包料怎么开票
  • 国有资本金是什么意思
  • 工资条上为什么不显示生育险
  • 会计做账过程中遇到的问题
  • 房地产项目企业
  • mysql触发器的作用
  • macbookair切换桌面
  • 搜索不到WiFi信号是怎么回事
  • 安装最新的Google应用
  • win8.1屏幕键盘
  • 怎么更改window
  • 在linux系统中
  • win7共享文件夹关闭密码保护
  • mfc界面布局
  • react-redux用法
  • java的理解
  • 使用Android Go的手机
  • shell包含文件
  • nodejs事件循环和js事件循环
  • Node.js中的事件循环是什么
  • jquery操作html代码
  • node.js搭建服务器
  • cshrc语法
  • jqgrid分页pager
  • 同源策略详解
  • js闭包的定义和用途
  • 大连税务局王局长
  • 湖南耕地占用税标准
  • 西安个人完税证明怎么开
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设