js跨域通讯

使用script、img等标签元素可以直接引用外域的文件，如我们可以直接引用百度开放云平台上的jqurey：

 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

当本域的html加载了外域的的js文件后，会立即执行其里面的语句，如：

js文件（1.js）：

alert("这是在外部加载进来的弹窗");

html文件:

 <script src="http://xxxxxxx/1.js"></script>

可以发现，当页面刷新，1.js文件加载进来后，会出现弹窗。

因此，当我们需要传回数据时，可以直接在外部js文件里定义一个变量，然后在本域的html文件里引用即可。

js文件：

var returnValue="我是返回的数据";

html文件：

<script src="http://xxxxxxx/1.js"></script> 
<script>alert(returnValue);</script>

 测试可发现，页面加载后能正确弹出返回值。通过浏览器的开发者工具可以看到，页面加载完成后实际变成了这样子：

<script src="http://xxxxxxx/1.js">var returnValue="我是返回的数据";</script> 
<script>alert(returnValue);</script>

这样的话会将返回值直接暴露在全局作用域里，因此我们可以将返回值写成一个函数，然后在需要的时候直接调用：

js文件：

function ExternalFunction(){
   return "返回的数据";
}

html文件：

<script src="http://xxxxxxx/1.js"></script> 
<script>alert(ExternalFunction());</script>

但是这样还是会将这个函数暴露在全局作用域里，因此最好还是写成立即执行函数表达式。

考虑到src指向的只是一个url，不一定是js文件，所以我们可以写一个服务页，然后在本域的html文件里，先自定义的一个函数，并且将这个函数名发给这个服务页，再在这个服务页的立即执行函数里调用这个函数：

外部的php文件：

<?php
$var_char = "return value";


$fun="(function(){var value='".$var_char."';".$_GET["functionName"]."(value);})();";


echo $fun;
?>

本域的html文件：

<script>function MyFunction(value){alert(value);}</script>

<script src="http://localhost:8080/1.php?functionName=MyFunction"></script>

当外部的php返回数据后，本域的html文件实际上变成：

<script>function MyFunction(value){alert(value);}</script>
<script src="http://localhost:8080/1.php?functionName=MyFunction">
(function(){var value='return value';MyFunction(value);})();
</script>

这样便成功使用js进行跨域通讯。此外，还可以用js动态生成这个访问外部服务页的script标签，访问完成后再删除这个script标签，这样可以提高灵活性，做到在需要的时候才引用外部的数据。

另外，还可以使用jqurey来进行跨域通讯。