在纯前端应用程序上的何处以及如何存储服务凭证
Where and how to store service credentials on pure front-end application
我希望在客户端(即浏览器)使用 JavaScript 运行 构建一个纯前端应用程序。我的应用程序应该向第三部分服务发出请求,这需要某种身份验证方法。
后端框架为这类事情提供配置文件,但由于 JS 代码全部在客户端机器上解释,配置文件不能成为 bundle 的一部分。
有没有什么方法可以在客户端安全地存储服务 API 密钥、凭据等,或者我是否也需要后端解决方案?
在最流行的框架(Angular 和 React)中搜索配置文件,结果只存储了特定于环境的 URL。我开始认为我已经走到了死胡同,这根本无法完成。
取决于...您不希望用户能够嗅出您必须发送给第三方的任何秘密,但在使用 OAuth2 的隐式授权的情况下,您实际上可以启动并完成它在浏览器中。
您将重定向到 login/authentication 的第 3 方,然后该用户将被发送回给您,并带有一段时间有效的访问令牌。
根据规范,该令牌实际上是在 URL 片段中发送的,因此它被发送到浏览器而不是您的服务器。如果您想获取服务器的访问令牌,您需要前端代码来解析 URL 片段并发送其内容。
如果 API 允许您从浏览器连接,您可以将所有内容保存在浏览器中,而不需要后端服务器来处理凭据。但并非每个 API 都允许纯粹的前端身份验证和 API 调用。
所以,这取决于...
您能否将服务 api 凭据存储在客户端缓存或 cookie 等中?是的。通过网络发送它们并存储在浏览器中会 secure 吗? 没有。
如果保持凭据安全是要求的一部分,我会在后端进行身份验证或使用第三方服务为您完成这项工作。
我希望在客户端(即浏览器)使用 JavaScript 运行 构建一个纯前端应用程序。我的应用程序应该向第三部分服务发出请求,这需要某种身份验证方法。
后端框架为这类事情提供配置文件,但由于 JS 代码全部在客户端机器上解释,配置文件不能成为 bundle 的一部分。
有没有什么方法可以在客户端安全地存储服务 API 密钥、凭据等,或者我是否也需要后端解决方案?
在最流行的框架(Angular 和 React)中搜索配置文件,结果只存储了特定于环境的 URL。我开始认为我已经走到了死胡同,这根本无法完成。
取决于...您不希望用户能够嗅出您必须发送给第三方的任何秘密,但在使用 OAuth2 的隐式授权的情况下,您实际上可以启动并完成它在浏览器中。
您将重定向到 login/authentication 的第 3 方,然后该用户将被发送回给您,并带有一段时间有效的访问令牌。
根据规范,该令牌实际上是在 URL 片段中发送的,因此它被发送到浏览器而不是您的服务器。如果您想获取服务器的访问令牌,您需要前端代码来解析 URL 片段并发送其内容。
如果 API 允许您从浏览器连接,您可以将所有内容保存在浏览器中,而不需要后端服务器来处理凭据。但并非每个 API 都允许纯粹的前端身份验证和 API 调用。
所以,这取决于...
您能否将服务 api 凭据存储在客户端缓存或 cookie 等中?是的。通过网络发送它们并存储在浏览器中会 secure 吗? 没有。
如果保持凭据安全是要求的一部分,我会在后端进行身份验证或使用第三方服务为您完成这项工作。