`

JQuery Ajax 跨域访问的解决方案

 
阅读更多
我们知道ajax本身实际上是通过XMLHttpRequest对象来异步进行数据的交互,而浏览器出于安全考虑,不允许js代码进行跨域操作,所以js跨域操作会被拒绝。

具体情况有:
一、本域和子域的相互访问: http://www.aa.com/和book.aa.com
二、本域和其他域的相互访问: http://www.aa.com/和http://www.bb.com/ 用 iframe
三、本域和其他域的相互访问: http://www.aa.com/和http://www.bb.com/ 用 XMLHttpRequest访问代理
四、本域和其他域的相互访问: http://www.aa.com/和http://www.bb.com/ 用 JS创建动态脚本
今天主要讨论第4中解决方案,这个和上个的区别就是请求是使用<script>标签来请求的,这个要求也是两个域都是由你来开发才行。原理就是JS文件注入,在本域内的a内生成一个JS标签,它的SRC指向请求的另外一个域的某个页面b,b返回数据即可,可以直接返回JS的代码。因为script的src属性是可以跨域的。
这里我们需要用到JQuery.getScript(url, callback)方法,url是脚本文件的URL路劲,callback函数在脚本资源已被加载和求值后调用的回调函数。
首先在bb.com创建一个js文件,test.js

var ojb = {msg:'js跨域请求成功'};

然后在aa.com的页面上使用$.getScript加载test.js脚本
$(function() { 
$.getScript('http://www.bb.com/test.js', function() { 
if (ojb) { 
alert(obj.msg); 
} 
}); 
});


使用$.getScript函数的最大好处就是可以保证,脚本加载完毕后调用回调函数。
个人感觉这种方法比使用代理和iframe要简单一些。
分享到:
评论

相关推荐

    JQuery跨域访问解决方案

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

    Ajax跨域访问(ASP.NET Web)

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

    ajax跨域解决办法

    在实际应用中,开发者通常根据项目需求和服务器环境选择合适的跨域解决方案。例如,CORS是最推荐的方式,因为它提供了更灵活的安全控制,而JSONP则适用于那些无法修改服务器端代码的场景。服务器代理方法在某些情况...

    jQuery跨域问题解决方案

    在标题“jQuery跨域问题解决方案”中提到的JSONP(JSON with Padding)便是其中一种。JSONP允许跨域访问,其工作原理是允许用户传递一个回调函数名给服务器,然后服务器将返回一段JavaScript代码,其中包括了调用该...

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

    在JavaScript的世界里,由于同源策略的限制,浏览器禁止了不同源之间进行AJAX通信,但JSONP(JSON with Padding)作为一种巧妙的方式,允许...虽然有一些限制,但在许多场景下,JSONP仍然是一个实用的跨域解决方案。

    JQury实现Ajax跨域访问

    **jQuery实现Ajax跨域访问** 在Web开发中,由于浏览器的同源策略限制,JavaScript通常只能访问与当前页面同一域名下的资源。然而,有时我们需要从不同的域名获取数据,例如使用第三方API服务,这时就需要借助Ajax的...

    ajax跨域问题的解决办法

    解决ajax跨域问题有多种方法,以下是几种常见的解决方案: 1. 使用中间层过渡的方式 这种方法是通过在ajax请求和不同域的服务器之间加一层中间层来解决跨域问题。中间层可以是php、jsp、c++等任何具备网络通讯功能...

    Ajax跨域详解与代码

    **Ajax跨域详解** 在Web开发中,Ajax(Asynchronous JavaScript and XML)技术允许我们实现页面的...通过分析这些文件,开发者可以更好地理解和实践Ajax跨域的解决方案,确保在实际项目中能够顺利地进行跨域数据交互。

    JSONP实现Ajax跨域访问

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

    ajax跨域访问

    ### AJAX跨域访问详解 #### 一、引言 在Web开发中,由于浏览器的安全策略限制,同源策略(Same-origin policy)成为了跨域请求的一大障碍。为了克服这一限制,AJAX通过多种技术实现了跨域数据获取。其中,JSONP...

    JS跨域访问解决方案总结

    ### JS跨域访问解决方案总结 #### 一、跨域访问概念与同源策略 跨域访问,即一个网站上的资源尝试获取另一个不同域名网站上的资源。这种行为在现代Web开发中非常常见,例如通过`&lt;style&gt;`标签加载外部样式表、`...

    jQuery.ajax 跨域请求webapi设置headers的解决方案

    解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头、正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现。 1.第一步 服务端设置响应头,在webapi的web.config做如下...

    前端基础-Ajax跨域问题的解决方案.docx

    CORS(Cross-Origin Resource Sharing)是一种更现代的跨域访问策略,它允许服务器明确声明哪些来源的请求可以被允许。服务器通过设置 HTTP 响应头 `Access-Control-Allow-Origin` 来指定哪些源可以访问其资源。例如...

    ajax跨域请求

    JSONP是一种早期的跨域解决方案,尤其适用于GET请求。它依赖于`&lt;script&gt;`标签不受同源策略限制的特点。服务器端返回一个JavaScript函数调用,参数是需要的数据。客户端通过创建`&lt;script&gt;`标签并指定其`src`属性为...

    jquery ajax跨域解决方法(json方式)

    本文将针对jquery ajax跨域解决方法进行详细介绍,特别是以JSON方式处理跨域请求。 ### 跨域问题基础 在理解jquery如何处理跨域问题之前,需要明白什么是跨域问题。跨域问题是指当一个Web页面尝试访问另一个域的...

    ajax跨域请求js拒绝访问的解决方法

    求解决办法 代码如下: ajax{ url :“http://xxxx/app”...求方法 您可能感兴趣的文章:跨域请求之jQuery的ajax jsonp的使用解惑AJAX跨域请求json数据的实现方法jQuery.ajax 跨域请求webapi设置headers的解决方案JQuer

Global site tag (gtag.js) - Google Analytics