`

jsonp跨域简单实例

 
阅读更多

浏览器的同源策略,限制脚本程序只能和同协议,同域名,同端口的脚本进行交互,包括共享和传递变量,cookie的传递。尽管浏览器不允许页面脚本跨域读 取数据,但是允许html引用跨域的资源,比如脚本程序,css,图片,等等,因为script,iframe的src是不存在跨域的。

Java代码  收藏代码
  1. $.get( "http://www.b.com:8080/domain2/index.jsp" ,  
  2. {}, function(data){  
  3. alert(' error:' +data)  
  4. }, "html" );  



比如上面的请求,因为是跨域读取数据,所以,无法获取想要的数据


jsonp是非官方协议,它是在服务端生成script tags返回到客户端,在客户端通过javscript callback形式实现跨域访

问。

jsonp原理是客户端定义一个callback,然后把callback名字传送至服务端,服务端生成json数据,然后以javascript

的方式,生成一个以callback名字的function的javascript函数执行形式,将json数据以入参方式放到function中,就

生成了一个js的函数执行语法的文档,传到客户端。客户端浏览器解析script,执行服务端返回的javascript片段,返

回的数据作为参数,传入到客户端定义的callback中动态执行。

实例

Java代码  收藏代码
  1. //www.a.com:8080/domain1/index.jsp   
  2.   
  3. <script type="text/javascript" >      
  4.         function sayHello(result){       
  5.            alert(result());       
  6.         }       
  7.     </script>    
  8.     <script type="text/javascript" src="http: //www.b.com:8080/domain2/index.jsp?   
  9.   
  10. callback=sayHello"></script>  
  11.   
  12.   
  13. //www.b.com:8080/domain2/index.jsp   
  14.   
  15.  <%  
  16.         String script="function show(){ return 'hello';}" ;  
  17.         //String script="{name:'yuyong'}";   
  18.         String callback=request.getParameter("callback" );  
  19.         out.println(callback+"(" +script+ ")" );  
  20.      %> 
分享到:
评论

相关推荐

    JSONP跨域请求实例详解

    JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了浏览器的同源策略的例外,即允许页面加载来自不同源的`&lt;script&gt;`标签。这种方法主要用于解决现代浏览器中的跨域数据访问问题,因为JSONP不受同源策略的...

    jsonp跨域请求数据实现手机号码查询实例分析.docx

    ### JSONP 跨域请求数据实现手机号码查询实例分析 #### 前言 在现代Web开发中,跨域问题一直是前端开发者面临的一个常见难题。简单来说,由于浏览器的同源策略限制,当一个网页尝试从不同的源(即不同的协议、端口...

    jquery ajax jsonp跨域调用实例代码

    今天研究了AJAX使用JSONP进行跨域调用的方法,发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下,方便需要的朋友

    JS 使用 JSONP 跨域获取用户IP

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

    ASPNET_JSONP_demo(jq跨域)

    在客户端,使用 jQuery 发起 JSONP 请求非常简单。设置 `dataType` 为 `'jsonp'`,并指定回调函数名(`jsonpCallback` 或 `callback`): ```javascript $.ajax({ url: 'http://yourserver.com/JsonpHandler.ashx'...

    借助node实战JSONP跨域实例

    【JSONP跨域原理】 JSONP(JSON with Padding)是一种跨域数据交互协议,它的基本思想是利用浏览器允许 `&lt;script&gt;` 标签加载不同源的脚本这一特性,通过动态创建 `&lt;script&gt;` 标签并设置其 `src` 属性来发起请求。...

    跨域访问解决方法-jsonp

    总结,JSONP是一种简单且广泛使用的跨域解决方案,尤其适用于那些不支持CORS的旧版本浏览器。然而,考虑到安全性和灵活性,CORS在现代Web开发中已成为更推荐的选择。理解JSONP的工作原理和使用方法对于任何Web开发者...

    jsonp跨域获取数据的基础教程.docx

    JSONP(JSON with Padding...以下是一个简单的JSONP手动实现的例子: ```html &lt;!DOCTYPE html&gt; &lt;head&gt;&lt;title&gt;JSONP Demo&lt;/title&gt;&lt;/head&gt; function jsonp(data) { console.log('username:', data.username); } ...

    jsonp跨域请求实现示例

    以下是使用Java Servlet实现JSONP服务端的一个简单例子: ```java @WebServlet("/jsonp") public class JsonpServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, ...

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

    需要注意的是,虽然JSONP提供了一种灵活的跨域请求解决方案,但它也有一些局限性和安全风险。例如,JSONP允许执行任意的JavaScript代码,如果服务器端的输出没有经过严格验证和清洗,可能会导致跨站脚本攻击(XSS)...

    使用jsonp实现跨域获取数据实例讲解

    在给定文件中,我们看到了一段使用JSONP方法实现跨域获取数据的JavaScript代码实例及其在HTML页面中的应用。首先,我们定义了一个名为`jsonp`的函数,用于封装JSONP请求的过程。这个函数接收三个参数:`url`(请求的...

    详解java 中Spring jsonp 跨域请求的实例

    在Spring框架中处理JSONP跨域请求是一个常见问题,尤其当开发者需要从前端JavaScript代码中调用不同域上的RESTful服务时。由于浏览器的安全限制,同源策略防止了不同域的文档或脚本间的交互,这使得传统的AJAX请求不...

    PHP AJAX JSONP实现跨域请求使用范例_ajax如何解决跨域请求

    PHP AJAX JSONP 实现跨域请求使用实例 在 Web 开发中,跨域请求是指从一个域名下的页面请求另一个域名下的资源,这种情况下,浏览器会限制这种请求,以防止恶意攻击。JSONP(JSON with Padding)是一种解决跨域请求...

    jsonp跨域请求数据实现手机号码查询实例分析

    本文实例讲述了jsonp跨域请求数据实现手机号码查询的方法。分享给大家供大家参考,具体如下: 前言 网上有很多开放的api,我们在本地通过ajax获取数据时,总会碰到一个问题,那就是跨域!如果不借助php等,仅仅通过...

    JavaScript用JSONP跨域请求数据实例详解

    JavaScript中的JSONP(JSON with Padding)是一种常用的解决跨域问题的技术。由于浏览器的同源策略限制,JavaScript通常不能跨域访问资源,除非目标服务器明确允许。JSONP利用了`&lt;script&gt;`标签不受同源策略限制的...

    jQuery Jsonp跨域模拟搜索引擎

    1. jQuery Jsonp跨域概念: - jQuery Jsonp是一种用于跨域请求的技术手段。在Web开发中,出于安全考虑,浏览器实施了同源策略,限制了一个域下的脚本与另一个域下的资源进行交互。而Jsonp(JSON with Padding)技术...

Global site tag (gtag.js) - Google Analytics