ajax跨域请求封装

js ajax请求封装以及解决node请求跨域问题

ajax请求

    var ajax = new XMLhttpRequest();

    ajax.open(method, url, false) // 开启一个ajax请求 第一个参数是请求的方式 可以是get/post 第二个参数是请求的地址 第三个参数是否发送

    ajax.send() // 向服务器发送ajax请求

    // 获取ajax请求的响应数据

    ajax.onreadystatechange = function() {
      // readystate的状态变化
      // 0: 请求未初始化
      // 1: 服务器连接已建立
      // 2: 请求已接收
      // 3: 请求处理中
      // 4: 请求已完成，且响应已就绪
      // status 200 表示请求成功 404 表示页面丢失 请求地址错误
      if(ajax.readystate === 4 && ajax.status === 200) {
        // 记录响应数据
        var data = JSON.parse(ajax.responseText);
        console.log(data) // 就是服务返回的数据
      }
    }

ajax 请求封装

    // options 调用ajax请求是传递过来的参数
    function ajax(options) {
      var ajax = new XMLhttpRequest();

      ajax.open(options.method, options.url , false)

      ajax.send()

      ajax.onreadystatechange = function() {
        var data = JSON.parse(ajax.responseText);
        if(ajax.readystate === 4 && ajax.status === 200) {
          // 传递出响应的数据
          options.success(data)
        }else if(ajax.readystate === 4 && ajax.status !== 200) {
          options.fail(data)
        }
      }
    }
    ajax({
      method: "get" || "post"
      url: "你的请求地址"
      success: function(res) {
        // res就是响应的数据了
      }，
      fail: function(err) {

      }
    })

请求头方法解决express跨域问题

    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()
    })