工作中遇到的js跨域问题总结
起因:之前在做一个项目的时候有这样一个问题,127.0.0.1域名上的一个页面A.html,需要访问127.0.0.2域名上B.html页面中的一个方法。这就涉及到JS跨域访问了,通过查阅资料,得以解决,现总结一下。
具体问题:在A.html页面有一个下载按钮,当点击下载的时候,要访问B.html页面的方法,然后下载资源,苦苦寻找,终得良方。
良方如下:
第一步 在A.html页面里面创建一个 iframe ,
//导出按钮
$("#导出").click(function () { exec_iframe() }); //跨域访问execB.html页面
function exec_iframe() {
if (typeof (exec_obj) == 'undefined') {
exec_obj = document.createElement('iframe');
exec_obj.name = 'tmp_frame';
exec_obj.src = "http://127.0.0.2:8001"+'/execB.html';
exec_obj.style.display = 'none';
document.body.appendChild(exec_obj);
} else {
exec_obj.src = "http://127.0.0.2:8001"+'/execB.html';
}
}
<iframe id="BpageId" name="myframe" src="http://127.0.0.2:8001/B.html" frameborder="0" scrolling="auto" style="width: 100%; height: 327px;"></iframe>
第二步 创建B.html, execB.html页面,这两个页面都属于127.0.0.2:8001域下的页面,两个页面的内容如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title> exec iframe function </title>
</head> <body>
<script type="text/javascript">
parent.window.myframe.downFile(); // execute parent myframe fIframe function
</script>
</body>
</html>
B.html
function downFile()
{ 下载
}
如此一来,便可解决,闲的没事,写写博客!!!
工作中遇到的js跨域问题总结的更多相关文章
- js中ajax如何解决跨域请求
js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...
- 前端Js跨域方法汇总—剪不断,理还乱,是跨域
1.通过jsonp跨域2.通过修改document.domain来跨子域(iframe)3.隐藏的iframe+window.name跨域4.iframe+跨文档消息传递(XDM)5.跨域资源共享 C ...
- js跨域请求数据的3种常用的方法
由于js同源策略的影响,当在某一域名下请求其他域名,或者同一域名,不同端口下的url时,就会变成不被允许的跨域请求.那这个时候通常怎么解决呢,对此菜鸟光头我稍作了整理:1.JavaScript 在 ...
- js跨域请求方式 ---- JSONP原理解析
这篇文章主要介绍了js跨域请求的5中解决方式的相关资料,需要的朋友可以参考下 跨域请求数据解决方案主要有如下解决方法: 1 2 3 4 5 JSONP方式 表单POST方式 服务器代理 H ...
- 5种处理js跨域问题方法汇总(转载)
1.JSONP跨域GET请求 ajax请求,dataType为jsonp.这种形式需要请求在服务端调整为返回callback([json-object])的形式.如果服务端返回的是普通json对象.那 ...
- JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- 【js跨域】js实现跨域访问的几种方式
这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...
- 【前端】【转】JS跨域问题总结
详情见原博客:详解js跨域问题 概念:只要协议.域名.端口有任何一个不同,都被当作是不同的域. 跨域资源共享(CORS) CORS(Cross-Origin Resource Sharing)跨域资源 ...
- js跨域访问,No 'Access-Control-Allow-Origin' header is present on the requested resource
js跨域访问提示错误:XMLHttpRequest cannot load http://...... No 'Access-Control-Allow-Origin' header is prese ...
随机推荐
- K8s下部署Istio
一.环境准备 1.1环境信息 主机名 IP地址 用途 zhengzw-k8s-master 10.10.100.7 K8s Master zhengzw-k8s-node-1 10.10.100.15 ...
- 自己动手开发手机APP控制西门子200smart 教程(原创干货)
自己动手开发手机APP控制西门子200smart 教程(原创干货) 自己动手开发手机APP控制西门子200smart 教程(原创干货) 2020-02-09 19:06:45 自己动手开发手机AP ...
- 快乐编程大本营【java语言训练班】第5课: java的数组编程
快乐编程大本营[java语言训练班]第5课: java的数组编程 第1节. 声明数组变量 第2节. 创建数组对象 第3节. 访问数组元素 第4节. 修改数组元素 第5节. 多维数组 学习地址如下:ht ...
- http请求中的 OPTIONS 多余请求消除,减少的案例
问题: 项目中遇到移动端发送同样的请求2次,仔细看了一下,有个是options报文. HTTP请求翻一倍,对服务器的性能有较大影响,造成nginx的无畏消耗,需要消除它. 解决思路: 1.上网查看了一 ...
- 70. Climbing Stairs QuestionEditorial Solution
You are climbing a stair case. It takes n steps to reach to the top. Each time you can either climb ...
- vb.net datagridview 使用方法
目录: 1. 取得或者修改当前单元格的内容 2. 设定单元格只读 3. 不显示最下面的新行 4. 判断新增行 5. 行的用户删除操作的自定义 6. 行.列的隐藏和删除 7. 禁止列或者行 ...
- tomcat的编码设置
Connector port="8080" protocol="HTTP/1.1" URIEncoding="UTF-8" ...
- layui表格增删改查与上传图片+Api
API 控制器1 主要用于增删改查已经反填数据查询 using System; using System.Collections.Generic; using System.Data.SqlClie ...
- Go语言实现:【剑指offer】数组中只出现一次的数字
该题目来源于牛客网<剑指offer>专题. 一个整型数组里除了两个数字之外,其他的数字都出现了两次.请写程序找出这两个只出现一次的数字. 正常能想到哈希表来处理,但此题考查的是异或的知识, ...
- 新的征程TestOps
TestOps 概念是什么时候提出来的没有去考察,知道TestOps测试运维是在DevOps这个概念下抽象的结果. DevOps,现在几乎每家公司都在谈DevOps,都已经实施,在实施,或者在准备实施 ...