ajax跨域——Jsonp

今天在进行学习的当中,想利用jquery当中的$.ajax访问其他服务器来获取数据.这时在Console中提示

XMLHttpRequest cannot load http://0.0.0.0:3001/xxxx. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://0.0.0.0:3000' is therefore not allowed access. 


从这里我们可以知道是 我想用3000这个端口去访问3001 但是被拒绝了..

原本是采用的 通过ajax访问本地服务器,在通过服务器端的请求实现跨域请求的.. 

但是后来发现,使用jsonp可以直接实现ajax跨域的get方法

    
以下以ruby在rails上为例:
3000端口主要代码:(浏览器)

:javascript
    $(document).ready(function(){
      user_login();
    })


    function user_login(){
       $.ajax({
           type:'get',
           url:'http://0.0.0.0:3001/show_user/',
           dataType:"jsonp",
           success:success_result,
           error:error_result
     })
    }
    function success_result(username)
    {
      alert(username)
    }
    function error_result(error)
    {
      alert(error)
    }



3001端口主要代码(服务器)

def show_user
    callback=params[:callback]
    render :text =>callback+"('XiaoMing')"
end





这里的params[:callback]是jquery中默认命名的回调函数名,实际url为url?callback=success_result
其实就是success后所对应的方法..
最终结果为  在3000端口弹出'XiaoMing'提示框


因为是jquery中的技术..所以也可以自行转化为其他语言实验..
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值