content-type
Content-Type
的作用是:服务器会根据Content-Type
来获取请求中的消息主体是以什么编码,根据编码对主体进行解析。
比如Content-Type
设置为application/x-www-form-urlencoded
, 那么就以name=rose&password=123456
来进行解码。所以我们发送data数据的时候,要先把我们的对象类型的数据,转换成name=rose&password=123456
这种类型格式的字符串。
urlencoded
Content-Type : application/x-www-form-urlencoded
name=rose&password=123456
这种格式
function getXhr() {
var xhr;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest() // IE7以上的浏览器都支持XMLHttpRequest
}else {
xhr = new ActiveXObject('Microsoft.XMLHTTP') // IE7以下的就这个
}
// 如果上面两个都没有的,说明浏览器不支持ajax请求。
return xhr
}
function postOrGetUrlencoded(url, type, data, callback) {
var xhr = getXhr();
var dataList = [];
for (var key in data){
dataList.push(key +'=' + data[key])
}
data = dataList.join('&')
xhr.open(type,url)
if (type == 'post'){
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded')
}
xhr.send(data)
xhr.onreadystatechange = function () {
if (xhr.readyState == 4){
console.log('postOrGetText connect success!')
if (xhr.status >= 200 && xhr.status < 300){
callback(window.JSON.parse(xhr.responseText))
}else{
console.log('error:',xhr.status)
}
}
}
}
json
Content-Type : application/json
JSON.stringify(data)
JSON.parse(responseData)
function getXhr() {
var xhr;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest() // IE7以上的浏览器都支持XMLHttpRequest
}else {
xhr = new ActiveXObject('Microsoft.XMLHTTP') // IE7以下的就这个
}
// 如果上面两个都没有的,说明浏览器不支持ajax请求。
return xhr
}
function postJson(url, data, callback) {
var xhr = getXhr();
xhr.open('post',url)
xhr.setRequestHeader('Content-Type','application/json')
xhr.send(window.JSON.stringify(data))
xhr.onreadystatechange = function () {
if (xhr.readyState == 4){
console.log('postJson connect success!')
if (xhr.status >= 200 && xhr.status < 300){
callback(window.JSON.parse(xhr.responseText))
}else{
console.log('error:',xhr.status)
}
}
}
}
form-data
Content-Type : multipart/form-data
var formData = new FormData()
function getXhr() {
var xhr;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest() // IE7以上的浏览器都支持XMLHttpRequest
}else {
xhr = new ActiveXObject('Microsoft.XMLHTTP') // IE7以下的就这个
}
// 如果上面两个都没有的,说明浏览器不支持ajax请求。
return xhr
}
function postFormData(url, data, callback) {
var xhr = getXhr();
var formData = new FormData()
for (var key in data){
formData.append(key, data[key])
}
xhr.open('post',url)
xhr.setRequestHeader('Content-Type','multipart/form-data')
xhr.send(formData)
xhr.onreadystatechange = function () {
if (xhr.readyState == 4){
console.log('postFormData connect success!')
if (xhr.status >= 200 && xhr.status < 300){
callback(window.JSON.parse(xhr.responseText))
}else{
console.log('error:',xhr.status)
}
}
}
}