201507152326_《Javascript实现跨域有4种方法——介绍jsonp和html5方法》
一. jsonp方法
1. 原理
在js中,我们直接用XMLHttpRequest请求不同域上的数据时,是不可以的。但是,在页面上引入不同域上的js脚本文件却是可以的。
2. 格式
<script>
function doSomething(jsondata) {
//todo
};
</script>
<script>http://example.com/data.php?callback=doSomething</script>
二. 使用HTML5中新引进的window.postMessage方法来跨域传送数据
1. 获取window对象。 例如:var winObj = element.contentWindow;
2. 格式
//a.html
<script>
function onload() {
var iframe = document.getElementById('iframe');
var winObj = iframe .contentWindow;
winObj .postMessage('哈哈,我是来自页面a的消息','*');
}
</script>
<iframe>id = "iframe" src = "http://www.test.com/b.html" οnlοad="onload()"</iframe>
//b.html
<script>
window.onmessage = function(e) {
e = e || event;
alert(e.data); // postMessage()方法存储在了data里了
}
</script>
转载于:https://www.cnblogs.com/beesky520/p/4649886.html
201507152326_《Javascript实现跨域有4种方法——介绍jsonp和html5方法》相关推荐
- 只有ajax会跨域吗_ajax处理跨域有几种方式
jQuery 使用 JSONP 缺点: 1.这种方式无法发送post请求(这里) 2.另外要确定jsonp的请求是否失败并不容易,大多数框架的实现都是结合超时时间来判定. 跨域的几种方式 在项目中可能 ...
- vb跨域访问ajax,解决AJAX的跨域访问-两种有效示例
这篇文章主要为大家详细介绍了解决AJAX的跨域访问-两种有效示例,具有一定的参考价值,可以用来参考一下. 感兴趣的小伙伴,下面一起跟随512笔记的小玲来看看吧!新的W3C策略实现了HTTP跨域访问,还 ...
- SpringBoot解决跨域的5种方式
本文来说下SpringBoot中实现跨域的5种方式. 文章目录 什么是跨域 java解决CORS跨域请求的方式 返回新的CorsFilter(全局跨域) 重写WebMvcConfigurer(全局跨域 ...
- 解决前端跨域的几种方法
解决前端跨域的几种方法 了解跨域出现的原因 解决跨域的几种方法 想要解决跨域 先要知道为什么会出现跨域 跨域:指的是浏览器不能执行其他网站的脚本 它是由浏览器的同源策略造成的 是浏览器对javascr ...
- 什么是同源策略及解决跨域的三种方式
同源策略 1.1.1 所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个 ip 地址,也非同源.同源策略/SOP(Same origin policy)是一种约 ...
- 前端交互之“解决前端跨域的三种方法”
1.什么是前端跨域? 跨域是浏览器为了安全而做出的限制策略:浏览器请求必须遵从同源测试: http://www.bilibili.com:8080:/anime/?key=calue路径 键值对 同协 ...
- vue开发环境和生产环境里面解决跨域的几种方法
vue开发环境和生产环境里面解决跨域的几种方法 参考文章: (1)vue开发环境和生产环境里面解决跨域的几种方法 (2)https://www.cnblogs.com/pass245939319/p/ ...
- jsonp跨域原理_【网站技术解读①】Javascript实现跨域请求
推荐一个读者做的不错的编程学习网站: 网站:潜安 域名:http://www.qianani.com 另外将会不定期推送近期网站用到的一些技术,讲一些核心原理,今天为第一篇 问题由来: 最近一直在优化 ...
- ajax 跨域 headers JavaScript ajax 跨域请求 +设置headers 实践
解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头.正确响应options请求,正确设置 JavaScript端需要设置的headers信息 方能实现. 此处手札 供后人参 ...
- Springboot 解决跨域的四种姿势
Springboot 解决跨域的四种姿势 姿势一 实现WebMvcConfigurer#addCorsMappings的方法 import org.springframework.context.an ...
最新文章
- 【 FPGA 】序列检测器的Mealy状态机实现
- html标签库jar包,struts2的s标签库jar包
- SQLite数据库Java驱动下载及连接示例(sqlite-jdbc-3.30.1.jar)
- java xml 反射_java使用dom4j解析xml配置文件实现抽象工厂反射示例
- git基础用法(一)
- DevExpress控件GridControl中的布局详解 【转】
- miui替换官方文件解决无服务器,miui 关掉云服务器
- cacti无密码登录
- 请求网页时,怎么给我返回了一段 JavaScript 代码
- 红帽RHEL8和RHEL7有什么区别?
- ios学习8_KVC和字典转模型
- mysql 存储过程写入文件
- 信号峰峰值Vpp与功率和dbm的换算
- ofdm导频信道估计matlab,OFDM导频信道估计
- jieba分词词性对照表
- 多项创新功能驱动,Galaxy S9必将引爆2018智能手机市场
- Ubuntu上软件安装
- 关于安卓版微信群发软件如何设置微信自动更新!
- 未来5年内, UWB技术或将成为室内定位的主流技术!
- CAM 导入.rou钻孔文件时提示No header % found或者显示与实际尺寸偏差大
热门文章
- fantastical2语言设置_如何为iPhone定制Fantastical2以适应您的需求
- 【cf:1100F】 Ivan and Burgers(多次区间最大异或值查询----线性基+离线+思维)
- java字符串截取删除_字符串截取的常用方法
- C/C++[算法入门]续
- 翻译: 4.3. 多层感知器的简明实现MLP pytorch
- 算法:全一子串的数量 或 全零子串的数量 1513. Number of Substrings With Only 1s
- 算法:插入排序、归并排序、快速排序、堆排序
- 算法:Reverse String(反转字符串)
- 怎么看神经网络过早收敛_遗传算法的收敛性分析
- mysql手动编译安装_手动编译安装Mysql