如何隱藏 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 中，然后在同一腳本中執行它。 那對我有幫助。