通过 ajax 请求将身份验证标头发送到 API 的正确方法

Question

我有一个表单，其中我将身份验证密钥存储在隐藏字段中。

hidden_field_tag 'auth_key', Settings.biometric.auth_key

我正在向 API 发送一个 ajax 请求，我在该 API 中设置需要密钥的标头中的身份验证密钥：

var authKey = $("input[id='auth_key']").val();
beforeSend: function (xhr) {
  xhr.setRequestHeader ("auth", authKey);
}

一切正常，只是身份验证密钥位于表单中，任何恶意用户都可以轻松检查。

我认为这可能不是正确的方法 执行此操作的最佳方法是什么？

Answer 1

TL;DR:

任何有权访问客户端（也就是使用浏览器的用户）的人最终都可以找到获取此auth_key 的方法，因为客户端用户拥有并且将始终有权/访问哪些“数据” " 被发送/接收/存储，由于内置浏览器开发工具，在 webapps 中尤其容易。

一些解释：

免责声明：我不精通这个领域，所以如果有人，请告诉我。

• 是的，它可以在客户端加密，但用户/黑客可以解密它们，因为“加密”跟踪可以在您的 JS 脚本文件的某处找到：

  // application.js example
  ...beforeSend: function (xhr) {
    var encryptedAuthKey = localstorage.get('encrypted-auth-key');
    var decryptionPassword = 'abcd';
    var authKey = doSomeFancyDecryption(encryptedAuthKey, decryptionPassword);
    xhr.setRequestHeader ("auth", authKey);
  }
  

• 但是，一种安全的方法是使用存储在服务器端的密码对其进行加密，这样客户端就无法在 JS 代码中调试/检查/查找此密码...除非这是不可能的，请参阅下面：

  // application.js example
  ...beforeSend: function (xhr) {
    var encryptedAuthKey = localstorage.get('encrypted-auth-key');
  
    var decryptionPassword = someFunctionThatPerformsAjaxRequestToServerAndReturnsTheDecryptionPassword();
    var authKey = doSomeFancyDecryption(encryptedAuthKey, decryptionPassword);
  
    function someFunctionThatPerformsAjaxRequestToServerAndReturnsTheDecryptionPassword() {
      // do some ajax request with Auth header equals Something...
      // ummm... what's the value of this something?
      // ummm... I cannot pass in my Username and Password, of course!
      // ummm... I cannot pass in another-kind of "auth_key", which just basically loops this process itself.
    }
  
    xhr.setRequestHeader ("auth", authKey);
  }
  

• 您可以“签署”您的请求，这样您就不再需要直接提供 auth_key 作为您请求的一部分（但客户端用户仍然可以破解它并获取授权密钥并创建自己的请求自己，正是因为他们可以看到并可以访问您的底层代码，如下所示）：

  // application.js example
  ...beforeSend: function (xhr) {
    var authKey = localstorage.get('auth-key');
    var params = // assign all input fields as key-values object here
    var url = this.url;
    var signature = generateSignatureUsingHMAC(authKey, url, params)
  
    xhr.setRequestHeader ("Signature", signature);
  }
  

我会亲自做类似上面基于签名的授权