简单的jQuery,PHP和JSONP的例子?

我面临着同源政策问题,通过研究这个问题,我发现对于我的特定项目来说,最好的方法是使用JSONP来完成跨域请求。

我一直在阅读关于JSONP的这篇文章 ,但是我并不十分清楚发生了什么。

我在这里要求的是一个简单的jQuery> PHP JSONP请求(或任何术语可能是)) – 类似的东西(显然这是不正确的,它只是让你可以得到我想要实现的东西的想法:))

jQuery的:

$.post('http://MySite.com/MyHandler.php',{firstname:'Jeff'},function(res){ alert('Your name is '+res); }); 

PHP:

 <?php $fname = $_POST['firstname']; if($fname=='Jeff') { echo 'Jeff Hansen'; } ?> 

我将如何转换成适当的JSONP请求? 如果我要将HTML存储在返回的结果中,那也可以吗?

在外部域上使用$ .getJSON时,它会自动执行JSONP请求,例如我的推文滑块

如果你看看源代码,你可以看到我使用.getJSON调用Twitter API。

所以你的例子是:这是testing和工作(你可以去http://smallcoders.com/javascriptdevenvironment.html看到它的行动);

 //JAVASCRIPT $.getJSON('http://www.write-about-property.com/jsonp.php?callback=?','firstname=Jeff',function(res){ alert('Your name is '+res.fullname); }); //SERVER SIDE <?php $fname = $_GET['firstname']; if($fname=='Jeff') { //header("Content-Type: application/json"); echo $_GET['callback'] . '(' . "{'fullname' : 'Jeff Hansen'}" . ')'; } ?> 

注意?callback =? 和+ res.fullname

首先,你不能使用JSONP进行POST请求。

基本上发生的事情是dynamic地插入一个脚本标签来加载你的数据。 因此只有GET请求是可能的。

此外,您的数据必须包装在callback函数中,在请求完成后调用该函数以将数据加载到variables中。

整个过程由jQuery为你自动完成。 只是在外部域使用$ .getJSON并不总是工作。 我可以从个人经验中看出来。

最好的办法是添加&callback =? 给你的url。

在服务器端,你必须确保你的数据被封装在这个callback函数中。

即。

 echo $_GET['callback'] . '(' . $data . ')'; 

编辑:

还没有足够的代表评论利亚姆的回答,所以在这里的解决scheme。

取代Liam的路线

  echo "{'fullname' : 'Jeff Hansen'}"; 

  echo $_GET['callback'] . '(' . "{'fullname' : 'Jeff Hansen'}" . ')'; 

更多build议

JavaScript的:

 $.ajax({ url: "http://FullUrl", dataType: 'jsonp', success: function (data) { //Data from the server in the in the variable "data" //In the form of an array } }); 

PHPcallback:

 <?php $array = array( '0' => array('fullName' => 'Meni Samet', 'fullAdress' => 'New York, NY'), '1' => array('fullName' => 'Test 2', 'fullAdress' => 'Paris'), ); if(isset ($_GET['callback'])) { header("Content-Type: application/json"); echo $_GET['callback']."(".json_encode($array).")"; } ?> 

要使服务器响应一个有效的JSONP数组,请将JSON包装在括号()并预先callback

 echo $_GET['callback']."([{'fullname' : 'Jeff Hansen'}])"; 

使用json_encode()将原生的PHP数组转换为JSON:

 $array = array( 'fullname' => 'Jeff Hansen', 'address' => 'somewhere no.3' ); echo $_GET['callback']."(".json_encode($array).")"; 
 $.ajax({ type: "GET", url: '<?php echo Base_url("user/your function");?>', data: {name: mail}, dataType: "jsonp", jsonp: 'callback', jsonpCallback: 'chekEmailTaken', success: function(msg){ } }); return true; 

在控制器中:

 public function ajax_checkjp(){ $checkType = $_GET['name']; echo $_GET['callback']. '(' . json_encode($result) . ');'; } 

用这个 ..

  $str = rawurldecode($_SERVER['REQUEST_URI']); $arr = explode("{",$str); $arr1 = explode("}", $arr[1]); $jsS = '{'.$arr1[0].'}'; $data = json_decode($jsS,true); 

现在..

使用$data['elemname']来访问这些值。

用JSON对象发送jsonp请求。

请求格式:

 $.ajax({ method : 'POST', url : 'xxx.com', data : JSONDataObj, //Use JSON.stringfy before sending data dataType: 'jsonp', contentType: 'application/json; charset=utf-8', success : function(response){ console.log(response); } })