js跨域的几种方式：

最新推荐文章于 2024-09-02 23:36:16 发布

ztfmlt

最新推荐文章于 2024-09-02 23:36:16 发布

阅读量478

点赞数 1

分类专栏： js 文章标签： jsonp javascript

本文链接：https://blog.csdn.net/qq_30438579/article/details/64135049

版权

js 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

js跨域的几种方式：

（1）iframe标签+document.domain
此方法针对对于主域相同而子域不同的例子
页面a.html要访问b.html
a.html:
a.html
b.html:
这里写图片描述

（2）jsonp(JSONP只能实现GET请求)

所有的浏览器都遵守同源策略(JavaScript是一种在Web开发中经常使用的前端动态脚本技术。在JavaScript中，有一个很重要的安全性限制，被称为“Same-Origin Policy”（同源策略）。这一策略对于JavaScript代码能够访问的页面内容做了很重要的限制，即JavaScript只能访问与包含它的文档在同一域下的内容。)，这使得直接通过URL请求外部的资源会禁止，但是<\scipt>标签没有跨域限制。jsonp的跨域就是钻了这一漏洞，实现的跨域。
这里写图片描述
jQuery ajax的实现形式
jquery对jsonp进行了封装，没有写localHandler1函数这个回调函数，是因为jquery在处理jsonp类型的ajax时会自动生成回调函数并把数据取出来提供给success方法来调用。

（3）window.name跨域
假设app.html页面请求远程的服务器数据。我们在app.html页面新建一个iframe标签，服务器文件data.html里设置好window.name的值，然后在app.html读取window.name的值，先通过localhost：8080/web/data.html把数据读出来，再修改src的值。window.name 的值在不同的页面（甚至不同域名）加载后依旧存在（如果没修改则值不会变化），并且可以支持非常长的 name 值（2MB）。
这里写图片描述
参考（http://www.cnblogs.com/zichi/p/4620656.html）
（4）postMessage()方法
postMessage方法是html5的方法，postMessage(message,targetOrigin)接收两个参数，message是即将要发送到目标窗口的字符串或者说对象，targetOrigin是接收窗口的url。
(window<->window)
a2.html
这里写图片描述
(window<->iframe)
a.html

（5）cors跨域