PHP下ajax跨域的解决方案之jsonp实例分析

近年来，前端开发中涉及到跨域的需求越来越多，而PHP是基础性最强的Web语言之一，也深受跨域困扰之一。在这种情况下，解决跨域问题的方式自然就成为了开发人员关注的焦点。本文主要介绍了PHP下通过jsonp实现跨域请求和响应的方案和实例分析。

什么是jsonp？

jsonp（即“JSON with padding”）是一种跨域请求的方法，在使用jsonp之前，我们需要了解下jsonp的基本原理：jsonp 的原理就是通过script标签的src属性实现跨域的访问， script标签没有跨域的限制， 其可以被放入任何网页中，只需要简单的改变一下JavaScript的同源策略，就可以有效地实现跨域。Jsonp在web应用中广泛使用，特别是与不同域名的API之间数据交换。

为什么要使用jsonp？

我们来看一个例子：

假设我们有一个A网站，它想要从B网站获取数据，这两个网站并不在一个域名下面，这时候的数据请求就会被浏览器拦截，因为浏览器是有同源策略的，不允许不同源的脚本中相互操作和访问。

因此，在这种情况下，我们使用jsonp，可以解决跨域访问的问题，使得A网站可以顺利获取到B网站的数据。

jsonp的使用示例

以下是一个简单示例，通过jsonp获取远程接口数据：

  //远程接口地址
  $url = 'http://www.example.com/api.php';
  //前端请求进行jsonp包裹请求  
  $callback = isset($_GET['callback']) ? $_GET['callback'] : 'fn';
  //按照jsonp格式返回值
  $result = json_encode(['name'=>'haha',   'age'=>12]);
  die("{$callback}({$result});");
  

在以上代码中，首先我们定义了一个远程接口地址 $url，然后在执行jsonp请求时，我们将请求参数进行处理（注意：由于jsonp是通过script标签的src属性实现跨域的，因此只能使用GET请求），然后通过 die 函数，返回以请求参数中 callback 值为方法名的JSONP格式的字符串，最后前端通过使用callback函数包裹返回字符串来实现数据的异步获取。

客户端请求代码：

<script>

function fn (data) {

console.log(data);

// data === { 'name':'haha', 'age': 12}

}

var script = document.createElement('script');

script.type = 'text/javascript';

script.src = 'http://example.com/jsonp.php?callback=fn';

document.body.appendChild(script);

</script>

在以上客户端代码中，我们首先定义了一个输出函数fn，然后创建了一个script节点，将远程接口地址设置到script节点的src属性中，并在其中指定了callback参数，在使用 document. body.appendChild 方法将该节点插入页面中，通过调用 callback 函数来执行获取到的数据。

jsonp的优缺点

优点：

- 支持跨域访问，在不同的域名间的数据交互时非常方便；

- 兼容性良好，几乎所有的浏览器都支持，包括IE6以上浏览器；

- 实现简单，只需要做简单的数据格式包装即可；

- 可以兼容json数据和非json数据。

缺点：

- 只支持get请求，不能做到post请求的效果；

- 安全性相对较差，因为整个过程中我们都是在前端处理数据，容易被攻击者伪造数据包。

总结

jsonp是一种非常好用的跨域请求方法，可以轻松地实现在不同域名间的数据交互。虽然其使用存在一些限制和缺陷，但是其简单易用的特点使其在大量的Web应用的JSON数据交换中，使用非常广泛。如果已经熟悉jsonp的原理和使用方法，这些问题相对来说还是非常好解决的，对于那些需要跨域数据交互的Web应用来说，不妨也试试jsonp。