ajax原生的方法

网上看了不少原生的写法,感觉或多或少都有点问题。后面想到可能是写了没有自己测试过。于是就一边参照着,一边自己改下。当然最重要都是测试。没经过测试都代码终究是存在问题的。

第一版get方法

_ajax = (url, data, call, err) => {
    console.log(url, data)
    let xml = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    let arr = [];
    for (let i in data) {
      arr.push(i + '=' + data[i]);
    }
    url = url + '?' + arr.join('&');
    xml.open('get', url);
    xml.send();
    xml.onreadystatechange = function() {
      let res;
      if ( xml.status === 200 || xml.status === 304) {
        res = JSON.parse(xml.response);
        call && call(res);
      } else {
        const errMessage = { //错误的处理
          errStatus: xml.status,
          errMsg: xml.statusText
        }
        err && err(errMessage);
      }

    }
  }

调用方法:

const a = { operation: 0, b: 1 };
    this._ajax(' /ofm/storeRules/print', a, function(res) {
      console.log(res, 'success');
    }, function(err) {
      console.log(err, 'error');
    });

  

post

_ajax = (url, data, call, err) => {
    console.log(url, data)
    let xml = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    let arr = [];
    for (let i in data) {
      arr.push(i + '=' + data[i]);
    }
    xml.open('post', url, true);
    xml.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xml.send(arr.join('&'));
    xml.onreadystatechange = function() {
      let res;
      console.log(xml)
      if ( xml.status === 200 || xml.status === 304) {
        res = JSON.parse(xml.response);
        call && call(res);
      } else {
        const errMessage = { //错误的处理
          errStatus: xml.status,
          errMsg: xml.statusText
        }
        err && err(errMessage);
      }

    }
  }

 post这边的请求头需要单独设置,一般设置为

('Content-Type', 'application/x-www-form-urlencoded')。但是可能存在不同的情况,具体和后端对接修改。

使用

const a = {
      accesstoken: '***'
    };
  this._ajax('https://cnodejs.org/api/v1/accesstoken', a, function(res) {
    console.log(res, 'success');
  }, function(err) {
    console.log(err, 'error');
  });
 

猜你喜欢

转载自www.cnblogs.com/cyr2018/p/10551331.html