javascript - 安全身份验证 JS 客户端和 Azure 应用程序

Question

我有一个 JS 客户端应用程序，它使用硬编码的 SPA client_id 和最重要的 client_secret 向 Azure 端点发送 POST 请求，如下所示:

 function(request, sender, sendResponse) {
  let data = new FormData();
  data.append('client_id', "xxx");
  data.append("client_secret", "xxxx");
  data.append("grant_type", "password");
  data.append("scope", "https://management.azure.com/user_impersonation");
  data.append("username", request.usr);
  data.append("password", request.pass);

  const myHeaders = new Headers({
      Accept:"application/json"
  });
  let resp = fetch(url, { 
    headers : myHeaders,
    method: "POST",
    body: data,
    mode: 'cors'
  }).then( (response) => {
        // do some stuff
    })
}

我需要保护这些 secret ，因为客户端不应该直接访问它们，因此我在 Azure 中创建了一个后端节点服务器，用于监听 JS 客户端。

但是我再次遇到同样的问题:

如何对 JS 客户端应用程序进行身份验证，以便只有它才能向节点 Azure 服务发布请求，而不在客户端存储 secret /证书？

到目前为止，节点服务只能通过经过身份验证的帐户访问，但是如果我必须再次在 JS 客户端中加载 token ，我就会回到原来的问题......

有没有不同的方式来看待这个问题？或者其他技术来实现这种流程？

Answer 1

检索访问 token 以从客户端应用程序调用后端服务的标准方法是使用授权代码流。通常您会为此使用库，例如​​ MSAL .

使用授权代码流，用户将完成 Oauth 登录过程，您将编写代码以使用用户的安全上下文代表用户请求访问 token 。

用户必须有权访问相关资源，并且在 AAD 中，您必须启用 management.azure.com 的 API 权限。