ajax请求和封装、跨域解决

1 Ajax请求

var requestHead=new XMLHttpRequest();//实例化一个ajax请求的对象
requestHead.open(method,url,false);//开启一个ajax请求
// 参数1 请求的方式(method/post) 参数2 请求的地址 参数3 是否发送同步请求(一般默认，不写)

requestHead.send();//发送ajax请求

//获取ajax请求的响应数据
//获得来自服务器的响应，使用 XMLHttpRequest 对象的 responseText 
requestHead.onreadystatechange=function(){
    //onreadystatechange 是一个监听函数，监听请求状态的变化
    if(requestHead.readyState==4 && requestHead.status==200){
        //readystate 表示响应结束 status表示响应是否成功(200表响应成功)
        // 0: 请求未初始化
        // 1: 服务器连接已建立
        // 2: 请求已接收
        // 3: 请求处理中
        // 4: 请求已完成，且响应已就绪
       var data=JSON.parse(requestHead.responseText);//获取请求成功后的报文
       console.log(data);//请求成功后的数据
    }

}

2 Ajax请求的封装

  function ajax(options){
      var reqHead=new XmlHttpRequest();
      reqHead.open(options.method,options.url);
      reqHead.onreadystatechange=function(){
          if(reqHead.readyState==4 && reqHead.status==200){
             var data=JSON.parse(reqHead.responseText);
             optiona.success(data);//传递响应的数据
          }
      }
  }
  ajax({
      method:"get",
      url:"要请求的地址",
      success:function(res){
          //res就是响应的数据
      }
  })

3 epress解决 跨域问题

var express = require('express');
var router = express.Router();
router.all("*",function(req,res,next)){
    //配置允许跨域的域名， *表示允许所有的域名跨域请求
    res.header("Access-Control-Allow-Origin","*");
    //配置跨域请求的请求方式,*表示允许所有的跨域请求方式
    res.header("Access-Control-Allow-Methods","*")
    next();
}