- jsonp
-
iframe
● document.domain
● window.name
● location.hash
● navigator (IE6 bug)
● postMessage - CORS
● XMLHttpRequest (modern browser)
● XDomainRequest (IE8+) - 图像Ping (略)
- flash (略)
-
代理/转发
● http-server
● webpack-dev-server
● nginx
前后端跨域交互终于迎来了官方的支持,只需在后端设置允许前端请求域,即可轻松实现跨域。
CORS适用与IE8+
及现代浏览器
。现代浏览器通过XMLHttpRequest
,IE通过XDomainRequest
实现。
事件句柄(标*的事件XDomainRequest不支持)
onloadstart* 请求触发
onprogress 读取及发送数据时触发
onabort* 请求终止时触发
onerror 请求失败时触发
onload 请求成功时触发
ontimeout 超时触发
onloadend* 请求结束时触发
后端设置Access-Control-Allow-Origin
,标识允许请求的来源域比如http://foo.com
,*
表示允许来自任意域的请求。
XMLHttpRequest
var xhr = new XMLHttpRequest();
xhr.onload = function () {
console.log(xhr.responseText);
}
xhr.onerror = function() {
console.log('Request Error!');
}
xhr.open('get', 'http://bar.com/xx.php');
xhr.send(null);
XDomainRequest
var xdr = new XDomainRequest();
xdr.onload = function() {
console.log(xdr.responseText)
}
xdr.onerror = function() {
console.log('Request Error!');
}
xdr.open('get', 'http://bar.com/.php');
xdr.send(null);
<?php
header("Access-Control-Allow-Origin:*");
echo 'xxx';
?>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。