5种处理js跨域问题方法汇总
1.JSONP跨域GET请求
ajax请求,dataType为jsonp。这种形式需要请求在服务端调整为返回callback([json-object])的形式。如果服务端返回的是普通json对象。那么调试的时候,在chrome浏览器的控制台会报"Uncaught SyntaxError: Unexpected token"错误;在firefox浏览器的控制台会报"SyntaxError: missing ; before statement"错误。
JSON是一种轻量级的数据交换格式,像xml一样,是用来描述数据间的。
JSONP是一种使用JSON数据的方式,返回的不是JSON对象,是包含JSON对象的javaScript脚本。
由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源。若要跨域请求出于安全性考虑是不行的,但是我们发现,Web页面上调用js文件时则不受是否跨域的影响,而且拥有”src”这个属性的标签都拥有跨域的能力,比如<script>、<img>、<iframe>,这时候,聪明的程序猿就想到了变通的方法,如果要进行跨域请求, 通过使用html的script标记来进行跨域请求,并在响应中返回要执行的script代码,其中可以直接使用JSON传递 javascript对象。即在跨域的服务端生成JSON数据,然后包装成script脚本回传,着不就突破同源策略的限制,解决了跨域访问的问题了么。
2.iframe跨域。
页面中增加一个iframe元素,在需要调用get请求的时候,将iframe的src设置为get请求的url即可发起get请求的调用。
var url = "http://xxx.xxx.xxx?p1=1&p2=2";
$("#iframe").attr("src", url);//跨域,使用iframe
iframe方式强于jsonp,除了可以处理http请求,还能够跨域实现js调用。
3.script元素的src属性处理
iframe、img、style、script等元素的src属性可以直接向不同域请求资源,jsonp正是利用script标签跨域请求资源的简单实现,所以这个和jsonp本质一样,同样需要服务端请求返回callback...形式。
var url="http://xxx.xxx.xxx?p1=1";
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);
4.在服务器使用get处理。
对于业务上没有硬性要求在前端处理的,可以在服务端做一次封装,再服务端发起调用,这样就可以解决跨域的问题。然后再根据请求是发出就完,还是需要获取返回值,来决定代码使用同步或者异步模式。
private static void CreateGetHttpResponse(string url, int? timeout, string userAgent, CookieCollection cookies)
{
if (string.IsNullOrEmpty(url))
{
throw new ArgumentNullException("url");
}
var request = WebRequest.Create(url) as HttpWebRequest;
request.Method = "GET";
if (!string.IsNullOrEmpty(userAgent))
{
request.UserAgent = userAgent;
}
if (timeout.HasValue)
{
request.Timeout = timeout.Value;
}
if (cookies != null)
{
request.CookieContainer = new CookieContainer();
request.CookieContainer.Add(cookies);
}
request.BeginGetResponse(null,null);//异步
//return request.GetResponse() as HttpWebResponse;
}
5.flash跨域
过于尖端了==,再研究
总结:以上5种方法就是常见的解决js跨域问题的处理方法了,最后一种比较高端,等我研究清楚了再补上吧。
<script>
<img>
<iframe src>
5种处理js跨域问题方法汇总的更多相关文章
- 5种处理js跨域问题方法汇总(转载)
1.JSONP跨域GET请求 ajax请求,dataType为jsonp.这种形式需要请求在服务端调整为返回callback([json-object])的形式.如果服务端返回的是普通json对象.那 ...
- js跨域原理及解决方案
方法一:jsonp函数 在HTML DOM中,Script标签是可以跨域访问服务器上的数据的.因此,可以指定script的src属性为跨域的url,基于script标签实现跨域.script标签本身就 ...
- js中几种实用的跨域方法原理详解(转)
今天研究js跨域问题的时候发现一篇好博,非常详细地讲解了js几种跨域方法的原理,特分享一下. 原博地址:http://www.cnblogs.com/2050/p/3191744.html 下面正文开 ...
- js中几种实用的跨域方法原理详解
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- 三种方法实现js跨域访问
转自:http://narutolby.iteye.com/blog/1464436 javascript跨域访问是web开发者经常遇到的问题,什么是跨域,一个域上加载的脚本获取或操作另一个域上的文档 ...
- [转]js中几种实用的跨域方法原理详解
转自:js中几种实用的跨域方法原理详解 - 无双 - 博客园 // // 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同 ...
- 跨域的小小总结:js跨域及跨域的几种解决方法
一.什么是跨域?? js跨域请求就是使用js访问iframe里的不同域名下的页面内容,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同的域的iframe框架中的数据.即只要域名.协议. ...
- js中几种实用的跨域方法原理详解【转】
源地址:http://www.cnblogs.com/2050/p/3191744.html 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通 ...
- js跨域请求数据的3种常用的方法
由于js同源策略的影响,当在某一域名下请求其他域名,或者同一域名,不同端口下的url时,就会变成不被允许的跨域请求.那这个时候通常怎么解决呢,对此菜鸟光头我稍作了整理:1.JavaScript 在 ...
随机推荐
- Linux系统锁定关键文件
锁定系统关键文件 1.密码.账号文件 chattr +i /etc/passwd /etc/group /etc/shadow /etc/gshadow /etc/inittab 加锁:chattr ...
- Linxu系统修改文件描述符
修改系统文件描述符 文件描述符:无符号整数(0-65535),进程使用它来标示打开的文件 /etc/security/limits.conf:可以修改CPU,堆栈, 1.查看最大的标示符 u ...
- wordpress利用rsync同步备份
我搭建的wordpress服务器现在使用的系统是opensuse, 服务器上面已做脚本和计划任务将wordpress使用的数据库与web目录每天压缩备份放到 /data/backup目录下 opera ...
- libcurl-7.54.1附加zlib1.2.11的编译
手上有个小程序需要通过HTTP协议通信,选择了出名的libcurl作为支持库.由于网上的教程多是命令行编译,本人记性不好,比较讨厌记住一堆命令,因此折腾了一天通过VS对libcurl和zlib进行了编 ...
- xdebug安装及使用小结
最近安装了一下xedug,并且学习了一下如何使用.安装xdebug的初衷是为了深入研究一下PHP的垃圾回收机制. Xdebug是一个开放源代码的PHP程序调试器(即一个Debug工具),可以用来跟踪, ...
- JavaScript的DOM操作获取元素的大小
通过 style 内联获取元素的大小 需要注意的是style 获取只能获取到行内 style 属性的 CSS 样式中的宽和高,如果有获取:如果没有则返回空. <!DOCTYPE html> ...
- SGU---103 最短路变形
题目链接: https://cn.vjudge.net/problem/SGU-103#author=ECUST_FZL 题目大意: Dingiville 城市的交通规则非常奇怪,城市公路通过路口相连 ...
- Jupyter Notebook的使用
命令模式 (按键 Esc 开启) Enter : 转入编辑模式 Shift-Enter : 运行本单元,选中下个单元 Ctrl-Enter : 运行本单元 Alt-Enter : 运行本单元,在其下插 ...
- PHP常用功能块_错误和异常处理 — php(32)
一.错误和异常处理 1.1 错误类型和基本的调试方法PHP程序的错误发生一般归属于下列三个领域: 语法错误:语法错误最常见,并且也容易修复.如:代码中遗漏一个分号.这类错误会阻止脚本的执行. 运行时错 ...
- 关于SX1278、SX1276、SX1262的简单详解资料
通常的物联网解决方案和设备一直都非常昂贵,或在实施中不切合实际.理想的无线连接技术应该是低成本.高可靠性的,可进行长距离传输,且拥有超长的电池续航时间.像zigbee.Bluetooth和Wi-Fi这 ...