Page 174 - AngularJS权威教程

154 第 16 章 XHR 实践

<script src="https://api.github.com?callback=angular.callbacks._0"
type="text/javascript"></script>
注意，JSON_CALLBACK被替换成了一个特地为此请求生成的自定义函数。

当支持 JSOPN 的服务器返回数据时，数据会被包装在由 AngularJS 生成的具名函数
angular.callbacks._0中。
在这个例子中，GitHub服务器会返回包含在回调函数中的JSON数据，响应看起来如下所示：

// 简写
angular.callbacks._0({
'meta': {
'X-RateLimit-Limit': '60',
'status': 200
},
'data': {
'current_user_url': 'https://api.github.com/user'
}
})
当AngularJS调用指定的回调函数时会对$http的promise对象进行resolve。

当我们自己开发支持JSONP的后端服务时，要确保响应的数据被包含在请求所
指定的回调函数中。

使用JSONP需要意识到潜在的安全风险。首先，服务器会完全开放，允许后端服务调用应用
中的任何JavaScript。

不受我们控制的外部站点（或者蓄意攻击者）可以随时更改脚本，使我们的整个站点变得脆弱。
服务器或中间人有可能会将额外的JavaScript逻辑返回给页面，从而将用户的隐私数据暴露出来。
由于请求是由<script>标签发送的，所以只能通过JSONP发送GET请求。并且脚本的异常也
很难处理。使用JSONP一定要谨慎，同时只跟信任并可以控制的服务器进行通信。

16.3 使用 CORS

近年来，W3C制定了跨域资源共享来通过标准的方式取代JSONP。

CORS规范简单地扩展了标准的XHR对象，以允许JavaScript发送跨域的XHR请求。它会通过
预检查（preflight）来确认是否有权限向目标服务器发送请求。
预检查可以让服务器接受或拒绝来自全部服务器、特定服务器或一组服务器的请求。这意味
着客户端和服务端应用需要协同工作，才能向客户端或服务器发送数据。

W3C制定CORS规范时对很多细节进行了抽象，并使其对客户端开发者透明，让开发者可以
像发送同域请求一样方便地发送跨域请求。

16.3.1 设置

为了在AngularJS中使用CORS，首先需要告诉AngularJS我们正在使用CORS。使用config()
方法在应用模块上设置两个参数以达到此目的。