ajax跨域问题请求修改代码

Question

我有如下一段代码，在http://portal.admin.do.com/这个网页的控制台输入打开，原来运行正常，但最近不能运行了，出现如下提示，请求帮忙修改代码。
Access to XMLHttpRequest at 'http://bizqa.admin.do.com' from origin 'http://portal.admin.dongao.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

代码如下：

h1="http://bizqa.admin.do.com";
clearInterval(cxTimer);
var cxTimer=setInterval(function(){
$.ajax({
type:"POST",     //ajax请求使用POST方法
url :"http://bizqa.admin.do.com ",  //请求的服务器地址
data:{//发送到服务器的数据,JSON 数据类型
"examId": "1004",
},
dataType:"json",  //指定从服务器返回 JSON 数据类型
success:function(mm){
console.log('请求成功：'); 
//console.log(mm); 
for(let i=0;i<mm.rows.length;i++){ 
if(mm.rows[i].vipType!=8 && mm.rows[i].lockTeacher==null){
hh=h1+ mm.rows[i].id +"/2";

              }
//console.log(mm.rows[i].id);
}
},//请求成功要执行的代码,//参数:从服务器返回的数据
error:function(){console.log('请求失败')}//请求失败要执行的代码
});
}, Math.random()*500)// 时间间隔不能小于800毫秒

Answer 1

引用 皆我百晓生 小程序回复内容作答：

跨域请求问题通常是由于浏览器的同源策略引起的。根据你提供的错误提示，你的请求被阻止了，因为服务器没有返回"Access-Control-Allow-Origin"头部字段。

要解决这个问题，你需要在服务器端设置相应的响应头部。

在你的服务器代码中，添加以下响应头部字段：

Access-Control-Allow-Origin: http://portal.admin.dongao.com

这将允许来自http://portal.admin.dongao.com域的跨域请求访问你的服务器。确保将这行代码添加到你的服务器端代码中，并确保服务器正确地响应这个头部。

请注意，这个解决方案需要在你的服务器上进行更改，而不是在你的客户端代码中。如果你无法访问服务器代码，或者你没有权限进行更改，你可以联系服务器的管理员或开发者，请求他们将相应的头部添加到服务器响应中。

• 以下补充作答：

要解决跨域问题，可以将ajax的请求改为使用JSONP或者代理方式。

1.使用JSONP
JSONP是一种利用script标签实现跨域请求的方式。修改代码如下：

h1 = "http://bizqa.admin.do.com";
clearInterval(cxTimer);
var cxTimer = setInterval(function() {
    $.ajax({
        type: "GET",
        url: "http://bizqa.admin.do.com",
        data: {
            "examId": "1004",
        },
        dataType: "jsonp",
        success: function(mm) {
            console.log('请求成功：');
            //console.log(mm); 
            for (let i = 0; i < mm.rows.length; i++) {
                if (mm.rows[i].vipType != 8 && mm.rows[i].lockTeacher == null) {
                    hh = h1 + mm.rows[i].id + "/2";
                }
                //console.log(mm.rows[i].id);
            }
        },
        error: function() {
            console.log('请求失败');
        }
    });
}, Math.random() * 500);

注意修改了type为GET，并将dataType改为"jsonp"，以及修改成功回调函数success中的代码。

2.使用代理
通过在服务器端设置代理，解决跨域问题。修改代码如下：

h1 = "/api/bizqa";
clearInterval(cxTimer);
var cxTimer = setInterval(function() {
    $.ajax({
        type: "POST",
        url: "http://portal.admin.do.com/proxy", // 设置代理的接口地址
        data: {
            url: "http://bizqa.admin.do.com",
            method: "POST",
            data: JSON.stringify({
                "examId": "1004"
            }),
            dataType: "json"
        },
        success: function(mm) {
            console.log('请求成功：');
            //console.log(mm); 
            for (let i = 0; i < mm.rows.length; i++) {
                if (mm.rows[i].vipType != 8 && mm.rows[i].lockTeacher == null) {
                    hh = h1 + mm.rows[i].id + "/2";
                }
                //console.log(mm.rows[i].id);
            }
        },
        error: function() {
            console.log('请求失败');
        }
    });
}, Math.random() * 500);

在这里通过设置代理的接口地址来转发请求到目标地址，并将请求参数在data中进行传递。

请根据你的需求选择其中一种方法进行修改。