`
lym6520
  • 浏览: 705708 次
  • 性别: Icon_minigender_1
  • 来自: 福建
社区版块
存档分类
最新评论

jquery:利用jsonp跨域访问

    博客分类:
  • JS
阅读更多
        客户端的跨域访问,可以通过jsonp方式来实现,jquery提供了跨域访问的方法,
        jQuery.ajax()支持get方式的跨域。当然支持跨域还需要服务器端相应的处理。

      

 $.ajax({ 
            async:false, 
            url: '',  // 跨域URL
            type: 'GET', 
            dataType: 'jsonp', 
            jsonp: 'jsoncallback', //默认callback
            data: mydata, //请求数据
            timeout: 5000, 
            beforeSend: function(){  //jsonp 方式此方法不被触发。原因可能是dataType如果指定为jsonp的话,就已经不是ajax事件了
            },
            success: function (json) { //客户端jquery预先定义好的callback函数,成功获取跨域服务器上的json数据后,会动态执行这个callback函数 
                if(json.actionErrors.length!=0){ 
                    alert(json.actionErrors); 
                } 
                
            }, 
            complete: function(XMLHttpRequest, textStatus){ 
               
            }, 
            error: function(xhr){ 
                //jsonp 方式此方法不被触发
                //请求出错处理 
                alert("请求出错(请检查相关度网络状况.)"); 
            } 
        });


        注意:
      
 $.getJSON(url+"?callback=?", 
            function(json){ 
               
        }); 

    这种方式其实是上例$.ajax({..}) 的一种高级封装。
引用

    在服务端通过获得callback参数(如:jsonp*****)得到jQuery端随后要回调的
    然后返回类似:"jsonp*****("+要返回的json数组+")";
    jquery就会通过回调方法动态加载调用这个:jsonp*****(json数组);
    这样就达到了跨域数据交换的目的.


    JSONP是一种脚本注入(Script Injection)行为,所以也有一定的安全隐患。

    注意:jquey是不支持post方式跨域的。
   
    参考:http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/
分享到:
评论

相关推荐

    jquery下利用jsonp跨域访问实现方法

    本篇文章将深入探讨JSONP的工作原理以及在jQuery下如何利用它来实现异步跨域提交表单。 ### JSONP简介 JSONP是一种解决跨域问题的技术,其核心思想是利用`<script>`标签不受同源策略限制的特性。当浏览器解析到`...

    jquery下利用jsonp跨域访问实现方法.docx

    JSONP(JSON with Padding)...总之,JSONP是jQuery中实现跨域访问的一种常见方法,尤其在不支持CORS的旧浏览器环境中非常有用。但随着技术的发展,CORS已成为更推荐的跨域解决方案,因为它提供了更多的控制和安全性。

    跨域访问解决方法-jsonp

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

    浅谈JQuery+ajax+jsonp 跨域访问

    本文将详细介绍JQuery、ajax以及jsonp跨域访问的知识。 首先,jQuery作为一个广泛使用的JavaScript库,其提供的ajax方法极大地简化了HTTP通信操作。然而,当尝试通过ajax访问不同域下的资源时,就会遇到跨域限制...

    jquery跨域调用 js跨域调用

    1. JSONP原理:JSONP利用了浏览器允许嵌入`<script>`标签跨域加载资源的特性。它创建一个`<script>`元素,然后设置其`src`属性为一个可跨域的URL,该URL返回的不是JSON数据,而是包裹在函数调用中的JSON数据。例如,...

    ASPNET_JSONP_demo(jq跨域)

    在 Web 开发中,由于浏览器的同源策略限制,JavaScript 无法直接跨域访问数据。为了解决这个问题,开发者常常使用 JSONP(JSON with Padding) 技术。ASP.NET 和 jQuery 结合使用 JSONP 可以实现跨域数据交互。本示例...

    JQuery跨域访问解决方案

    jQuery作为流行的JavaScript库,提供了一些机制来处理跨域访问。 JQuery的跨域解决方案主要依赖于JSONP(JSON with Padding)技术。JSONP是一种绕过同源策略的方式,它利用HTML中的`<script>`标签没有同源策略限制...

    轻松搞定jQuery+JSONP跨域请求的解决方案

    以上是基于jQuery和JSONP实现跨域请求的解决方案。具体到代码层面,可以通过示例来更清晰地展示如何操作。在这个例子中,客户端页面需要从另一域下的服务端接口获取数据,并将这些数据显示在页面中。通过上述提到的...

    AJax与Jsonp跨域访问问题小结

    在总结中,本文针对JavaScript中的AJAX技术、JQuery中的AJAX封装,以及JSONP跨域访问技术,进行了全面的分析和小结。内容涵盖了从创建XMLHttpRequest对象,到使用AJAX发起异步请求,再到通过JSONP实现跨域访问的一...

    JSONP解决跨域问题

    JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了`<script>`标签可以跨域请求资源的特性,为了解决JavaScript在浏览器端由于同源策略限制无法直接访问不同源的HTTP请求的问题。在本场景中,前端使用...

    jquery ajax跨域html前台 php后台

    在解决跨域问题时,我们可以利用jQuery的`jsonp`模式。JSONP(JSON with Padding)是一种绕过同源策略的方法,它利用`<script>`标签可以跨域加载脚本的特性。 在描述中提到的"jquery ajax json 跨域不解释,代码很...

    JSONP实现Ajax跨域访问

    ### JSONP实现Ajax跨域访问 #### 一、引言 JSONP(JSON with Padding)是一种用于解决跨域数据访问的技术。由于同源策略(Same-Origin Policy)的存在,JavaScript/Ajax只能请求同源的资源,这给需要跨域访问数据...

    jquery ajax jsonp跨域调用实例代码

    jQuery AJAX JSONP 跨域调用是Web开发中解决同源策略限制的一种方法,它允许JavaScript从不同域名的服务器上获取数据。同源策略是浏览器实施的安全策略,阻止了一个源的文档或脚本访问另一个源的属性。JSONP(JSON ...

    Jquery与ajax用JSONP方式获取新浪短网址

    JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了`<script>`标签可以跨域请求资源的特性,来实现JavaScript从不同域名下获取数据。在本案例中,我们将探讨如何使用Jquery和ajax通过JSONP方式来调用新浪...

    Jsonp 跨域的原理以及Jquery的解决方案

    在给定的示例代码中,客户端定义了一个名为jsonpCallback的函数,当从服务器获取数据后,会执行这个函数,并将返回的JSON数据作为参数传递给该函数,实现了数据的跨域访问。 在Jquery中,为了简化JSONP请求的编写,...

    jquery权威指南及跨域访问和Python指南.zip

    跨域访问是Web开发中的一个重要话题,特别是在涉及Ajax请求时。由于浏览器的同源策略限制,JavaScript通常无法直接访问不同源的资源。但通过JSONP、CORS(跨源资源共享)或者使用服务器端代理,开发者可以实现跨域...

    使用Jsonp方式跨域获取json

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

    详解Java Ajax jsonp 跨域请求

    JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了`<script>`标签不受同源策略限制的特性,让浏览器能够从不同域名的服务器获取数据。在JavaScript中,由于浏览器的安全策略,通常不允许一个网页上的脚本...

Global site tag (gtag.js) - Google Analytics