`

AJAX 跨域请求 - JSONP获取JSON数据

阅读更多
JSONP(JSON with Padding)是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)。
客户端代码:
  
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />  
    <script type="text/javascript">  
        function jsonpCallback(result) {  
            //alert(result);  
            for(var i in result) {  
                alert(i+":"+result[i]);//循环输出a:1,b:2,etc.  
            }  
        }  
        var JSONP=document.createElement("script");  
        JSONP.type="text/javascript";  
        JSONP.src="http://crossdomain.com/services.php?callback=jsonpCallback";  
        document.getElementsByTagName("head")[0].appendChild(JSONP);  
    </script> 
 


服务端代码


    <?php  
      
    //服务端返回JSON数据  
    $arr=array('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5);  
    $result=json_encode($arr);  
    //echo $_GET['callback'].'("Hello,World!")';  
    //echo $_GET['callback']."($result)";  
    //动态执行回调函数  
    $callback=$_GET['callback'];  
    echo $callback."($result)";  








2
1
分享到:
评论

相关推荐

    Ajax跨域请求解决方案-JSONP

    总的来说,JSONP是Ajax跨域请求的一种实用解决方案,尤其适用于只支持GET请求且不涉及复杂交互的场景。但是,它也有一些局限性,比如不支持POST请求、无法控制HTTP头部、无错误处理机制等。因此,在现代Web开发中,...

    html通过 ajax jsonp跨域请求接收和传送数据

    1. **AJAX跨域**: 通常,AJAX请求受到同源策略限制。为实现跨域,我们可以使用CORS(Cross-Origin Resource Sharing)机制。服务器需要在响应头中添加`Access-Control-Allow-Origin`字段,允许特定的源进行跨域访问...

    AJAX跨域请求之JSONP获取JSON数据

    JSONP(JSON with Padding)是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)。

    jsonpajax跨域请求

    在Web开发中,由于浏览器的同源策略限制,JavaScript不能直接向其他域名发送请求,但JSONP和AJAX通过特定的方式绕过了这个限制,使得前端能够获取到不同源的数据。 1. JSONP介绍: JSONP是一种非官方的跨域数据...

    利用JQuery jsonp实现Ajax跨域请求json数据

    通过在客户端设置`dataType: 'jsonp'`和`jsonp: 'callback'`,然后在服务器端根据请求的回调函数参数构建响应,我们可以实现Ajax跨域获取JSON数据。无论是在.Net的`.handler`还是WebService中,这一过程都是相似的,...

    跨域请求资源-jsonp和cors区别.pdf

    - **JSONP**(JSON with Padding)是一种利用`&lt;script&gt;`标签不受同源策略限制的特点来实现跨域请求的技术。 - JSONP的实现原理是动态插入`&lt;script&gt;`标签,并将回调函数名作为参数传递给服务器,服务器返回的结果会在...

    AJAX跨域请求JSONP获取JSON数据的实例代码

    JSONP(JSON with Padding)是JavaScript中用于解决同源策略限制的一种技术,它允许Web应用程序进行跨域数据交互。在JavaScript中,XMLHttpRequest对象受到同源策略的约束,无法直接发起对不同源的HTTP请求。然而,...

    跨域访问解决方法-jsonp

    跨域访问是Web开发中一个常见的挑战,尤其是在进行Ajax异步请求时,浏览器的同源策略(Same-origin policy)会限制JavaScript从一个源获取另一个源的数据。为了解决这个问题,开发者通常采用JSONP(JSON with ...

    ajax 跨域请求问题 jquery jsonp

    **Ajax跨域请求问题与jQuery JSONP解析** 在Web开发中,Ajax技术被广泛用于实现页面的异步更新,但浏览器的同源策略(Same-Origin Policy)限制了Ajax请求只能向同源(协议、域名、端口均相同)的服务器发送。这在...

    ajax跨域CORS方案 JSONP跨域请求方案.zip

    在Web开发中,跨域(Cross-Origin)是一个常见的问题,特别是在使用Ajax进行异步数据交互时。跨域限制是浏览器为了安全原因而设置的一种机制,防止恶意网站通过脚本访问其他站点的数据。本文将深入探讨两种主要的...

    JQuery AJAX跨域提交参数、接收json数据.docx

    在 JQuery 的 AJAX 实现中,我们可以使用 `jsonp` 方法来实现跨域请求,该方法可以将数据发送到远程服务器,实现跨域数据交互。 JQuery 的 AJAX 功能提供了多种方法来实现跨域提交参数和接收 JSON 数据,我们可以...

    使用Jsonp方式跨域获取json

    JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了`&lt;script&gt;`标签可以跨域请求资源的特性来实现数据的交换。在Web开发中,由于浏览器的同源策略限制,JavaScript通常无法直接访问不同源的资源,但JSONP...

    Ajax +jquery跨域获取JSON

    这里的"Ajax + jQuery跨域获取JSON"是一个典型的Web开发技术应用场景,主要用于解决Web应用程序中不同源之间的数据共享问题。在本案例中,开发者成功地实现了跨域请求以获取JSON数据,并将这些数据用于展示天气预报...

    通过jsonp获取json数据实现AJAX跨域请求

    JSONP(JSON with Padding)是一种解决浏览器同源策略限制,实现AJAX跨域请求的方法。在Web开发中,由于浏览器的安全策略,JavaScript通常不能从不同的域名下获取数据,即同源策略。但JSONP巧妙地利用了HTML允许跨域...

    解决ajax跨域请求问题

    本文将深入探讨如何解决Ajax跨域请求的问题。 首先,理解“同源策略”是解决问题的关键。同源策略是浏览器为了保障网络安全而设定的一种机制,它禁止了一个源的文档或脚本访问另一个源的属性,这里的“源”指的是...

    ajax跨域获取数据

    但随着互联网应用的发展,这种需求变得越来越普遍,于是诞生了"ajax跨域获取数据"的技术解决方案。这个话题涵盖了多个关键知识点,包括同源策略、CORS(跨源资源共享)以及JSONP等。 1. 同源策略:同源策略是浏览器...

    ajax跨域请求WebService.asmx

    总结,Ajax跨域请求WebService.asmx是一个结合了前端JavaScript异步请求技术和后端C# Web服务交互的实例,它涉及到了跨域策略、HTTP通信、CORS配置以及JSON数据交换等多个Web开发的重要知识点。正确理解和运用这些...

    Jquery跨域Ajax请求测试

    $.ajax()可以接受一系列参数,其中关键的两个是`url`(指定要请求的远程服务地址)和`dataType`(指定返回数据的类型,如json、xml等)。为了实现跨域,我们需要设置`dataType`为`jsonp`。JSONP(JSON with Padding...

Global site tag (gtag.js) - Google Analytics