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 ...
随机推荐
- PgAgent安装、配置、运行
一 安装cmakewget http://www.cmake.org/files/v2.8/cmake-2.8.5.tar.gztar -zxvf cmake-2.8.5.tar.gzcd /root ...
- 5.html基础标签:块级+行级元素+特殊字符+嵌套规则
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 《Opencv 3 计算机视觉 python语言实现》· 第二遍 —— 读后笔记
概览 代码实战 https://github.com/xinghalo/ml-in-action/tree/master/book-opencv
- 命令行下查看python和numpy的版本和安装位置
命令行下查看python和numpy的版本和安装位置 1.查看python版本 方法一: python -V 注意:‘-V‘中‘V’为大写字母,只有一个‘-’ 方法二: python --versio ...
- Pycharm中自动生成作者,日期等信息
初次安装使用PyCharm,在新建.py文件时会发现文件头并没有什么信息,因此,使用模板会比较方便.方法如下: 1.打开PyCharm,选择File--Settings 2.依次选择Editor--- ...
- .NET手记-JS获取Url参数
最近为App做活动专区,其中很多活动都是采用html 5页面来制作的.一方面体量较小,制作快速,更新维护容易:另一方面,嵌入App后适配效果也不会很差. 这里我们采用混编形式来从native app传 ...
- [视频]K8飞刀 BadUSB Teensy自动种马演示教程
[视频]K8飞刀 Teensy USB自动种马演示教程 链接: https://pan.baidu.com/s/13bM1XSLrhlf90FDmPGfo1g 提取码: gy2q 源码:https:/ ...
- 十余年软件开发经历,经验总结和程序一览(涉及Socket、WPF、vc++、CAD、图像、GIS)
前言 本文主要介绍我开发的几款软件产品,大概介绍一下功能.可以让读者了解本人的开发能力,所擅长的方面.有相关开发需求可以联系作者. 本人开发软件多年,从事的行业也多种多样:自然接触了不同的业务,开发了 ...
- Android FileObserver 实现原理(inotify)
目录 0x0前言 0x01 FileObserver 使用实例 0x02 FileObserver 实现原理 0x04 完整Demo下载地址 0x0前言 之前在分析某个Android平台加固壳子的时候 ...
- C# Code First 配置(二)
上一篇文章地址 C# Code First 配置 此文章主要介绍配置映射到表中的详细字段.信息等,如下: System.ComponentModel.DataAnnotations 包含的特性: At ...