Javascript 反应：如何打开当前打开的具有相同原点的选项卡

我需要有关身份验证流程的帮助。我需要知道，当我已经打开了相同来源的选项卡时，当我单击电子邮件中的按钮时，如何转到打开的选项卡

---

假设我有一个带有URL

https://example.come

当前在我的浏览器中打开。然后我单击电子邮件中的按钮，该按钮href to

https://example.come?token=sss

。我想转到已打开的选项卡，而不是打开新选项卡。可以实现吗？

您可以使用

localStorage

跟踪域内打开的选项卡

• 使用页面列表初始化本地存储，以跟踪页面及其日期
• 单击锚点后，更新本地存储
• 每当单击

  锚定

  时，检查本地存储并做出决定
• 但不能重定向到其他选项卡。最好显示消息

常数pagesToListen={
登录：“/login”，
}
函数CreateTableListener（路由）{
const key=`$$DOMAIN\${route}`；
函数checkIfOpened（）{
const tabInfo=JSON.parse（localStorage.getItem（key））
if（tabInfo）{
//检查所需的最短日期
如果（tabInfo.date<10）返回true；
}否则{
setItem（键，{date:date.now（）}）；
返回false；
}
}
返回已打开的支票；
}
const loginTabListener=createTabListener（pagesToListen.login）；
//关于锚定标签
函数MyComponent（）{
函数handleClick（）{
if（loginTabListener.checkIfOpened（））{
警报（'您的登录页已打开'）
}否则{
//推向历史
}
}
返回(
)
}

打开的选项卡可以是任何内容。无法强制用户打开已打开的选项卡

const pagesToListen = {
  login: "/login",
}

function createTabListener(route) {
  const key = `$$DOMAIN_${route}`;

  function checkIfOpened() {
    const tabInfo = JSON.parse(localStorage.getItem(key))
    if (tabInfo) {
      // check for the minimum dates required
      if (tabInfo.date < 10) return true;
    } else {
      localStorage.setItem(key, { date: Date.now() });
      return false;
    }
  }

  return checkIfOpened;
}

const loginTabListener = createTabListener(pagesToListen.login);

// on anchor tags

function MyComponent() {
  function handleClick() {
    if(loginTabListener.checkIfOpened()) {
      alert('You login page is opened')
    } else {
      // push to the history
    }
  }

  return (
    <a href="/login" onClick={handleClick} />
  )
}