Javascript 尝试发送角度GET请求时接收CORS错误

Javascript 尝试发送角度GET请求时接收CORS错误,javascript,angularjs,https,get,cors,Javascript,Angularjs,Https,Get,Cors,这是我的结束点: 我得到的答复是: {"152":{"user":{"id":198,"firstname":null,"lastname":null,"username":"Lucerna-chem","email":"oliveri@lucerna-chem.ch","type":"Distributor","password_temp":null,"code":"omrotFVDQS3T75wTFUS67W0kUnXUpePrvaP5Pha9QevHjB0olSjPIxhmmJuZ","

这是我的结束点:

我得到的答复是:

{"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发送一个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>

今天的欢迎辞是:

{{myData}} var-app=angular.module('myApp',[]); app.config(['$httpProvider',函数($httpProvider){ $httpProvider.defaults.useXDomain=true; 删除$httpProvider.defaults.headers.common['X-Requested-With']; } ]); app.controller('myCtrl',函数($scope,$http){ $http.get(“http://d.biossusa.com/api/distributor?key=#####") .然后(功能(响应){ $scope.myWelcome=response.data; }); });
但是,我一直在控制台中接收CORS错误

如何防止CORS错误?我能做些什么来显示我的数据吗

您需要添加以下内容:

header('Access-Control-Allow-Headers: Content-Type');
header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
header('Access-Control-Allow-Origin: *');
在laravel中,将其包含在路由文件中。

您需要添加以下内容:

header('Access-Control-Allow-Headers: Content-Type');
header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
header('Access-Control-Allow-Origin: *');
在laravel中,包含在路由文件中

为什么我只有在使用角度时才会出错

当您创建一个Web应用程序,该应用程序具有任何客户端JavaScript,该JavaScript向
http://d.biossusa.com/api/distributor?key=*****
使用
XMLHttpRequest
或任何使用它们的库(例如jQuery)

所以这不是一个特定于角度的问题

至于为什么会出现这个错误,是因为浏览器限制您的Web应用程序从JavaScript发出跨源请求,除非发送请求的站点选择加入允许它

站点选择允许跨来源请求的方式是发送一个响应,该响应包含一个
访问控制允许来源
头,该头指示允许来自哪个来源的请求

因此,发送
访问控制允许来源:
响应头的站点告诉浏览器,它允许来自任何来源的XHR/获取跨来源请求

浏览器是检查
accesscontrolalloworigin
标题的唯一工具。(并且是唯一发送
来源
请求头的工具。)


考虑是否使用
curl
或其他方法从服务器请求文档:服务器不检查
Origin
标题,如果请求的来源与
Access Control Allow Origin
标题不匹配,则拒绝发送文档。不管怎样,服务器都会发送响应

就客户端而言,
curl
和非浏览器工具没有原点的概念,因此通常不发送任何
origin
头。(您可以让
curl
发送一个包含您想要的任何值的文件,但这是毫无意义的,因为服务器不关心该值是什么。)

curl
等,不检查服务器发送的
Access Control Allow Origin
响应头的值,如果请求的
Origin
头与服务器响应中的
Access Control Allow Origin
头不匹配,则拒绝获取文档。他们刚拿到文件

但是浏览器是不同的。浏览器引擎实际上是唯一一个一开始就有原点概念,并且知道Web应用程序JavaScript运行的实际原点的客户端

curl
等不同,如果请求文档的XHR或
fetch()
调用来自服务器的
Access Control Allow origin
头中不允许的源,浏览器将不允许脚本获取文档

为什么我只有在使用角度时才会出错

当您创建一个Web应用程序,该应用程序具有任何客户端JavaScript,该JavaScript向
http://d.biossusa.com/api/distributor?key=*****
使用
XMLHttpRequest
或任何使用它们的库(例如jQuery)

所以这不是一个特定于角度的问题

至于为什么会出现这个错误,是因为浏览器限制您的Web应用程序从JavaScript发出跨源请求,除非发送请求的站点选择加入允许它

站点选择允许跨来源请求的方式是发送一个响应,该响应包含一个
访问控制允许来源
头,该头指示允许来自哪个来源的请求

因此,发送
访问控制允许来源:
响应头的站点告诉浏览器,它允许来自任何来源的XHR/获取跨来源请求

浏览器是检查
accesscontrolalloworigin
标题的唯一工具。(并且是唯一发送
来源
请求头的工具。)


考虑是否使用
curl
或其他方法从服务器请求文档:服务器不检查
Origin
标题,如果请求的来源与
Access Control Allow Origin
标题不匹配,则拒绝发送文档。不管怎样,服务器都会发送响应

就客户端而言,
curl
和非浏览器工具没有原点的概念,因此通常不发送任何
origin
头。(您可以让
curl
发送一个包含您想要的任何值的文件,但这是毫无意义的,因为服务器不关心该值是什么。)

curl
等,不检查服务器发送的
Access Control Allow Origin
响应头的值,如果请求的
Origin
头与服务器响应中的
Access Control Allow Origin
头不匹配,则拒绝获取文档。他们刚拿到文件

但是浏览器是不同的。浏览器引擎实际上是唯一一个一开始就有原点概念,并且知道Web应用程序的实际原点的客户端