js跨域解决方法

 

1,jsonp

利用script支持跨域和对js文件的动态解析的特点实现。示例如下：

 

前端js

<script type="text/javascript"><!-- function showUserStatus(data) { alert(data.txt); } // --></mce:script> <!--将函数名showUserStatus传递过去--> <script type="text/javascript" src="http://app.a.com/userStatus.php?callback=showUserStatus" src="http://app.a.com/userStatus.php?callback=showUserStatus"></script>

 

后端代码

$get = $_GET; $rtData = array( 'uID' => 10000, 'name' => 'Zhangsf', 'txt' => 'Welcome ZhangSanFeng', ); // 获取传递来的函数名，并拼凑完整的函数执行体 echo $get['callback'] .'('. json_encode($rtData) .')'; 

 

2修改iframe的domain

通过document.domain="a.com"，该方法只适用于子域名的情况

 

 

3iframe,参考新浪微博的头像上传实现

 

test.a.com/upload.html

<mce:script type="text/javascript"><!-- // 这个函数将来会被iframe用到 function getIframeVal(val) { alert(val); } // --></mce:script> <form method="post" target="if" enctype="multipart/form-data" action="http://upload.com/deal.php?cb=http://test.a.com/deal_cd.html"> <input type="file" name="file" /> <input type="SUBMIT" value="upload" /> </form> <IFRAME id="if" name="if" src="about:blank" mce_src="about:blank" frameborder='0'></IFRAME>

upload.com/deal.php

<?php // deal upload file // and get file id, you can pass other params either header('location:'.$_GET['cb'].'?file_id=123');

test.a.com/deal_cb.html

<script type="text/javascript"><!-- var rs = window.location.search.split('?').slice(1); window.parent.getIframeVal(rs.toString().split('=').slice(1)); // --></script>