`

ajax跨域访问 JQuery 的跨域方法

阅读更多

数据迁移,点击查看详细:

 ajax跨域访问 JQuery 的跨域方法

11
5
分享到:
评论
9 楼 sumaolin 2011-08-24  
简单易懂,明白了jsonp的原理
8 楼 tony534 2010-06-01  
如果访问的就只是xml文件.也自己不能修改别人的代码怎么办呢?
7 楼 hongyang070 2010-05-21  
如果访问的就只是html文件.自己不能修改别人的代码怎么办?
6 楼 fantasybei 2010-05-21  
jsonp
5 楼 misswuyang 2010-05-21  
script
melin 写道
兄弟你在合肥那个公司... 在这遇到合肥的还很难的。我最近遇到跨域调用的问题,这面是我的解决方案。
最近在做门户时,遇到要跨域Ajax调用,对此做些总结,以前做施工调用的时候由于无法解决这个问题,还是用剪贴板绕过这个问题。
Ajax是现在web开发会经常应用的技术,为我们的系统提供了更好应用体验,而一般我们只是在系统内部相互调用,如果跨域的调用可能就要受到同源策略的限制,无法完成请求:
同源策略是指阻止代码获得或者更改从另一个域名下获得的文件或者信息。也就是说我们的请求地址必须和当前网站的地指相同。同源策略通过隔离来实现对资源的保护。这个策略的历史非常悠久Netscape Navigator 2.0时代就开始了。
但有一个很巧妙的办法就是在页面中使用动态代码元素,代码的源指向服务地址并在自己的代码中加载数据。当这些代码加载执行的时候,同源策略就不会起到限制,下面是一个简单的实例,看懂以后就知道其原理:
index.html中

function showPrice(data){
alert("Symbol:" + data.symbol + ", Price:" + data.price);
}
//214是公司环境,可以替换测试
//var url = "http://192.168.20.214:8080/examples/ticker.js"; 
var url = "ticker.js"; //Outer JS URL
var script = document.createElement('script');
script.setAttribute('src', url);

//load javascript
document.getElementsByTagName('head')[0].appendChild(script);

ticker.js中
var data = {symbol:'IBM', price:100};
showPrice(data);

jquery 1.2开始就用JSONP提供支持,简化了我们的开发:
剩下的我就不写了,更为详细请参考这篇文章:http://www.cnblogs.com/cfanseal/archive/2009/05/19/1460382.html



现在基本上都是利用scripts动态加载到页面来实现跨域访问的。
4 楼 giginet 2010-05-21  
jsonp
3 楼 melin 2010-05-21  
兄弟你在合肥那个公司... 在这遇到合肥的还很难的。我最近遇到跨域调用的问题,这面是我的解决方案。
最近在做门户时,遇到要跨域Ajax调用,对此做些总结,以前做施工调用的时候由于无法解决这个问题,还是用剪贴板绕过这个问题。
Ajax是现在web开发会经常应用的技术,为我们的系统提供了更好应用体验,而一般我们只是在系统内部相互调用,如果跨域的调用可能就要受到同源策略的限制,无法完成请求:
同源策略是指阻止代码获得或者更改从另一个域名下获得的文件或者信息。也就是说我们的请求地址必须和当前网站的地指相同。同源策略通过隔离来实现对资源的保护。这个策略的历史非常悠久Netscape Navigator 2.0时代就开始了。
但有一个很巧妙的办法就是在页面中使用动态代码元素,代码的源指向服务地址并在自己的代码中加载数据。当这些代码加载执行的时候,同源策略就不会起到限制,下面是一个简单的实例,看懂以后就知道其原理:
index.html中

function showPrice(data){
alert("Symbol:" + data.symbol + ", Price:" + data.price);
}
//214是公司环境,可以替换测试
//var url = "http://192.168.20.214:8080/examples/ticker.js"; 
var url = "ticker.js"; //Outer JS URL
var script = document.createElement('script');
script.setAttribute('src', url);

//load javascript
document.getElementsByTagName('head')[0].appendChild(script);

ticker.js中
var data = {symbol:'IBM', price:100};
showPrice(data);

jquery 1.2开始就用JSONP提供支持,简化了我们的开发:
剩下的我就不写了,更为详细请参考这篇文章:http://www.cnblogs.com/cfanseal/archive/2009/05/19/1460382.html
2 楼 satanest 2010-05-21  
getJSON也是用iframe实现的
1 楼 化蝶自在飞 2010-05-20  
确实够简洁,顶顶.

相关推荐

    Jquery跨域Ajax请求测试

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

    Ajax跨域访问(ASP.NET Web)

    本教程将重点讲解如何在ASP.NET Web环境中处理Ajax跨域访问。 一、理解同源策略 同源策略是浏览器为了保护用户安全而实施的一项安全机制,它禁止了一个源(domain)的文档或脚本获取或操作另一个源的资源。这意味着...

    ajax跨域解决办法

    AJAX跨域问题的出现是由于浏览器的安全机制,旨在防止恶意网站通过脚本访问其他网站的数据,保护用户隐私。但是,在某些场景下,比如前后端分离的应用、API接口调用等,跨域请求是必要的。针对这一需求,有多种解决...

    JQury实现Ajax跨域访问

    **jQuery实现Ajax跨域访问** 在Web开发中,由于同源策略的限制,JavaScript通常只能对同一域名下的资源进行操作。然而,有时我们需要从不同源获取数据,这就是跨域访问的需求。jQuery通过Ajax提供了跨域请求的能力...

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

    在JavaScript的世界里,由于同源策略的限制,浏览器禁止了不同源之间进行AJAX通信,但JSONP(JSON with Padding)作为一种巧妙的方式,允许我们绕过这个限制,实现在jQuery中进行跨域请求。本篇文章将深入探讨JSONP...

    demo跨域ajax_DEMO_ajax跨域_

    以上就是C#和Ajax跨域通信的基本原理和实现方法。在实际应用中,还需考虑安全性,谨慎设置允许跨域的源,以及是否允许携带Cookie等认证信息。通过理解并正确实施这些策略,你可以确保C#服务器与任何合法源的前端应用...

    jquery ajax跨域html前台 php后台

    1. **jQuery的Ajax设置**:在使用Ajax进行跨域请求时,我们需要在`$.ajax()`方法中设置`dataType: 'jsonp'`。这告诉jQuery我们期望服务器返回JSON格式的数据,并通过JSONP机制来处理。 2. **JSONP原理**:JSONP的...

    Ajax跨域详解与代码

    **二、解决Ajax跨域的常见方法** 1. **CORS(Cross-Origin Resource Sharing)跨域资源共享**:服务器端设置响应头`Access-Control-Allow-Origin`,指定允许跨域访问的源。例如,设置为`*`表示允许所有来源,或者...

    JSONP实现Ajax跨域访问

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

    ajax跨域调用wcf实例

    确保只允许可信的源进行跨域访问,并对敏感操作进行身份验证和授权。 通过以上步骤,你可以成功地使用AJAX跨域调用WCF服务。在实际项目中,需要根据具体需求调整配置,并结合安全措施,以确保服务的稳定性和安全性...

    juery mobile使用ajax跨域请求服务器的小实例

    在jQuery中,我们可以使用`$.ajax()`方法来发起Ajax请求。对于跨域请求,我们需要设置`xhrFields`中的`withCredentials`为`true`,并且在服务器端开启CORS(Cross-Origin Resource Sharing)支持。 以下是一个简单...

    JQuery跨域访问解决方案

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

    IE8、IE9 Ajax 跨域解决办法

    解决ie8、9Ajax跨域问题(前端):jsp引入此js,Jquery Ajax正常写

    ajax跨域请求WebService.asmx

    【Ajax跨域请求WebService.asmx】是一个常见的Web开发技术应用场景,主要涉及到JavaScript的Ajax技术、C#编程语言以及ASP.NET的WebService组件。Ajax(Asynchronous JavaScript and XML)是一种在不刷新整个页面的...

    ajax跨域访问

    #### 三、解决AJAX跨域访问的方法 针对AJAX跨域访问的问题,通常有以下几种解决方案: 1. **JSONP(JSON with Padding)** 2. **CORS(Cross-Origin Resource Sharing)** 3. **代理服务器** #### 四、JSONP实现...

    ajax跨域请求

    jQuery的Ajax跨域 jQuery库提供了方便的API来处理Ajax请求,包括跨域。使用`$.ajax()`或`$.getJSON()`,设置`jsonp`参数为回调函数名,可以实现JSONP请求。对于CORS,可以通过设置`crossDomain`选项为`true`来开启...

    ajax跨域post(java例子)

    使用jQuery库进行Ajax跨域POST请求,可以这样写: ```javascript $.ajax({ type: 'POST', url: 'http://example.com/api/data', // 目标URL data: {key: 'value'}, // 发送的数据 crossDomain: true, // 开启...

    ajax跨域问题的解决办法

    ajax跨域问题是指在使用ajax技术时遇到的跨域限制问题,即ajax请求不能跨域访问其他域的服务器资源。这种限制是由于浏览器的同源策略所引起的,同源策略规定一个域下的脚本只能访问该域下的资源,而不能访问其他域下...

Global site tag (gtag.js) - Google Analytics