前端是否可以限制访问范围?

Question

考虑到前端代码的规模越来越大，Webpack 5提供的微前端和模块联合的概念是一个可能的解决方案。然而，考虑到您正在集成来自其他团队/第三方的代码的可能性，外部代码可能会试图通过简单地访问window对象并遍历其子对象来访问它不应该访问的信息。

这并不一定是像密码和信用卡这样的关键信息，这些信息通常使用iframe进行隔离。不太敏感的信息，如用户电子邮件，或跟踪数据可能被收集和滥用。

在这种情况下，是否存在不涉及iframes的技术设置，可以限制脚本的访问范围?这在技术上可以在WebAssembly程序中实现吗?

编辑是的，保守的规则就是不运行不受信任的代码。然而，提出的问题是，如果在技术上有可能在不使用iframe限制其对信息的访问的情况下对前端代码进行沙盒处理。

Answer 1

Javascript本质上是"公开的"，所以在某些时候，你放入或取出的东西最终会被暴露，要么通过网络获取/XHR，要么通过函数执行。

有一个"private"javascript中的模式，它可以防止窥探对象内部的情况——您可以显式定义暴露的方法/属性:

window.myThing = (function(){
var a = "a";
var private_b = "b";
function one(){
return "one"
}
function private_two(){
return private_b
}
return {
public_a : a,
public_one : one
}
}());

for(var prop in window.myThing){
console.log(prop, window.myThing[prop])
}
// ----------------------------------
// only the following properties 
// are exposed from the window scope:
// ----------------------------------
//  + public_a as - a
//  + public_one as ƒ one()

理论上，这种模式可以允许内部(非暴露/不可遍历)方法和属性…并利用某种形式的"输入和输出"加密。