Chrome堆内存转储中明文显示密码的漏洞问题求助

根本原因 #

密码输入框的明文内容会被Chrome的V8引擎存在堆内存里，你之前加的autocomplete和缓存meta标签管的是浏览器缓存和自动填充，根本碰不到运行时内存里的数据，所以没用。

实际可行的解决办法 #

• 用完密码立刻清，别让它在内存里待着
  别让密码字段的value一直存着明文。表单提交后马上清空输入框，连临时存密码的变量也一起覆盖掉，帮垃圾回收器赶紧把这块内存清了：

  const loginForm = document.getElementById('login-form');
  loginForm.addEventListener('submit', (e) => {
    e.preventDefault();
    const passwordInput = document.getElementById('password');
    let password = passwordInput.value;
    // 发登录请求
    fetch('/api/login', {
      method: 'POST',
      body: JSON.stringify({ 
        username: document.getElementById('username').value, 
        password 
      }),
      headers: { 'Content-Type': 'application/json' }
    }).then(() => {
      // 清空输入框，同时把变量改成空字符串
      passwordInput.value = '';
      password = '';
    });
  });
  

• 客户端先哈希密码再传，别让明文进内存太久
  用Web Crypto API把密码哈希之后再发给后端，这样内存里只会存哈希值，就算堆转储也拿不到真实密码：

  async function hashPassword(password) {
    const encoder = new TextEncoder();
    const data = encoder.encode(password);
    const hash = await crypto.subtle.digest('SHA-256', data);
    // 把哈希转成字符串方便传输
    return Array.from(new Uint8Array(hash))
      .map(b => b.toString(16).padStart(2, '0'))
      .join('');
  }
  
  loginForm.addEventListener('submit', async (e) => {
    e.preventDefault();
    const passwordInput = document.getElementById('password');
    let rawPassword = passwordInput.value;
    const hashedPassword = await hashPassword(rawPassword);
    // 传哈希值，不是明文
    await fetch('/api/login', {
      method: 'POST',
      body: JSON.stringify({ 
        username: document.getElementById('username').value, 
        password: hashedPassword 
      }),
      headers: { 'Content-Type': 'application/json' }
    });
    // 清干净
    passwordInput.value = '';
    rawPassword = '';
  });
  

  注意：后端别直接存这个哈希，最好再加个盐二次哈希，不然彩虹表能破解。

• 服务器端加响应头，禁止Chrome存页面状态
  光前端加meta标签没用，得在服务器端返回以下HTTP头：

  Cache-Control: no-store, no-cache, must-revalidate, private
  Pragma: no-cache
  Expires: -1
  Save-Data: on
  

  同时监听页面卸载事件，把所有密码框清空：

  window.addEventListener('beforeunload', () => {
    document.querySelectorAll('input[type="password"]').forEach(input => {
      input.value = '';
    });
  });
  

为啥之前的操作没效果 #

• autocomplete只是管浏览器自动填密码，和堆内存里存的东西没关系。
• 前端的缓存meta标签，只能控制浏览器要不要存页面文件，管不了V8引擎运行时的内存存储。

内容的提问来源于stack exchange，提问作者Victor