问题描述
我正在使用Auth0保护网站。当我向某人发送诸如mywebsite.com/home#subtitle
之类的链接时,我希望他们登录,然后立即查看#subtitle
部分(这只是纯HTML:<a id="subtitle">Subtitle</a>
)。
如果用户使用电子邮件地址和密码登录,则此方法可与Auth0一起使用。但是,如果他们选择“ Google”(目前是我唯一支持的社交服务提供商),那么当他们从用户名转移到密码屏幕时,#subtitle
部分就会丢失。
这是他们首先看到的内容(注意#subtitle
在浏览器中仍然存在):
然后他们选择Google并看到以下内容:
好的,#subtitle
仍在浏览器中。现在,他们输入他们的电子邮件地址并转换到密码屏幕:
#subtitle
已经消失,当它们继续时,最终将它们重定向到https://mywebsite.com/home
而不是https://mywebsite.com/home#subtitle
。
是否有避免这种情况的方式,或者这仅仅是Google工作的方式吗?在重定向之前,我无法捕获#subtitle
,因为我正在重定向服务器端,而#subtitle
没有发送到服务器(据我所知)。
解决方法
哈希片段是一个客户端概念,您不能依靠服务器端技术来为您维护它们。使用服务器端Web技术的后果之一是,您将遇到此类可用性问题:
- 服务器端安全性可能与尝试使用现代Web技术客户端的冲突
- 会话过期和数据/位置丢失等方面的潜在问题
- 使用临时cookie的区域中的潜在问题,例如登录后的向后导航
使用诸如OIDC客户端库之类的客户端技术,您只需在登录之前和之后编写几行代码,就像my code sample:
// Triggering a login redirect
const data = {
hash: location.hash,};
await this._userManager.signinRedirect({state: JSON.stringify(data)});
// Processing a login response
const user = await this._userManager.signinRedirectCallback();
const data = JSON.parse(user.state);
history.replaceState({},document.title,data.hash);
使用服务器端技术仍然可以解决您的问题,但是您需要构建代码以从Javascript启动登录。但是,用于此的代码可能很棘手/很复杂。