同源策略:

JS只能与同一个域中的页面进行通讯,必须是协议、域名、端口都相同,相同域下才能相互通信,这可以被认为是一种通信原则,叫同源策略。

跨域:

js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同,都被当作是不同的域。

下表给出了相对http://store.company.com/dir/page.html同源检测的结果:

四种方法解决跨域:

1、jsonp;

jsonp跨域请求类似于ajax的get请求,比如请求地址url= 'localhsot:8080/search.php?callback=getremotedata',注意jsonp后面的callback参数,请求是必带

2、document.domain;

document.domain也可以解决跨域,不过只能是子域名间的跨域,这个要注意

3、window.name;

先介绍下window.name,window对象有个name属性,只要是当前页面载入过的所有页面都是共享window.name,每个页面都有对window.name的读写权限。其借助iframe中介进行数据通信

4、h5 postMessage

html5提供的方法,缺点是IE8+才支持,主要是通过父子间通过iframe进行相互通讯

建议使用window.name,它没有浏览器兼容性问题,而且使用不复杂,或者用jsonp实现跨域获取数据,具体的话可以百度搜索案例实际操作下。

js 几种跨域解决方法的更多相关文章

  1. [转]vue跨域解决方法

      vue跨域解决方法 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' hea ...

  2. JavaScript跨域解决方法大全

    跨域的定义:JavaScript出于安全性考虑,同源策略机制对跨域访问做了限制.域仅仅是通过“URL的首部”字符串进行识别,“URL的首部”指window.location.protocol +win ...

  3. JS中实现跨域的方法总结

    今天早上在地铁看了点基础知识的考察题,看到了一个JS跨域的问题,仔细想了想自己脑子里竟然只剩下jsonp跨域和用nginx反向代理进行跨域,想着还有别的几种方法,就是想不起来,这个人呢,一上岁数这个脑 ...

  4. AJAX四种跨域处理方法

    同源策略 同源策略 同源策略限制从一个源加载的文档或者脚本如何与来自另一个源的资源进行交互.这是一个用于隔离潜在恶意文件的关键的安全机制. 具体定义是:一段脚本向后台请求数据,只能读取属于同一协议名. ...

  5. jquery、javascript实现(get、post两种方式)跨域解决方法

    一.实现get方式跨域请求数据 浏览器端 <script> $(document).ready(function(){ $.ajax({ url: "http://www.xxx ...

  6. 「JavaScript」JS四种跨域方式详解

    原文地址https://segmentfault.com/a/1190000003642057 超详细并且带 Demo 的 JavaScript 跨域指南来了! 本文基于你了解 JavaScript ...

  7. ajax原理和跨域解决方法

    ajax是异步的 JavaScript 和 XML.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 1--启动 ...

  8. 转载的别人的ajax跨域解决方法

    http://dynamic.vip.xxxxxx.com/active/<controllers>/<active>/<id> 放在浏览器地址栏中访问可以得到正确 ...

  9. vue+axios跨域解决方法

    通过这种方法也可以解决跨域的问题. 使用http-proxy-middleware 代理解决(项目使用vue-cli脚手架搭建) 例如请求的url:“http://f.apiplus.cn/bj11x ...

随机推荐

  1. 案例:简易的Div拖拽

    案例:简易的Div拖拽 鼠标移入Div区域后,按下鼠标左键,可以拖动Div移动;松开鼠标左键,Div拖动停止.同时要求Div不能拖出屏幕显示区域外. 拖拽原理:距离不变.三个事件(onmousedow ...

  2. Luogu Daily & Original Blog (reproduced)

    震惊,新的功能:可以按Ctrl + F 进行关键字查询. \(update\) on 10.26:把这两个月的日报也加入进去了,并且修复了几个错误. 本文会把小编用过的博客和比较好的博客放在这里. 可 ...

  3. 通过一道CTF学习HTTP协议请求走私

    HTTP请求走私 HTTP请求走私 HTTP请求走私是针对于服务端处理一个或者多个接收http请求序列的方式,进行绕过安全机制,实施未授权访问一种攻击手段,获取敏感信息,并直接危害其他用户. 请求走私 ...

  4. jdk的切换

    1.下载安装新版本的jdk 2.使用该命令,添加新版jdk alternatives --install /usr/bin/java java /opt/jdk1.8.0_144/bin/java 2 ...

  5. [大雾雾雾雾] 告别该死的 EFCore Fluent API (续)

    朋友们好啊, 我是 .NET 打工人 玩双截棍的熊猫 刚才有个朋友问我 猫猫发生什么事了 我说 怎么回事? 给我发了一张截图 我一看!嗷!原来是zuo天有两个数据库, 一个四十多岁,一个三十多岁 它们 ...

  6. 【MathType教学】表示分类的大括号怎么打

    大括号是一种常见的数学符号,可以用于集合.分段函数中,其实大括号还可以用来总结数学知识,比如对三角形进行分类,此时用的大括号可以称为表示分类的大括号.MathType作为专业的数学公式编辑器,可以快速 ...

  7. ABBYY FineReader 15 文档转换功能

    我们平常工作的时候总会固定地只用某几个文档格式,有的人经常使用office,所以电脑内就没安装PDF阅读器,这个时候就需要文档转换器了,ABBYY FineReader 15 也能够帮助我们实现快速的 ...

  8. Mac磁盘清理工具——CleanMyMac

    许多刚从Windows系统转向Mac系统怀抱的用户,一开始难免不习惯,因为Mac系统没有像Windows一样的C盘.D盘,分盘分区明显.因此这也带来了一些问题,关于Mac的磁盘的清理问题,怎么进行清理 ...

  9. 如何使Camtasia的抠像效果更真实自然

    相信大家都知道录像编辑软件Camtasia的"移除颜色"可以抠像换背景,详细操作可以看小编的另一篇教程 <如何用Camtasia为微课换上一个好看的背景>.接下来,小编 ...

  10. 一:robot framework环境安装

    1.安装robot framework: 打开cmd进入dos下,输入 pip install robotframework Microsoft Windows [版本 10.0.18362.267] ...