什么情况下才会出现跨域?
假设域名是:http://www.example.com.cn/
如果所请求的域名跟这个域名不致,这种情况就是跨域,由于跨域存在漏洞,所以一般来说正常的跨域请求方式是请求不到的。
 
解决方式:
一、window.name
1、 服务器返回

 

<script>window.name='{“id”:”3″, “name”:”leisure”}';</script>

2、定义一个iframe,添加onload事件 <iframe id=”iframe1″ onload=”iLoad”><iframe>
<script type=”text/javascript”>
var load = false;
function iLoad() {
if(load == false) {
// 同域处理,请求后会再次重新加载iframe
document.getElementById(‘iframe1′).contentWindow.location = ‘/';
load = true;
} else {
// 获取window.name的内容,注意必须进行同域处理后方可访问!
var data = document.getElementById(‘iframe1′).contentWindow.name;
alert(data); // {“id”:”3″, “name”:”leisure”}
load = false;
}
}
</script>
3、定义一个form,设置form的target为iframe的id,然后提交form
<form action=”url” method=”POST” target=”iframe1″>
<button type=”submit” value=”submit” />
</form>
 
 
二、JSONP
服务器返回 callback({“id”: “3”, “name”: “leisure”});
<script type=”text/javascript”>
function callback(data) {
alert(data);
}
</script>
<script type=”text/javascript” src=”http://www.example.com.cn/product.jsp?id=5&jsonp=callback”></script>
 
三、jQuery.getJSON
服务器返回 json格式数据 test({“id”: “3”, “name”: “leisure”}); test函数名为callback参数中定义
$.getJSON(url + “?callback=?”, data, function(data) {
 
}
注意callback=?这个参数必须带上,jquery会自动生成一个函数名替换这个问号!jQuery.getJSON实际上是用了JSONP方式实现。
 
四、flash跨域
服务器添加crossdomain.xml
http://www.example.com.cn/crossdomain.xml
<?xml version=”1.0″?>
<cross-domain-policy>
<allow-access-from domain=”*.another.com.cn” />
</cross-domain-policy>
 
转载地址:http://www.wufangbo.com/js-kua-yu-ji-zhong/

Javascript跨域请求的几种解决方法的更多相关文章

  1. vue 使用axios 出现跨域请求的两种解决方法

    最近在使用vue axios发送请求,结果出现跨域问题,网上查了好多,发现有好几种结局方案. 1:服务器端设置跨域 header(“Access-Control-Allow-Origin:*”); h ...

  2. Springboot中关于跨域问题的一种解决方法

    前后端分离开发中,跨域问题是很常见的一种问题.本文主要是解决 springboot 项目跨域访问的一种方法,其他 javaweb 项目也可参考. 1.首先要了解什么是跨域 由于前后端分离开发中前端页面 ...

  3. [1.6W字]浏览器跨域请求的原理, 以及解决方法(可以纯前端实现) #flight.Archives011

    Title/ 浏览器跨域(CrossOrigin)请求的原理, 以及解决方案详细指南 #flight.Archives011 序: 最近看到又有一波新的创作活动了, 官方给出的话题中有一个" ...

  4. Ajax跨域问题的两种解决方法

    浏览器不允许Ajax跨站请求,所以存在Ajax跨域问题,目前主要有两种办法解决. 1.在请求页面上使用Access-Control-Allow-Origin标头. 使用如下标头可以接受全部网站请求: ...

  5. javascript 跨域请求详细分析(终极跨域解决办法)

    自从我接触前端以来,接手的项目里面很大部分都是前后端分离的,后端只提供接口,前端根据后端接口渲染出实际页面.个人觉得这是一个挺好的模式,前后端各自负责各自的模块,分工明确,而且也给前端更大的发挥空间. ...

  6. thinkphp,javascript跨域请求解决方案

    javascript跨域请求解决方案 前言 对于很多前端或者做混合开发的同学,我们难免会遇到跨域发起请求业务,比如A站点向B站点请求数据等等.由于最近要做一个站点集群的项目,所以具体业务要求很多个站点 ...

  7. AJAX跨域请求json数据的实现方法

    这篇文章介绍了AJAX跨域请求json数据的实现方法,有需要的朋友可以参考一下 我们都知道,AJAX的一大限制是不允许跨域请求. 不过通过使用JSONP来实现.JSONP是一种通过脚本标记注入的方式, ...

  8. ArcGIS API for Silverlight 调用WebService出现跨域访问报错的解决方法

    原文:ArcGIS API for Silverlight 调用WebService出现跨域访问报错的解决方法 群里好几个朋友都提到过这样的问题,说他们在Silverlight中调用了WebServi ...

  9. js跨域请求的5中解决方式

    跨域请求数据解决方案主要有如下解决方法: ? 1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 Html5的XDomainRequest Flash request 分开说明: 一.J ...

随机推荐

  1. [Swust OJ 566]--开N方数(牛顿切线法解高次方程)

    题目链接:http://acm.swust.edu.cn/problem/0566/ Time limit(ms): 1000 Memory limit(kb): 65535   Descriptio ...

  2. 设置TextView的密码效果以及跑马灯效果

    密码效果以及跑马灯效果: xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout ...

  3. 浏览器hack总结 详细的浏览器兼容性解决方法

    由于各浏览器对页面的解析不同,会导致页面在不同浏览器中显示的样式不一致,为了保持页面的统一,经常需要对浏览器进行兼容性问题的调试. CSS Hack 面对浏览器诸多的兼容性问题,经常需要通过CSS样式 ...

  4. Windows Phone 8初学者开发—第17部分:Coding4Fun工具包简介

    原文 Windows Phone 8初学者开发—第17部分:Coding4Fun工具包简介 第17部分:Coding4Fun工具包简介 原文地址:  http://channel9.msdn.com/ ...

  5. bootstrap base css 基本css

    Headings All HTML headings, <h1> through <h6> are available. h1. Heading 1 h2. Heading 2 ...

  6. 设计模式 ( 二十 ) 访问者模式Visitor(对象行为型)

    设计模式 ( 二十 ) 访问者模式Visitor(对象行为型) 1.概述 在软件开发过程中,对于系统中的某些对象,它们存储在同一个集合collection中,且具有不同的类型,而且对于该集合中的对象, ...

  7. python 3.4 装matplotlib numpy

    为了装个matplotlib包,搞了好久:   python3.4,官方没有对应版本的包,只能去下面这个地方下对应的版本: http://www.lfd.uci.edu/~gohlke/pythonl ...

  8. keepalive的 nopreempt 非抢占

    通常如果master服务死掉后backup会变成master,但是当master服务又好了的时候 master此时会抢占VIP,这样就会发生两次切换对业务繁忙的网站来说是不好的.所以我们要在配置文件加 ...

  9. 京香julia_百度百科

    京香julia_百度百科 京香julia

  10. Esper学习之五:EPL语法(一)

    上篇说到了Esper的Context,要是不了解的同学请参看<Esper学习之四:Context>,看过的同学如果还是不理解的话可以给我评论,我将会尽可能的解答.之前有些同学问我Conte ...