加载外部页面的跨域解决方法
Cross-domain workaround to load an external page
这是jQuery文档:
http://api.jquery.com/load/
正如那里提到的附加说明:
由于浏览器安全限制,大多数"Ajax"请求都受制于 同源政策;请求无法成功检索 来自不同域、子域或协议的数据。
有没有办法绕过这个限制?
一种方法是创建一个代理页面,该页面请求服务器上的外部页面。实现取决于所使用的技术,但想法是,然后您可以对代理页面进行 ajax 调用,而不是与调用页面位于同一域中。
是的,有几种方法可以解决这个问题。但我强烈建议CORS(跨域资源共享)。CORS是解决跨域Ajax的新兴标准。这正在取代诸如JSONP(具有已知安全问题)之类的方法。
不幸的是,较旧的IE版本(6-9)不支持CORS,但是对于未本地实现CORS的浏览器,已经建立了polyfill。
在基本层面上,下面是一个示例请求(来自上面的 MDN 链接),其中浏览器生成一个带有 Origin 标头的请求,指示请求的域,该域由端点验证:
GET /resources/access-control-with-credentials/ HTTP/1.1
Host: bar.other
User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Referer: http://foo.example/examples/credential.html
Origin: http://foo.example
Cookie: pageAccess=2
支持 CORS 的 Ajax 端点可能会使用浏览器验证的相应标头进行响应。请参阅此示例中的访问控制-允许源和访问控制-允许-凭据:
HTTP/1.1 200 OK
Date: Mon, 01 Dec 2008 01:34:52 GMT
Server: Apache/2.0.61 (Unix) PHP/4.4.7 mod_ssl/2.0.61 OpenSSL/0.9.7e mod_fastcgi/2.4.2 DAV/2 SVN/1.4.2
X-Powered-By: PHP/5.2.6
Access-Control-Allow-Origin: http://foo.example
Access-Control-Allow-Credentials: true
Cache-Control: no-cache
Pragma: no-cache
Set-Cookie: pageAccess=3; expires=Wed, 31-Dec-2008 01:34:53 GMT
Vary: Accept-Encoding
Content-Encoding: gzip
Content-Length: 106
Keep-Alive: timeout=2, max=100
Connection: Keep-Alive
Content-Type: text/plain
浏览器还可以发送预飞行(使用 OPTIONS 动词),该动词可以向服务器指示 Ajax 调用将使用哪些标头或动词。预飞行实际上是与主 Ajax 调用分开的调用,但仅在特定条件下调用。
许多Web服务器(IIS,Apache)通过模块支持CORS。服务器将需要配置以将源、允许的谓词、标头等列入白名单。也可以使用通配符,但不建议使用。
相关文章:
- 使用JSON序列化图论树的解决方法
- X-Content-Type-Options=nosniff解决方法
- 供应商前缀 CSS 解决方法(引导程序)的速度和大小
- 无法使用HTML5 Web存储保存布尔值的解决方法
- HTML”;文件“/OpenFile对话框解决方法
- 多行链接中引导工具提示的解决方法
- 使用jsonp解决方法进行同步ajax调用
- YQL推特时间线超出速率限制.解决方法
- 嵌套文档.writes和第三方广告在IE中不起作用!!!!任何安全的解决方法
- 加载外部页面的跨域解决方法
- Emberjs - 基于控制器属性进行过滤的奇怪解决方法
- Z 索引绝对定位元素低于父级,具有 z 索引解决方法
- 安卓浏览器触端事件错误解决方法
- 有什么方法可以将类型指定为 self?或解决方法“属性类型不兼容”
- SVG 符号不会触发加载事件(仅在 Firefox 中).我寻找解决方法
- IE10 背景位置 x 的解决方法
- 在 IE11 中添加子项时未更新空选择器的解决方法
- 安卓浏览器上的滚动事件未触发.需要解决方法
- IE8 中 data:uri 的 32KB 限制的任何解决方法
- 溢出-x:可见;不适用于溢出-y:自动;任何解决方法