ajax post 请求415\ 400 错误

今天用ajax 向后台发送 post请求时，出现了两个问题：

　　1， 发送请求后，控制台 返回  Unsupported media type-415(不支持的媒体类型)，这时突然想起来，post 请求要设置请求头，于是 写了 xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded.'); 再次发送请求，还是报同样的错误，Unsupported media type-415。查了一下，原来，后端对请求的Content-type 设为了json,  Access-Control-Request-Headers: content-type, 这时要把 content-type 设为json .  xhr.setRequestHeader('Content-Type', ' application/json');

　　在设置请求头的时候，还知道了原来第一个参数“Content-Type”， 是不区分大小写的，写成‘content-type’ 也是可以的。当然，设置请求头还要注意以下问题：

　　　　1，它必须在open()方法之后，send()方法之前调用，否则会抛错。

　　　　2，如果设置多个请求头时，可以多次调用setRequestHeader()，后面的设置并不会覆盖掉前面的设置，而是采用叠加的方式。

　　　　3， 两个参数之间用逗号，隔开。 有时我不经意间写成了分号：， 造成错误。

　　2，改完之后，发送请求，又报错了 ，但这次是400  bad  request,  400指的是请求无效（请求有语法问题或者不能满足请求），也就是无法获取到资源， 这主要是后台要求传入的数据和前台我们传入的数据不匹配，后台无法解析数据，进行查询，从而返回数据。但我只传递了一个对象。网上搜了一个解决办法：对我们要传递的数据进行json 序列。

var data = JSON.stringify({
    "page": 0,
    "limit": 20,
    "shopId": 1
});

3， 再发送一次请求，终于请求成功。 代码如下：

var xhr = new XMLHttpRequest();
var url ="http://192.168.1.89:8080/server/";
var data = JSON.stringify({
      "page": 0,
      "limit": 20,
      "shopId": 1,
      "timeType": 3,
});

xhr.open("POST", url );
xhr.setRequestHeader('Content-Type','application/json');
xhr.onload = function(){
    console.log(xhr.responseText) // 这里要用xhr.respnseText 获取数据，我经常给函数传一个data参数，获取数据，造成错误
}
xhr.send(data)      

 

转载于:https://www.cnblogs.com/SamWeb/p/6211134.html