`

jquery利用jsonp轻松解决跨域ajax问题

    博客分类:
  • java
 
阅读更多

 

function get() {

$.ajax({

    type: "GET",

    url: 'http://192.168.10.4:8080/jsgd/bill.jsp?userCode=?&date='+ new Date(), 

    dataType:"jsonp",

            jsonp:"jsonpcallback",

  success: function(msg){

$('#callcenter').html(msg.text);

    }

});

}

 

如果从 192.168.10.1发ajax请求到192.168.10.4会产生跨域问题.利用jquery的jsonp参数可轻松这个问题.

 

jquery 里的jsonp原理是这样的.

其实dataType: jsonp和json都并没有执行传统的类似

var request = new XMLHttpRequest

...onchangeready = ....

 

而是新建一个script的dom对象,利用他的src属性下载了从服务器返回的一个字符串,

这个字符串内容就是 "调用一个js函数".这个函数名是 jquery 发送request时,将自动生成的一个 jsonp+数字 的这样一个字符串放在后面如:  http://......&jsonpcallback=jsonp2345678 这样服务器返回  jsonp2345678(data);

自然而然客户端变成了

<script src=",,,">jsonp2345678(data)</script>表示要调用.

 

分享到:
评论

相关推荐

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

    本篇文章将详细讲解如何利用jQuery的jsonp方法实现Ajax跨域请求,以及如何在服务器端使用.Net的*.handler和WebService来返回JSON数据。 首先,理解JSONP的基本原理。JSONP是一种非官方的协议,通过动态创建`...

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

    JSONP是一种解决跨域问题的技术,其核心思想是利用`&lt;script&gt;`标签不受同源策略限制的特性。当浏览器解析到`&lt;script&gt;`标签时,会发出一个GET请求,而无论该URL是否与当前页面的源相同。服务器返回的不是普通的JSON...

    Jquery跨域Ajax请求测试

    本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先,了解同源策略是理解跨域问题的关键。同源策略是浏览器为了保障用户安全而设定的一项机制,它规定了只有来自同一协议、同一域名和同一...

    用jQuery与JSONP轻松解决跨域访问的问题

    jQuery和JSONP(JSON with Padding)提供了一种优雅的解决方案。 jQuery的$.ajax()方法是实现跨域请求的核心工具。在上述示例中,我们看到$.ajax()被用来发送一个GET请求到跨域的DNS。设置`dataType: 'jsonp'`表明...

    ajax 跨域请求问题 jquery jsonp

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

    jquery.jsonp插件

    ajax跨域请求,jquery.jsonp插件

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

    JSONP(JSON with Padding)是一种常见的解决JavaScript跨域问题的技术,尤其在jQuery中得到了广泛的应用。由于浏览器的同源策略限制,JavaScript通常无法在不同源之间进行Ajax请求。但JSONP巧妙地利用了HTML中`...

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

    JSONP(JSON with Padding)是一种解决跨域请求的方法,即在客户端通过 script 标签请求服务器端的数据,然后服务器端将数据以 JSON 格式返回,并在返回数据中包含一个回调函数,以便客户端可以将数据处理。...

    跨域访问解决方法-jsonp

    为了解决这个问题,开发者通常采用JSONP(JSON with Padding)技术。本文将详细探讨JSONP的工作原理以及如何在实际项目中使用它来跨域获取JSON数据。 ### JSONP简介 JSONP全称为"JSON Padding",它并不是JSON的一...

    JSONP解决跨域问题

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

    JSONP实现Ajax跨域访问

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

    jsonpajax跨域请求

    "jsonp跨域请求"可能是服务器返回的示例数据,模拟了JSONP的跨域请求过程。 总结,JSONP和CORS是解决JavaScript跨域问题的两种主要方法,它们各有优缺点,适用于不同的场景。JSONP简单易用,但安全性较低;CORS则更...

    JQuery跨域访问解决方案

    JQuery的跨域解决方案主要依赖于JSONP(JSON with Padding)技术。JSONP是一种绕过同源策略的方式,它利用HTML中的`&lt;script&gt;`标签没有同源策略限制的特点。当jQuery使用`dataType: 'jsonp'`时,它实际上是在做以下几...

    Ajax跨域请求解决方案-JSONP

    本文将详细介绍JSONP的工作原理以及如何在ASP.NET网站开发中应用JSONP解决Ajax跨域问题。 首先,理解JSONP的基本概念。JSONP是一种非官方的数据交换格式,它的核心思想是利用HTML中的`&lt;script&gt;`标签不受同源策略...

    jquery-jsonp-master.zip_jsonp

    `jquery-jsonp-master.zip`是一个包含jQuery JSONP实现的压缩包,适用于学习和应用轻量级的JSONP解决方案。 首先,我们需要了解JSONP的基本原理。由于同源策略的限制,JavaScript通常不能直接向其他域名发送Ajax...

    jquery-jsonp.js

    1、一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面、动态网页、web服务、WCF,只要是跨域请求,一律不准;  2、不过我们又发现,Web页面上调用js文件时则不受是否跨域的影响...

    jQuery使用JSONP实现跨域获取数据的三种方法详解

    使用jQuery提供的接口,开发者可以很容易地实现JSONP跨域请求,具体方法包括$.ajax()、$.getJSON()和$.getScript()等。在实际使用过程中,需要注意回调函数名的正确传递和处理,以及确保服务器端正确响应JSONP请求。...

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

    在探讨如何解决跨域请求的问题之前,我们首先需要了解跨域问题的由来。同源策略(Same-Origin Policy)是浏览器安全模型的一部分,它禁止了不同域之间的文档或脚本进行交互。然而,在实际开发中,经常需要从前端页面...

Global site tag (gtag.js) - Google Analytics