AngularJS $http 对 Web 服务的请求需要 CORS

Posted 2023-03-04

【中文标题】AngularJS $http 对 Web 服务的请求需要 CORS

【英文标题】：AngularJS $http request to Web Service requires CORS

【发布时间】：2016-03-22 07:46:41

【问题描述】：

我正在编写一个需要访问 WebService（我无法控制）的服务 - 我想在我的应用程序中使用的 API。我已经在浏览器中访问了有问题的 url，并且登录成功，并且可以看到我的访问令牌，但是当我尝试使用 $http 访问同一页面时，我在 IE 的开发者控制台中出现错误。

angular.module("app").factory("MyService", function($http)
    var serviceUrl = "http://some-web-page/service.asmx/";

    var logOn = function(username, password)
        var getUrl = serviceUrl + "logOn?username="+username+"&password="+password;
        $http.get(getUrl).then(
                function successCallback(response)
                    console.log("Success");
                    console.log(response);
                , function errorCallback(response)
                    console.log("Error");
                    console.log(response);
                
        );
    ;

    return 
        logOn: logOn
    ;
).config(function($httpProvider)
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
);

在控制台中我得到了

html1300: Navigation occurred.
File: home
HTML1503: Unexpected start tag.
File: home, Line: 5, Column: 1
SEC7118: XMLHttpRequest for http://some-web-page/service.asmx/logOn?username=username&password=password required Cross Origin Resource Sharing (CORS).
File: home
SEC7115: :visited and :link styles can only differ by colour. Some styles were not applied to :visited.
File: home

SEC7120: Origin http://localhost not found in Access-Control-Allow-Origin header.
File: home
SCRIPT7002: XMLHttpRequest: Network Error 0x80070005, Access is denied.

【问题讨论】：

您必须在服务器中启用 CORS（我知道您无法控制服务器）。它通常在服务器中关闭以防止跨站点请求伪造。

为什么有人会构建一个无法访问的 API？有没有其他方法可以做到这一点？

我认为您正在本地工作，这导致了问题。您可以在 localhost 上关闭网络安全。但不太确定生产服务器 - 在这里你会找到关闭的步骤 -> By Pass CORS

我正在运行本地服务器 (WampServer) 并在 localhost 上运行。

通过命令提示符导航到安装路径并运行以下命令：Chrome.exe --disable-web-security

【参考方案1】：

chrome和mozilla有一个叫cors的插件安装它，不会出现cors的问题。 https://addons.mozilla.org/en-US/firefox/addon/cors-everywhere/ https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en

【参考方案2】：

你不能从你的客户端向远程服务器查询（不管你使用的是哪个框架，它下面都是建立在 XMLHttpRequest 之上的），除非他们在他们这边启用并实现了 CORS（服务器托管在 @987654321 @)。您可以向您的服务器发出请求，也可以从您的服务器向远程服务器发出请求，但这并不总是一个理想的解决方案。

【讨论】：

控制台没有明确表示服务器上没有启用 CORS - 您确定是这个问题吗？另外 - 我目前还没有设置服务器，所以不确定这对我来说是一个理想的解决方案。也许我会发现需要在某个地方创建一个服务器，但这个应用程序目前只是一个使用不同系统 API 的只读应用程序。

错误信息可能因您使用的浏览器而异，个人不会依赖。关于您尝试调用的服务是什么以及您的应用程序是什么的一些见解可能会有所帮助

我正在调用第三方文档管理系统，以便在新网页上公开一组简单的功能 - 特别是搜索和下载文档（以只读方式）。需要身份验证。

如果您想知道服务是否故意阻止“localhost”发起的请求，只需尝试从不同域发送请求（打开控制台工具并向远程服务器发出获取请求）。

***.com/questions/21455045/… 查看这篇文章，了解如何设置正确的标头以使用 $http 服务实现身份验证。如果您可以提供该服务的链接，那可能会有所帮助。快速旁注，根据您的解释，无论服务是否需要对每个域启用 CORS 的身份验证，都会为服务本身带来大量漏洞。