DDR爱好者之家

Ajax的原生实现关于MIME类型的使用方法
站长资源 2024/11/25 佚名
31 1538
DDR爱好者之家 Design By 杰米

问题描述

下面的例子是一个Ajax的post请求的代码，这段代码在测试运行的时候，发现返回的状态码为400，服务器不能理解的请求，后来经过查看和修改，发现只需要将下面的代码稍微改造一下就好了

原代码

var send = function (url, params, fn) {
  var me = this;
  var xhr = null;
  var data = '';
  fn = fn || function() {};
  params = params || {};
  for(var item in params) {
   data += item + '=' + params[item] + '&';
  }
  if(data[data.length - 1] == '&') {
   data = data.slice(0, data.length - 1);
  }
  if(window.XMLHttpRequest) {
   xhr = new XMLHttpRequest();
  }else if(window.ActiveXObject) {
   xhr= new ActiveXObject("Microsoft.XMLHTTP");
  }
  xhr.open("post", url, true);
  xhr.setRequestHeader("Content-type", "application/json");
  xhr.onreadystatechange = function () {
   if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
    fn(JSON.parse(xhr.responseText));
   }
  };
  xhr.send(JSON.stringify(params));
}

修改之后的代码

var send = function (url, params, fn) {
    var me = this;
    var xhr = null;
    fn = fn || function() {};
    params = params || {};
    if(window.XMLHttpRequest) {
      xhr = new XMLHttpRequest();
    }else if(window.ActiveXObject) {
      xhr= new ActiveXObject("Microsoft.XMLHTTP");
    }
    xhr.open("post", url, true);
    xhr.setRequestHeader("Content-type", "application/json");
    xhr.onreadystatechange = function () {
      if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 304)) {
        fn(JSON.parse(xhr.responseText));
      }
    };
    xhr.send(JSON.stringify(params));
}

这两段代码的差别就是，修改之后的代码去掉了关于data这个变量的处理以及在send中传递的参数变为了params这个变量

问题解惑

问题是解决了，但是我心里的疑问却产生了，之前在使用原生的Ajax的时候，当method为post的时候，传递的参数的形式是”name=123&age=32”这样子的，那么为什么现在传递一个序列化的JSON对象就可以了呢？

这时候我注意到自己所加的MIME类型，也就是设置Content-type的那处，我设置的是"application/json"，这样看起来就解释的通了，这时候我回想起之前常用的MIME类型是“application/x-www-form-urlencoded”，这种时候send方法传递的参数就要求是”name=123&age=32”这样子的，到这里，解惑完毕啦(～￣▽￣)～

补充

顺便说下405这个状态码，上一次见到它的时候，是我前端发送请求的时候，传递的参数不对，这次遇到它的时候，是因为后台还没有添加这个请求的处理

以上这篇Ajax的原生实现关于MIME类型的使用方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。

DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米