如何实现跨域！

前言：

这里说的js跨域是指通过js在不同的域（服务器）之间进行数据传输或通信，比如用ajax向一个不同的域请求数据，或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同，都被当作是不同的域。

要解决跨域的问题，我们可以使用以下几种方法：

一、通过原生js实现jsonp跨域：

实现原理：

1、后台不是直接返回数据，而是返回一个函数，同时这个函数传入要返回的数据。

2、前端利用script的src形式（<script src="http://xxx/tp5/public?callback=dosomething"></script>）请求接口并传入callback=dosomething（可以自定义）。（替代ajax的做法）

代码如下：

后台：

 public function index()
    {
        $callback = $_GET['callback'];   
        $data = array(
            'a'=>123,
            'b'=>456
        );
        return $callback.'('.json_encode($data).')';
    }

前端：

特别注意下面的先后顺序，必须先定义dosomething,然后通过src的形式来进行调用接口。

<script>
        function dosomething(res) {
            console.log(res);
        }
</script>
<script src="http://xxxx/tp5/public?callback=dosomething"></script>

 

二、通过Jquery来实现jsonp跨域！（项目中推荐使用这个！！！）

实现原理同上！但是更简单！后台代码不变，还是返回一个函数，函数里面传入要返回的数据！

前端代码如下：

和一般的ajax请求一样，就是多了一句  dataType:"jsonp"！

<script>
        $.ajax({
            url: 'http://118.24.176.74/tp5/public',
            dataType:"jsonp",
            success: function (res) {
                console.log(res)
            }
        });
 </script>

小结：

1、首先弄明白跨域原理，其次项目中推荐使用Jquery来进行跨域！

2、前端的话，加一句即可dataType:"jsonp"； 

3、后台需要改变三处    （1）$callback = $_GET['callback'];  （2） return $callback.'('.json_encode($data).')' （3）把post请求改为get请求！;

 -------------------------------------------------------------------------------------------------------------------------------------------------------补充-------------------------------------------------------------------------------------------------------------------

php返回数据，可以调用以下函数来实现灵活切换为返回格式。

function api_jsonp_encode($json)
    {
        if (!empty($_GET['callbak'])) {
            return $_GET['callbak'] . '(' . $json . ')'; // jsonp
        }
        return $json; // json
    }

 

特别注意：如果采用jsonp跨域请求，则请求方式默认就是get ，因此后台的代码也得改为get式的获取数据！

 

 

后台解决跨域：

php中：

 

header('Access-Control-Allow-Origin: *');

注意：这个在php非框架中可以用，但是在tp5等框架中有问题，需要用行为或者中间件来操作！