<script type="text/javascript"> // this shows dynamic script insertion var script = document.createElement('script'); script.setAttribute('src', url); // load the script document.getElementsByTagName('head')[0].appendChild(script); </script>
JSONP协议封装了上述步骤，jQuery中统一是现在AJAX中(其中data type为JSONP)：
为了支持JSONP协议，服务器端必须提供特别的支持[2]，另外JSONP只支持GET请求。
2.2 Proxy
使用代理方式跨域更加直接，因为SOP的限制是浏览器实现的。如果请求不是从浏览器发起的，就不存在跨域问题了。
使用本方法跨域步骤如下：
1. 把访问其它域的请求替换为本域的请求
2. 本域的请求是服务器端的动态脚本负责转发实际的请求
各种服务器的Reverse Proxy功能都可以非常方便的实现请求的转发，如Apache httpd + mod_proxy。
Eg.
为了通过Ajax从:8080访问:8081/api，可以将请求发往:8080/api。
然后利用Apache Web服务器的Reverse Proxy功能做如下配置：
ProxyPass /api :8081/api
2.3 CORS
2.3.1 Cross origin resource sharing
“Cross-origin resource sharing (CORS) is a mechanism that allows a web page to make XMLHttpRequests to another domain. Such "cross-domain" requests would otherwise be forbidden by web browsers, per the same origin security policy. CORS defines a way in which the browser and the server can interact to determine whether or not to allow the cross-origin request. It is more powerful than only allowing same-origin requests, but it is more secure than simply allowing all such cross-origin requests.” ----Wikipedia[3]
通过在HTTP Header中加入扩展字段，服务器在相应网页头部加入字段表示允许访问的domain和HTTP method，客户端检查自己的域是否在允许列表中，决定是否处理响应。
实现的基础是JavaScript不能够操作HTTP Header。某些浏览器插件实际上是具有这个能力的。
服务器端在HTTP的响应头中加入（页面层次的控制模式）：
Access-Control-Allow-Origin: example.com
Access-Control-Request-Method: GET, POST
Access-Control-Allow-Headers: Content-Type, Authorization, Accept, Range, Origin
Access-Control-Expose-Headers: Content-Range
Access-Control-Max-Age: 3600
多个域名之间用逗号分隔，表示对所示域名提供跨域访问权限。"*"表示允许所有域名的跨域访问。
客户端可以有两种行为：
1. 发送OPTIONS请求，请求Access-Control信息。如果自己的域名在允许的访问列表中，则发送真正的请求，否则放弃请求发送。
2. 直接发送请求，然后检查response的Access-Control信息，如果自己的域名在允许的访问列表中，则读取response body，否则放弃。
本质上服务端的response内容已经到达本地，JavaScript决定是否要去读取。
Support: [Javascript Web Applications] * IE >= 8 (需要安装caveat) * Firefox >= 3 * Safari 完全支持 * Chrome 完全支持 * Opera 不支持
2.3.2 测试
测试页面:8080/test3.html使用jquery发送Ajax请求。
<html> <head><title>testing cross sop</title></head> <body> Testing. <script src="https://www.jb51.net/jquery-2.0.0.min.js"></script> <script type='text/javascript'> $.ajax({ url: 'http://localhost:8000/hello', success: function(data) { alert(data); }, error: function() { alert('error'); } }); </script> </body> </html>
测试Restful API(:8000/hello/{name})使用bottle.py来host。
from bottle import route, run, response @route('/hello') def index(): return 'Hello World.' run(host='localhost', port=8000)
测试1：
测试正常的跨域请求的行为。
测试结果：
1. 跨域GET请求已经发出，请求header中带有
Origin :8080
2. 服务器端正确给出response
3. Javascript拒绝读取数据，在firebug中发现reponse为空，并且触发error回调
测试2：