首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

微前端学习笔记(3):前端沙箱之JavaScript的sandbox(沙箱)

sandBox实现实现分为2个类别,一个是用iframe 或ShadowRealm  在原生实现sandbox,第二种是js特性实现sandbox(主要基于proxy)。...使用浏览器内置的机制:iframe:创建一个iframe元素,并给它设置一个属性(sandbox="allow-scripts")。...这样,iframe内的代码就只能运行在一个严格的环境中,仅有一些受限的权限。...下面详细介绍下实现思路。iframe利用iframe天然隔离机制,加上postMessage通讯机制,可以快速实现一个简易沙箱。...任何在盒内声明或者修改的变量都不会影响到全局作用域,同时,全局作用域下的变量在盒内也是不可见的)// 创建一个对象,这个对象里面的属性和全局作用域不同步,避免盒内代码影响外部环境const sandboxProxy

37910

八种方式实现跨域请求

容易受到跨站请求伪造的攻击,其安全性无法确保 方式三:CORS Cross-Origin Resource Sharing(CORS)跨域资源共享是一份浏览器技术的规范,提供了 Web 服务从不同域传来脚本的方法...iframe 标签的跨域能力; window.name 属性值在文档刷新后依旧存在的能力(且最大允许2M左右)。...方式六:修改document.domain跨子域 前提条件:这两个域名必须属于同一个基础域名!...而且所用的协议,端口都要一致,否则无法利用 document.domain 进行跨域,所以只能跨子域 在根域范围内,允许把 domain 属性的值设置为它的上一级域。...它实现了浏览器与服务器全双工通信,同时允许跨域通讯,是server push技术的一种很棒的实现。

1.7K41
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    Web Security 之 CORS

    Origin 白名单允许 null 值 浏览器会在以下情况下发送值为 null 的 Origin 头: 跨站点重定向 来自序列化数据的请求 使用 file: 协议的请求 盒中的跨域请求 某些应用程序可能会在白名单中允许...例如,可以使用 iframe 进行跨域请求: <iframe sandbox="allow-scripts allow-top-navigation allow-forms" src="data:text...来自内部文档和请求的跨域资源调用可以指定 origin 为 null 的。CORS 头应该根据私有和公共服务器的可信来源正确定义。 避免在内部网络中使用通配符 避免在内部网络中使用通配符。...为此,两个域都需要设置 document.domain 为 example.com,那么同源策略将会允许这里两个域之间的访问,尽管它们并不同源。...在过去,你可以将 document.domain 设置为顶级域名 com,以允许同一个顶级域名的任何域之间的访问,但是现代浏览器已经不允许这么做了。

    1.3K10

    早早聊 C7 笔记 - 【字节】时光:微前端体系的落地实践

    sandbox Deployment Splitting # 应该做什么 古老的 iframe —— 古老的困难 一些能做的 一个站点页面拆成 N 个 frame 每个 frame 单独一个独立域名...Docker Iframe 像虚拟机 # 怎么做 参考单核、操作系统进程模拟进程切换策略 JavaScript 是单线程的 通过对路由切换的封装,模拟单进程 通过对事件循环封装,模拟单核多进程...用 Context 切换模拟线程安全 新沙即将激活时,查找当前激活中的 保存现场,存储 Context 恢复之前的 Context Context 切换的笛卡尔积 比较并切换 数量...# 全局变量的干扰 Polyfill 等差异巨大 generatorRuntime 组件模块化 全局的外部环境 Identifier let const class Configurable...缓存跟随切换 两级缓存 沙箱内全局 系统全局 # 埋点数据的发送 异步发送 触发时机在外、缓存跟随切换 全局缓存和本地缓存统一本地存储 # console 回收 干净体面 控制 sourceMapping

    29820

    fencedframe 可以替代 iframe 吗?

    今天继续聊 浏览器策略 ,这是我 「浏览器策略解读」 专栏的第 35 篇文章了,感谢读者们一既往的支持!...禁用后的影响以及一些解决方案,比如下面几篇文章: 当浏览器全面禁用三方 Cookie 详解 Cookie 新增的 SameParty 属性 详解 Cookie 的分区存储(CHIPS) 三方 Cookie 替代品 — 隐私的最新进展...这意味着嵌入在具有相同 eTLD+1 的网站(例如 frame.example 和 conardli.example)iframe 可以共享浏览器存储。...Fenced frames 是一项隐私提案(https://github.com/WICG/fenced-frame),它建议顶级站点应该对数据进行分区。...> 另外 Fenced frames 可能会和其他的 隐私 的 API 来配合使用,浏览器可能会为 Fenced frames 生成一个不透明的 URL 。

    2.2K10

    Java 最常见的 208 道面试题:第八模块答案

    GET比POST更不安全,因为参数直接暴露在URL,所以不能用来传递敏感信息。 GET参数通过URL传递,POST放在Request body中。 86. 如何实现跨域?...容易受到跨站请求伪造的攻击,其安全性无法确保 方式三:CORS Cross-Origin Resource Sharing(CORS)跨域资源共享是一份浏览器技术的规范,提供了 Web 服务从不同域传来脚本的方法...iframe标签的跨域能力; window.name属性值在文档刷新后依旧存在的能力(且最大允许2M左右)。...方式六:修改document.domain跨子域 前提条件:这两个域名必须属于同一个基础域名!...而且所用的协议,端口都要一致,否则无法利用document.domain进行跨域,所以只能跨子域 在根域范围内,允许把domain属性的值设置为它的上一级域。

    87430

    web跨域解决方案

    特别注意两点: 1、如果是协议和端口造成的跨域问题“前台”是无能为力的   2、在跨域问题上,域仅仅是通过“URL的首部”来识别而不会去尝试判断相同的ip地址对应着两个域或两个域是否在同一个ip。...其中,   window.location.protocol:指含有URL第一部分的字符串,http:     window.location.host:指包含有URL中主机名:端口号部分的字符串....它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。它为Web服务器定义了一种方式,允许网页从不同的域访问其资源.   ...CORS系统定义了一种浏览器和服务器交互的方式来确定是否允许跨域请求。 它是一个妥协,有更大的灵活性,但比起简单地允许所有这些的要求来说更加安全。 实现方法: CORS需要浏览器和服务器同时支持。...比如,你想在2.com的网页往1.com网页上传消息,那么这个参数就是“http://1.com/”,而不是2.com.协议,(一个完整的域名包括:主机名,端口号。

    2.7K100

    JS 跨域问题常见的五种解决方式

    使用方法也很简单,在php后端设置 Access-Control-Allow-Origin 头即可,: <?...中的问号,之后获取到数据后又会自动销毁,实际就是起一个临时代理函数的作用。...第三: document.domain + iframeiframe的使用主要是为了ajax通信) 不同的框架之间是可以获取window对象的,但却无法获取相应的属性和方法。..."text/javascript"> document.domain = 'example.com';//在iframe载入这个页面也设置document.domain,使之与主页面的document.domain...,然后就是通过我们刚刚讲得修改document.domain的方法,让我们能通过js完全控制这个iframe,这样我们就可以让iframe去发送ajax请求,然后收到的数据我们也可以获得了。

    1.5K00

    iOS学习——如何在mac获取开发使用的模拟器的资源以及模拟器中每个应用的应用

    如题,本文主要研究如何在mac获取开发使用的模拟器的资源以及模拟器中每个应用的应用。...下面两张图第一张是模拟器的资源文件夹式的资源库,第二张是模拟器中某个应用App对应的应用(其实就是该应用对应的文件系统目录)。   ...首先,由于Mac系统对系统资源没有像windows一样完全开放,在macOS资源库对用户默认是隐藏的,用户无法很方便的获取到系统的硬盘资源目录。...最后,我们需要找到该模拟器下每个app的应用,即最上面图2的文件夹。...模拟器中App的应用文件夹目录是:/Users/mukekeheart/Library(即资源库)/Developer/CoreSimulator/Devices/[simulater ID]/data

    2.9K70

    【Web技术】424- 那些年曾谈起的跨域

    ajax去获取你要的数据的,然后就是通过我们刚刚讲得修改document.domain的方法,让我们能通过 js 完全控制这个iframe,这样我们就可以让iframe去发送ajax请求,然后收到的数据我们也可以获得了...location.hash 若理解了document.domain实现跨域原理,那么location.hash也就很好理解了,其原理与document.domain很相似一样都是动态插入一个iframe...这时top window和包裹这个iframe的子窗口由于同源策略的原因是不能直接通信的,所以改变子窗口的路径就行了,将数据当做改变后的路径的hash值加在路径,然后就能通信了,将数据加在index页面地址的...hash值。...服务器根据客户端的请求,从其关联的一组或多组后端服务器( Web 服务器)获取资源,然后再将这些资源返回给客户端,客户端只会得知反向代理的IP地址,而不知道在代理服务器后面的服务器簇的存在。

    57110
    领券