之前只知道iframe一种跨域方式,其实还有一种更灵活的
第一种document.domain
(听说有安全风险)
子域不同(如:a.xx.com向b.xx.com请求数据),需要在b.xx.com页面设置document.domain='xx.com'。
a.xx.com/a.html
<!DOCTYPE html>
<html>
<head>
<title>POCO相机</title>
</head>
<body>
<form method="post" action="http://b.xx.com/b.php" target="file_upload" enctype="multipart/form-data">
<input type="file" />
<button>上传</button>
</form>
<iframe name="file_upload" style="display:none"></iframe>
<script>
//绑定回调函数
$('iframe').eq(0).load(function() {
//window.frames['file_upload'].response是返回的参数
complete(window.frames['file_upload'].response);
});
//......其他代码
</script>
</body>
</html>
b.xx.com/b.php
//......处理上传的数据
$response = //需要返回的数据
echo "<script>";
echo "document.domain = 'xx.com'";
echo "window.response = $response";
echo "</script>";
第二种,需要同域中转页面
- 共有三个页面A(a.xx.xom/a.html);B(b.xx.xom/b.php);T(a.xx.xom/t.php)。
- A提交表单到B,并传递参数t_url='T的地址'和cb='回调函数名'。
- B处理完A提交的数据后,跳转到T,并将处理结果作为参数传给T,包括'回调函数名'
- T执行从A一直穿过来的回调函数名,并在函数参入B传过来的参数。
下面是3个页面的简略代码:
a.xx.com/index.html
<!DOCTYPE html>
<html>
<head>
<title>POCO相机</title>
</head>
<body>
<form method="post" action="http://b.xx.com/upload.php" target="file_upload" enctype="multipart/form-data">
<input type="file" />
<button>上传</button>
</form>
<iframe name="file_upload" style="display:none"></iframe>
<script>
//回调函数
function callback(response) {
//......
}
//......其他代码
</script>
</body>
</html>
b.xx.com/b.php
//......处理上传的数据
$url = $t_url . '?' . 'cb=' . $cb . '&' . $params//跳转的地址和参数
//跳转到a.xx.com/t.php
echo "<script>location.href = $url;<script>";
a.xx.com/t.php
//......处理传过来的参数
$cb = //回调函数名
$response = //格式化的参数
echo "<script>";
echo "$cb($response)";//在这里执行a.html页面的回调函数(同域)
echo "</script>";
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。