如何隐藏 JavaScript 中的变量值？

Question

我目前正在做一个 JavaScript 项目，并且知道 JavaScript 源代码可以通过浏览器访问。 在代码中，我有一个变量存储程序使用的秘密字符串。 但是，我不想让别人查看源代码，找出这个变量的值。 有没有办法隐藏变量的值？ 还是可以在之后更改变量值？ 例如，更改实际源代码以将变量设置为不同的值？ 此变量仅在第一次加载图像时使用，因此如果可能的话，完全删除它也是可以的。

Answer 1

Javascript在客户端上运行，所以我不认为这是可能的。 你需要保密的任何东西都需要服务器端。

Answer 2

您无法向程序员隐藏JavaScript内容。 他们总是可以打开开发人员控制台并获取所有变量。

更糟糕的是，他们可以使用所述控制台直接绕过任何JavaScript验证，因此它不能成为您的主要安全性。

如果您必须隐藏或保护它，您必须查看服务器端解决方案。

Answer 3

JavaScript是客户端，并且实际上没有隐藏代码。

你能做什么：防止普通用户看到它（也就是说更难找到）

我的建议是使用某种密码加密数据（最好不是在线加密工具）。 这可以阻止大多数懒人看到它。

（假设没有人真正试图找到这个神秘的价值）

Answer 4

你问的是目前不可能的。

但是有一个 JavaScript proposal Function implementation hiding ，顾名思义，它隐藏了 function 实现不被观察到。 该提案起源于 2019 年年中，目前处于第 2 阶段（共 4 个阶段）。 我个人怀疑它是否会成为标准的一部分，但如果它成为标准的一部分，理论上你可以将秘密隐藏在隐藏的 function 的主体内部：

function fetchData() {
  "sensitive"; // ← the proposal

  const SECRET = "VGhlIG1lc3NhZ2UgaXM6IFIyeHZjbmtnZEc4Z1ZXdHlZV2x1WmZDZmg3cnduNGVt";

  return fetch(DATA_URL, {
    headers: {
      "Authorization": `Bearer ${SECRET}`,
    },
  });
}

无法通过调试器或通过fetchData.toString()检查SECRET变量。 但是， Authorization header 的值在控制台的 a.network 选项卡中可见，因此整个事情不适合此用例。

Answer 5

一个解决方法是使用Ajax从另一个页面获取值，如PHP文件。

Answer 6

那么，您可以将整个代码放入一个 function 中，然后在同一脚本中执行它。 那对我有帮助。