保存 OAuth2 访问令牌以进行无会话身份验证

Question

我设置了一个使用 OAuth2 密码授予身份验证的无会话应用程序。当用户使用用户名和密码登录我的应用程序时，我将访问令牌保存在 sessionStorage 中，有效期为 30 分钟。我还在sessionStorage 中保存了一个刷新令牌，以防我需要将会话延长超过 30 分钟。刷新令牌的有效期为 30 天。

如果在登录时选中了“记住我”复选框，我会将访问和刷新令牌保存在 localStorage 中，这样只要刷新令牌有效，它们就会一直存在。

除了几个问题之外，这两个似乎都可以正常工作：

1. 如果浏览器保持打开状态且用户未注销，会话可能会持续 30 天。
2. sessionsStorage 不会在窗口/选项卡之间持续存在，因此如果用户打开一个新窗口，他们需要再次登录。当“记住我”复选框被选中时，这不是问题，因为localStorage 在窗口之间确实存在。

Answer 1

我认为对 JavaScript 应用程序使用刷新令牌并不安全 - 您需要访问 /token 端点并使用应用程序的密钥进行身份验证。但是这个秘密会在这些应用程序中公开。

我更喜欢 OAuth2 隐式流程并使用 prompt=none 参数（来自 OpenID Connect）从 /auth 端点获取新令牌。但是使用隐式流程，您要么需要获得更长的 ID 令牌（并稍后请求带有 ID 令牌的访问令牌），要么在 OAuth2 上实现“记住我”（更好的选择 - 任何人都可以使用应用）。这也将解决问题 #2，在选项卡之间传递标记。

1. “会话”是指使用刷新令牌生成 30 天的访问令牌？如果这是一个问题，您可以实施一些活动检测器，如果没有活动，例如将用户注销。 30 分钟。
2. 可以将localStorage 用作一种消息传递服务，因此您可以将令牌保留在sessionStorage 中，但新标签可以使用localStorage 从现有标签中请求令牌。欲了解更多信息，请参阅http://www.codediesel.com/javascript/sharing-messages-and-data-across-windows-using-localstorage/

链接文章中的代码示例：

function eventListener(e) {
    if (e.key == 'storage-event') {
        output.innerHTML = e.newValue;
    }
}

function triggerEvent() {
    localStorage.setItem('storage-event', this.value);
}

window.addEventListener("storage", eventListener, true);
data.addEventListener("keyup", triggerEvent, true);

工作流程是这样的：

1. 新选项卡打开，并向 localStorage 写入任意值，其中的键指示它需要令牌。键可以是“newTabOpened”。新标签开始监听另一个键“oauth2token”的变化。
2. 现有选项卡侦听“newTabOpened”键的更改，并作为响应，将其令牌值写入“oauth2token”键下。
3. 新选项卡读取令牌并将其从本地存储中删除。