通过jsonp实现跨越应用示例

转载自:http://www.smallgang.cn/index.php/JavaScript/jsonp.html

 

什么是JSONP协议?

JSONP即JSON with Padding。由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源。如果要进行跨域请求,我们可以通过使用html的script标记来进行跨域请求,并在响应中返回要执行的script代码,其中可以直接使用JSON传递javascript对象。这种跨域的通讯方式称为JSONP。

很明显,JSONP是一种脚本注入(Script Injection)行为,需要特别注意其安全性。

站点www.87end.cnd的php代码(jsonp.php)

//ajax接收的参数
$action = $_GET['act'];
$name = $_GET['name'];

call_user_func($action, $name);

function sayHello($name) {
    $callback = trim($_GET['jsoncallback']);
    $arr = array(‘msg’=>’hello ‘ . $name);
    echo $callback.”(“.json_encode($arr).”);”;
}

站点www.smallgang.cn的 JS脚本(jsonp.html), 用jquery的ajax,有两种实现方式

方法一: jQuery.getJSON(url,[data],[callback])
$.getJSON(“http://www.87end.cn/jsonp.php?act=sayHello&name=xiaogang&jsoncallback=?”,
     function(data){
         alert(data.msg);
     } 
);

方法二:jQuery.ajax(options)
$.ajax({
    type: ‘GET’,  
   url: ‘http://www.87end.cn/jsonp.php’,   
   data: ‘act=sayHello&name=xiaogang’,   
   jsonp: ‘jsoncallback’,   
   success: function (data) {  
       alert(data.msg);
    },
    dataType: ‘jsonp’,
}); 

 一般都习惯于用$.getJSON(),就像大家都喜欢用$.get()或者$.post(),而不怎么用$.ajax(),一般不用到详细配置。

关于jsonp详细介绍:http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/

用CI框架 写 url时:

$.getJSON(“http://www.xx.com/api_common/is_vip/lee33/jsoncallback=?”, function(data){
  alert(data); //提示-1

});

用firebug 网络看请求的链接为:

http://www.xx.com/api_common/is_vip/lee33/jsoncallback=jsonp1308635285364?_=1308637178392

api文件夹下common控制器的is_vip方法:

public function is_vip(){
  $username = $this->input->get(3);
  $jstr = $this->input->get(4);
       
  if($username){
      $this->load->model(‘api/m_common’);
      $return = $this->m_common->check_vip($username);//1或-1
  }

  $str = $jstr.’(‘.json_encode($return).’)';
  echo $str;
  
 }

 firebug看响应内容:

jsoncallback=jsonp1308635285364(“-1″) 说明 $jstr值为:jsoncallback=jsonp1308635285364

 

此条目发表在 Ajax 分类目录,贴了 , , 标签。将固定链接加入收藏夹。

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>