这是我的终点:
http://d.biossusa.com/api/distributor?key=#####
我收到这样的回复:
{"152":{"user":{"id":198,"firstname":null,"lastname":null,"username":"Lucerna-chem","email":"oliveri@lucerna-chem.ch","type":"Distributor","password_temp":null,"code":"omrotFVDQS3T75wTFUS67W0kUnXUpePrvaP5Pha9QevHjB0olSjPIxhmmJuZ","active":1,"logo_path":"lucerna-chem.jpg","created_at":"2014-10-15","updated_at":"2017-01-30","email_again":"","notification":"","send_invitation":"1","last_logged_in":null,"last_logged_out":null,"logged_in_count":"24","is_online":"0","group":"","cd_count":"10","mmd_count":"11"},"logo":"\/9j\/4AAQSkZJRgABAQEAYABgAAD\/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz\/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz\/wAARCABBARUDASIAAhEBAxEB\/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL\/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKzt .........
我正在尝试向该 URL 发送 Angular GET 请求。 这就是我所拥有的:
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<p>Today's welcome message is:</p>
<h1>{{myData}}</h1>
</div>
<script>
var app = angular.module('myApp', []);
app.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];
}
]);
app.controller('myCtrl', function($scope, $http) {
$http.get("http://d.biossusa.com/api/distributor?key=#####")
.then(function(response) {
$scope.myWelcome = response.data;
});
});
</script>
但是,我不断在控制台中收到 CORS 错误。
如何防止 CORS 错误?我可以做些什么来显示我的数据吗?
最佳答案
Why do I get error only when I used angular
每当您创建的 Web 应用程序包含任何客户端 JavaScript 并将跨源请求发送到 http://d.biossusa.com/api/distributor?key=* 时,您都会收到该错误****
使用 XMLHttpRequest
或 Fetch API或任何使用这些库的库(例如 jQuery)。
所以这不是 Angular 特有的问题。
就您收到此错误的原因而言,这是因为浏览器限制您的 Web 应用程序从 JavaScript 发出跨源请求,除非发送请求的网站选择允许这样做。
网站选择允许跨源请求的方式是发送包含 Access-Control-Allow-Origin
header 的响应,该 header 指示它允许来自哪些来源的请求。
因此,发送 Access-Control-Allow-Origin: *
响应 header 的网站告诉浏览器它允许来自任何来源的 XHR/Fetch 跨来源请求。
浏览器是唯一检查 Access-Control-Allow-Origin
header 的工具。 (也是唯一发送 Origin
请求 header 的工具。)
考虑一下您是否使用curl
或其他东西从服务器请求文档:服务器不会检查Origin
header ,并拒绝发送文档,如果请求origin 与 Access-Control-Allow-Origin
header 不匹配。不管怎样,服务器都会发送响应。
就客户端而言,curl
和非浏览器工具一开始就没有来源的概念,因此通常不会发送任何 Origin
> 开头的标题。 (您可以让 curl
发送一个 - 包含任何您想要的值 - 但这毫无意义,因为服务器不关心该值是什么。)
以及curl
等,不检查服务器发送的Access-Control-Allow-Origin
响应头的值,拒绝获取文档如果请求的 Origin
header 与服务器响应中的 Access-Control-Allow-Origin
header 不匹配。他们刚刚拿到文件。
但是浏览器不同。浏览器引擎实际上是唯一具有起源概念的客户端,并且知道 Web 应用程序的 JavaScript 运行的实际起源。
与 curl
等不同,如果请求的 XHR 或 fetch()
调用来自不允许的来源,浏览器将不会让您的脚本获取文档。服务器的 Access-Control-Allow-Origin
header 。
关于javascript - 尝试发送 Angular GET 请求时收到 CORS 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42048116/