JS中实现跨域的方法总结
今天早上在地铁看了点基础知识的考察题,看到了一个JS跨域的问题,仔细想了想自己脑子里竟然只剩下jsonp跨域和用nginx反向代理进行跨域,想着还有别的几种方法,就是想不起来,这个人呢,一上岁数这个脑子就不好使,为了防止下次又遗忘了,所以特意写一篇随笔来记录一下JS中实现跨域的方式
1.jsonp请求
2.document.domain
3.window.name
4.window.postMessage
5.CORS
6.Web Sockets
7.使用服务器进行反向代理
jsonp请求
jsonp的原理时利用script标签的跨域特性,可以不受限制的从其他域中加载资源,类似的标签还有<img>,具体的使用方法在我前面的博文中已经写过,
注意:jsonp只支持GET请求而不支持其他类型的请求
doucment.domain
这种方式主要用在主域名相同,子域名不同的情况下
window.name
window的name属性有个特征:在一个窗口(window)的生命周期内,窗口所载入的所有页面都是共享一个window.name,每个页面对window.name都有读写权限,window.name是持久存在一个窗口载入过的所有页面中的,并不会因新页面的载入而进行重置
window.postMessage
window.postMessage是html5中实现跨域访问的一种新方式,可以使用它来向其他的window对象发送消息,无论这个window对象是属于同源还是不同源
CORS
CORS背后的基本思想,就是使用自定义的HTTP头部让浏览器和服务器进行沟通,从而决定请求或响应是应该成功还是应该失败,
这个需要服务器设置header :Access-Control-Allow-Origin即可
webSocket
webSocket的原理:在JSchuangjianlewebSocket之后,会有一个HTTP请求发送到浏览器以发起链接,取得服务器响应后,建立的连接会使用HTTP升级从HTTP协议交换为websocket协议
使用服务器进行反向代理
我个人常用的nginx进行反向代理,之前也试过用nodeJS自己搭建一个服务器进行反向代理,具体的步骤暂时不详述,各位可以搜一下,一搜一大堆
好了,暂时的话就这些,但是我在工作中常用的还是最后一种用nginx服务器进行反向代理
JS中实现跨域的方法总结的更多相关文章
- js中各种跨域问题实战小结(二)
这里接上篇:js中各种跨域问题实战小结(一) 后面继续学习的过程中,对上面第一篇有稍作休整.下面继续第二部分: -->5.利用iframe和location.hash -->6.windo ...
- js中各种跨域问题实战小结(一)
什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源策略 ...
- 001_Three.js中的跨域问题
001_Three.js中的跨域问题 [情景描述]: 在初始化模型,引入字体和纹理皮肤图片的时候,由于跨域问题,出现了以下提示: Access to image at 'file:///F:/User ...
- js中的跨域
因为javascript的同源策略,导致它普通情况下不能跨域,直到现在,我还是不能完全理解js跨域的几种方法,没办法,只能慢慢学习,慢慢积累,这不,几天又在园里看到一篇博文,有所收获,贴上来看看; 原 ...
- js中的跨域方法总结
什么是跨域? 浏览器的安全策略,只要协议,域名,端口有任何一个不同,就被当做不同的域. 下面对http://www.qichedaquan.com的同源检测 http://www.qichedaqua ...
- JS中的跨域问题
一.什么是跨域? 1.定义:跨域是指从一个域名的网页去请求另一个域名的资源.比如从www.baidu.com 页面去请求 www.google.com 的资源.但是一般情况下不能这么做,它是由浏览器的 ...
- js中各种跨域问题实战小结
什么是跨域?为什么要实现跨域呢? 这是因为JavaScript出于安全方面的考虑,不允许跨域调用其他页面的对象.也就是说只能访问同一个域中的资源.我觉得这就有必要了解下javascript中的同源 ...
- js 几种跨域解决方法
同源策略: JS只能与同一个域中的页面进行通讯,必须是协议.域名.端口都相同,相同域下才能相互通信,这可以被认为是一种通信原则,叫同源策略. 跨域: js跨域是指通过js在不同的域之间进行数据传输或通 ...
- 基于nodejs中实现跨域的方法
一般情况下跨域是通过ajax的方式请求数据,通过js在不同的域之间进行数据传输或者通信: 只有通过ajax方式获取请求的时候才会有跨域问题需要解决: 例如在本地模拟两个服务端. 一个服务端去通过aja ...
随机推荐
- KeepAlived+Nginx 安装
yum install -y gcc gcc-c++ openssl openssl-devel 目前keepalived最新版本下载:[root@rhel ~]#wget -c http://www ...
- 9.3 翻译系列:数据注解特性之Key【EF 6 Code-First 系列】
原文链接:http://www.entityframeworktutorial.net/code-first/key-dataannotations-attribute-in-code-first.a ...
- Android开发 - 解决DialogFragment在全屏时View被状态栏遮住的问题
我的上一篇文章:设置DialogFragment全屏显示 可以设置对话框的内容全屏显示,但是存在在某些机型上顶部的View被状态栏遮住的问题.经过测试,发现了一种解决办法,在DialogFragmen ...
- Servlet案例5:用户登录失败信息回显
登录失败信息回显不会的新的一个页面,而是显示在登录页面 一种方法是: 登录页面表单中每个字段后添加<span>标签写入失败信息,利用ajax技术 通过改变<span>标签的di ...
- Swift5 语言指南(九) 闭包
闭包是自包含的功能块,可以在代码中传递和使用.Swift中的闭包类似于C和Objective-C中的块以及其他编程语言中的lambdas. 闭包可以从定义它们的上下文中捕获和存储对任何常量和变量的引用 ...
- Spring boot 配置文件参数映射到配置类属性
[参考文章]:SpringBoot之@EnableConfigurationProperties分析 [参考文章]:在Spring Boot中使用 @ConfigurationProperties 注 ...
- 5月份值得一看的 Java 技术干货!
5月又即将要离我们远去了,这个月有小长假51劳动节,有54青年节,有513母亲节,更有坑爹的520神马节?!! 废话不说,又到了总结上个月干货的时候了,这个月我们带来了各种Java技术干货,都是不得不 ...
- vue-cli3.0 升级记录
年三十时 vue2.6 发布,向 3.0 看齐,说明 3.0 不远了.作为开发者也应该为vue3.0 做点准备.首先是把 vue-cli 升级到 3.x ,在这记录下 vue-cli2.x 升级 vu ...
- [,,].length等于几
分别测试了谷歌.欧朋,火狐,QQ.搜狗,Edge,ie5.7.8.9.10.11 其中ie5,ie7,ie8得到的结果为3 其他均为2:如果最后一个逗号后面为空,则不识别最后一位
- spring cloud(服务消费者(利用feign实现服务消费及负载均衡)——初学三)
Feign是一个声明式的Web Service客户端,我们只需要使用Feign来创建一个接口并用注解来配置它既可完成. 它具备可插拔的注解支持,包括Feign注解和JAX-RS注解.Feign也支持可 ...