ajax请求、封装及解决node请求的跨域问题

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

ajax请求
    var ajax = new XMLhttpRequest(); // 实例化一个ajax请求的对象

    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()
    })
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值