javascript - AJAX 请求中不存在 'access-control-allow-origin' header

Question

我正在使用以下 URL 获取天气应用程序的数据。

http://wsf.cdyne.com/WeatherWS/Weather.asmx/GetCityWeatherByZIP

我以前使用过此 API，但这次我尝试使用 AJAX 加载数据，因此在获取此数据时我页面的其余部分不会重新加载。

这是我的javascript

<script>
    $(function () {
        var zip = 16001;

        $.ajax({
            type: 'GET',
            crossDomain:'true',
            url: 'http://wsf.cdyne.com/WeatherWS/Weather.asmx/GetCityWeatherByZIP' +zip,
            success: function (data) {
                console.log("Here is the data", data);
            },
            error: function () {
                alert("Error loading data");
            }
        });
    });
</script>

我一直在控制台中收到以下错误。

XMLHttpRequest cannot load http://wsf.cdyne.com/WeatherWS/Weather.asmx/GetCityWeatherByZIP16001. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:50733' is therefore not allowed access. The response had HTTP status code 500. weatherAjax.html:1

这让他们看起来像是访问数据的问题。但是我之前用一个简单的形式使用过这个，用户输入他们的邮政编码。它返回了数据。现在唯一的区别是我想使用 AJAX 加载数据，这样整个页面就不会重新加载。我做错了什么？

Answer 1

之前您将用户的浏览器发送到其他人的网站。他们正在离开您的网站，一切都很好。

现在您正在尝试编写 JavaScript 来指示访问者的浏览器从其他人的网站获取数据(这将使用他们拥有的任何 auth/authz 凭据)并将该数据提供给您的代码。

例如，由于其他网站可能是网上银行，因此除非您从中请求数据的网站明确允许您访问它，否则这是被禁止的。

如需进一步阅读，请参阅 the Same Origin Policy和 HTTP access control (CORS) .