javascript - Ajax 响应在检查器中正常，但在 jquery 中不起作用

Question

当我进行 Ajax 调用时，我可以在浏览器检查器中看到正确的响应值。但是，当我想在 js 中使用该响应时，我不能。

$(document).ready(function(){
    $("button").click(function(){
        var origin = "US";
        var price = "277";
        var currency = "AED";
        var weight = "500";
        var weightCurrency = "gram";
        var count = 1;
        $.ajax({
            url: "http://www.zakoola.com/order/GetCalculatedPrice",
            type: "Post",
            data: { Origin: origin, Price: price, Currency: currency, Weight: weight, WeightCurrency: weightCurrency, Count: count }
            })
            .done(function (res) {
                $("#price").html(res);
            });
    });
});

我有一个h1 id 为 #price 的标签在 HTML 中。此外，不要更改 h1我尝试过的文本alert()显示res值，但是不起作用。似乎响应函数从未被调用，但我可以在检查器中看到响应值。

更新1:控制台显示Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://www.zakoola.com/order/GetCalculatedPrice. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).和.fail正在调用函数并返回以下结果: {"readyState":0,"status":0,"statusText":"error"}

更新 2:只有 Firefox 正确显示响应负载。 Edge 和 IE 则不然。

Answer 1

考虑到更新，您应该在执行请求的服务器中添加 Access-Control-Allow-Origin header 。来自 MDN

The Access-Control-Allow-Origin response header indicates whether the response can be shared with resources with the given origin.

在该 header 中，您应该设置您的来源 ( http://example.com ) 或 *。

如果无法修改后端 header ，则无法通过这种方式执行ajax请求。

关于浏览器兼容性请参阅 this ，那么，你的 Firefox 可能低于 3.5