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 ...
随机推荐
- 下载 rpm 源码包并重新编译
$ yumdownloader --source gdb $ rpmbuild --rebuild gdb-7.8.1-30.fc21.src.rpm $ cd ~/rpmbuild/SPECS/ $ ...
- JQuery Mobile - 动态修改select选择框的选中项
<label for="day">选择天</label> <select name="day" id="day" ...
- 第十节:详细讲解一下Java多线程,随机文件
前言 大家好,给大家带来第十节:详细讲解一下Java多线程,随机文件的概述,希望你们喜欢 多线程的概念 线程的生命周期 多线程程序的设计 多线程的概念 多线程的概念:程序是静态的,进程是动态的.多进程 ...
- 使用js做LeetCode
概述 无意中得知了LeetCode这个刷题网站, 深得我意. 其实作为一个程序员, 我是很看重写基础代码的, 因为这个写熟了, 以后学各种语言就不会太困难. 所以我觉得有必要把这件事记下来, 供以后开 ...
- JS应用实例1:注册页面表单校验
这里是简单的前端校验,后边还会介绍后台的校验. 多重校验保证获取安全数据 步骤: 1.确定事件onsubmit,并绑定函数 2.编写函数,作用是获取输入数据 3.判断数据是否合法,合法则提交,否则表单 ...
- java项目使用mvn打包时,出现数据库连接错误
原因: maven在install的时候会默认去执行test包下的test示例,导致打包失败,只需要把测试注释掉就可以了包括类上的注解,或者在install的时候跳过测试,install -Dmave ...
- postgresql-排序
postgresql的排序. https://www.cnblogs.com/flying-tiger/p/8120046.html 1.是根据排序数据量的大小来判断,如果数据量少到能够整体放到内存的 ...
- 06-搭建master集群
部署高可用 kubernetes master 集群 kubernetes master 节点包含的组件: kube-apiserver kube-scheduler kube-controller- ...
- odoo开发笔记 -- 搜索视图继承扩展
odoo开发笔记 -- 搜索视图继承扩展
- ElasticSearch实战-编码实践
1.概述 前面在<ElasticSearch实战-入门>中给大家分享如何搭建这样一个集群,在完成集群的搭建后,今天给大家分享如何实现对应的业务功能模块,下面是今天的分享内容,目录如下所示: ...