AJAX相关

关注公众号 jb51net

关闭
首页 > 网络编程 > AJAX相关 > dataType 和 content-type 参数

jQuery Ajax中dataType 和 content-type 参数的作用详解

作者:Lee_Yu_Fan

这篇文章主要介绍了jQuery Ajax中dataType 和 content-type 参数的作用详解,本文通过实例代码给大家介绍的非常详细,感兴趣的朋友一起看看吧

dataType

在AJAX请求中,dataType参数主要用于指定期望从服务器返回的数据类型。这个参数常见于jQuery的AJAX方法中。

作用:

1、告诉AJAX请求如何解析服务器返回的数据

2、影响success回调接收的数据格式。如果设置dataType:'json',jQuery会自动把响应数据解析成JavaScript对象,而不是原始字符串,所以无需手动JSON.parse。

3、帮助jQuery设置正确的Accept请求头(部分情况下)。比如,dataType:'json'会在请求头中添加 Accept:application/json

对比 Fetch API / Axios

Fetch API 没有dataType,而是用.json()、.text()、.blob()方法

fetch('/data').then(response=>response.json()) //类似于 dataType:'json'
                .then(data=>console,log(data))

Axios 会自动基于 Content-Type解析,但也可以强制指定responseType

axios.get('/api',{responseType:'json'}) //类似 dataType

Content-Type

Content-Type是HTTP请求和响应中最重要的头部之一,它用于指定请求或响应中传输的数据类型,让服务器或客户端知道如何正确解析数据。 

作用:

1、告诉服务器客户端发送的是什么格式的数据

2、告诉客户端服务器返回的是什么格式的数据

3、确保数据能正确解析和处理

//在请求中(客户端 -> 服务器)
Content-Type:'application/json'  //表示客户端发送的是JSON格式的数据
// 在响应中(服务器 -> 客户端)
Content-Type:'text/html;charset=UTF-8' //表示服务器返回的是UTF-8编码的HTML文档

常见Content-Type值:

类型说明典型用途
application/jsonJSON字符串API 请求/响应
application/x-www-form-urlencodedURL编码的表单数据HTML表单提交
multipart/form-data包含文件上传的表单数据文件上传
text/htmlHTML文档网页返回
text/plain纯文本简单文本数据
text/csscss样式表样式文件
text/javascriptJavaScript代码JS文件
image/pngPNG图片图片文件

注意事项:

1、get请求通常不需要设置Content-Type,因为GET请求一般没有请求体。

2、post/put请求必须正确设置Content-Type,否则服务器可能无法正确解析数据

3、浏览器对某些Content-Type有安全限制(如跨域请求)

4、字符编码可以附加在Content-Type中:text/html;charset=UTF-8

Content-Type与Accept的区别:

Content-Type:描述当前发送的数据类型

Accept:描述客户端希望接收的数据类型

// 客户端发送表单数据、但希望接口JSON格式的响应
Accept:application/json
Content-Type:application/x-www-form-urlencoded

到此这篇关于jQuery Ajax中dataType 和 content-type 参数的作用详解的文章就介绍到这了,更多相关dataType 和 content-type 参数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文