开始本文之前,大家应该首先了解,协议,主机名和端口号相同叫同源。同源策略允许页面从同一个站点加载和执行特定的脚本。站外其他来源的脚本同页面的交互则被严格限制。
<>强要解决这个问题就需要跨域,本文介绍解决角中的跨域的三种方式:强>
JSONP的原理是通过& lt; script>标签发起一个得到请求来取代XHR请求.JSONP生成一个& lt; script>标签并插到DOM中,然后浏览器会接管并向src属性所指向的地址发送请求。当服务器返回请求时,响应结果会被包装成一个JavaScript函数,并由该请求所对应的回调函数调用。
AngularJS美元在http服务中提供了一个JSONP辅助函数。通过美元http服务的JSONP方法可以发送请求,如下所示:
http美元 .jsonp (https://api.github.com& # 63;调=JSON_CALLBACK) .success(功能(数据){//数据 });
因为请求是由& lt; script>标签发送的,所以这个方法只能发送得到请求。
歌珥规范简单地扩展了标准的XHR对象,以允许JavaScript发送跨域的XHR请求。它会通过预检查(起飞前的)来确认是否有权限向目标服务器发送请求。预检查可以让服务器接受或拒绝来自全部服务器,特定服务器或一组服务器的请求。这意味着客户端和服务端应用需要协同工作,才能向客户端或服务器发送数据。
首先需要告诉AngularJS我们正在使用歌珥。使用<代码>配置()代码>方法在应用模块上设置两个参数以达到此目的。
角。模块(“myApp”, []) 过程(函数(httpProvider美元){ 美元httpProvider.defaults.useXDomain=true; 删除httpProvider.defaults.headers美元 .common [' X-Requested-With ']; });
接下来,需要服务端设置响应头,这个需要和后端人员镜像
Access-Control-Allow-Origin这个头的值可以是与请求头的值相呼应的值,为*表示允许接收从任何来源发来的请求。
Access-Control-Allow-Credentials默认情况下,歌珥请求不会发送饼干。如果服务器返回了这个头,那么就可以通过将withCredentials设置为真正来将饼干同请求一同发送出去。
接下来就可以使用下面的请求进行跨域请求了
http美元 . get (" https://api.github.com ") .success(功能(数据){//数据 });
这个服务器和页面处在同一个域中(或者不在同一个域中但支持歌珥),做为所有远程资源的代理。可以简单地通过使用本地服务器来代替客户端向外部资源发送请求,并将响应结果返回给客户端。通过这种方式,老式浏览器不必使用需要发送额外请求的歌珥(只有现代浏览器支持歌珥)也能发送跨域请求,并且可以在浏览器中采用标准的安全策略。
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对的支持。