博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ajax与spring mvc请求的总结
阅读量:6622 次
发布时间:2019-06-25

本文共 3121 字,大约阅读时间需要 10 分钟。

hot3.png

https://www.cnblogs.com/love540376/p/6912637.html

 

dataType分类

dataType预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如XML MIME类型就被识别为XML。在1.4中,JSON就会生成一个JavaScript对象,而script则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值: "xml": 返回 XML 文档,可用 jQuery 处理。"html": 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意:'''在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)"json": 返回 JSON 数据 。"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。"text": 返回纯文本字符串

 

 

contentType

contentType是指http/https发送信息至服务器时的内容编码类型contentType用于表明发送数据流的类型,服务器根据编码类型使用特定的解析方式,获取数据流中的数据。内容编码类型的作用,有点像本地文件的后缀名。

常见的contentType

一、x-www-form-urlencoded

这是Jquery/Zepto Ajax默认的提交类型。最简例子为:

 

1 let userInfo = { 2  name: 'CntChen', 3  info: 'Front-End', 4 } 5  6 $.ajax({ 7   url: 'https://github.com', 8   type: 'POST', 9   data: userInfo,10   success: (data) => {},11 });

此时默认的提交的contentTypeapplication/x-www-form-urlencoded,此时提交的数据将会格式化成:

name=CntChen&info=Front-End

HTML的form表单默认的提交编码类型也是x-www-form-urlencoded,可能这就是Jquery/Zepto等类库(其实是Ajax:XMLHttpRequest)也默认使用contentType:x-www-form-urlencoded的原因。如果请求类型typeGET,格式化的字符串将直接拼接在url后发送到服务端;如果请求类型是POST,格式化的字符串将放在http body的Form Data中发送。

二、json

使用json内容编码发送数据,最简例子为:

 

1 let userInfo = { 2  name: 'CntChen', 3  Info: 'Front-End', 4 } 5  6 $.ajax({ 7   url: 'https://github.com', 8   contentType: 'application/json', 9   type: 'POST',10   data: JSON.stringify(userInfo),11   success: (data) => {},12 });

 

最主要的不同有3点:

  • 需要显式指定contentTypeapplication/json,覆盖默认的contentType

  • 需要使用JSON.stringify序列化需要提交的数据对象,序列化的结果为:

{"name":"CntChen","info":"Front-End"}
  • 提交的类型不能为GET,使用GET的话,数据会在url中发送,此时就无法以json字符串的编码发送

三、multipart/form-data,主要用于传输文件数据的

四、JS对象编码

对于扁平的参数对象,使用x-www-form-urlencodedjson并没有大的差别,后台都可以处理成对象,并且数据编码后的长度差别不大。

但是对于对象中嵌套对象,或对象字段包含数组,此时两种内容编码方式就有较大差别。

 

普通对象

 

1 {2     userInfo :{3      name: 'CntChen',4      info: 'Front-End',5      login: true,6     },7 }

 

  • to x-www-form-urlencoded (1)
userInfo[name]=CntChen&userInfo[info]=Front-End&userInfo[login]=true
  • to json (2)
{"userInfo":{"name":"CntChen","Info":"Front-End","login":true}}

对象字段为数组

 

1 { 2     authors:[ 3       { 4         name: 'CntChen', 5         info: 'Front-End', 6       }, 7       { 8         name: 'Eva', 9         info: 'Banker',10       }11     ],12 }

 

  • to x-www-form-urlencoded (3)
authors[0][name]=CntChen&authors[0][info]=Front-End&authors[1][name]=Eva&authors[1][info]=Banker
  • to json (4)
{"authors":[{"name":"CntChen","info":"Front-End"},{"name":"Eva","info":"Banker"}]}

可见:x-www-form-urlencoded是先将对象铺平,然后使用key=value的方式,用&作为间隔。对于嵌套对象的每个字段,都要传输其前缀,如(1)中的userInfo重复传输了3次;(3)中authors传输了4次。

如果对象是多重嵌套的,或者嵌套对象的字段较多,x-www-form-urlencoded会产生更多冗余信息。同时,x-www-form-urlencoded可读性不如json字符串。

json的优势

1、较小的传输量

从前文可以看出,使用json字符串的形式,可以减少冗余字段的传输,减少请求的数据量。

2、请求与返回统一

目前许多前后端交互的返回数据是json字符串,这可能是考虑较小的传输量而作出的选择。同时,ES3.1添加了,许多浏览器可以,可以将json字符串解析为JS对象(JSON.parse),将JS对象编码为json字符串(JSON.stringify);

所以使用json编码请求数据,其编码解码非常方便,并且可以保持与后台返回数据的格式一致。
3、框架的支持

目前Mvvm的前端框架如React,网络请求通常是提交一个JS对象(传输的时候编码为json字符串)。后台服务器如Koa,接收请求和响应的数据是json字符串。

4、可读性高

48590-20170527140316950-1204883095.png

转载于:https://my.oschina.net/u/3234821/blog/2246872

你可能感兴趣的文章
修改linux终端的提示字符
查看>>
HP存储raid5两块硬盘离线lvm下vxfs文件系统恢复数据方案
查看>>
一个关于Linux Bridge配置的吐嘈
查看>>
Azure 中国篇之计算服务--创建Azure虚拟机可用性集
查看>>
使用Zabbix去监控Redis
查看>>
交换网络安全防范系列三之ARP欺骗攻击防范
查看>>
深入浅出VMware的组网模式
查看>>
特殊权限、软硬链接
查看>>
Apache基本vhost虚拟主机配置以及特定IP访问权限的控制
查看>>
linux-FTP
查看>>
在Linux的连接跟踪(nf_conntrack)中缓存私有数据省去每次查找
查看>>
RPM(RPM Package Manager)程序包管理工具的常见使用方法
查看>>
向善的力量
查看>>
Fiddler4使用教程
查看>>
Sbo业务伙伴关系管理系统
查看>>
集群介绍、keepalived介绍、用keepalived配置高可用集群
查看>>
如何下载Android源码(非常详细,含自动恢复下载,编译,运行模拟器说明)
查看>>
Struts2 属性驱动、模型驱动、异常机制
查看>>
findbugs、PMD、Checkstyle等CI插件的使用
查看>>
邮件服务器_SMTP认证控制和Webmail系统
查看>>