基于Vue框架的web项目实现同一个浏览器仅能同时登录一个账号的方法
admin
2024-05-13 05:18:03
0次

文章目录

        • 1、同一个浏览器仅能同时登录一个账号的场景
        • 2、同一个浏览器同时登录多个账号存在的问题
        • 3、同一个浏览器仅能同时登录一个账号的实现方法

1、同一个浏览器仅能同时登录一个账号的场景

  • 基于Vue框架的web项目需要实现同一个浏览器只允许登录一个账号，即如果已经在浏览器上登录了用户A，在该浏览器上新建一个窗口（即新打开一个标签页）打开项目，登录用户B，然后用户A会自动退出。

2、同一个浏览器同时登录多个账号存在的问题

  • 因为在同一个浏览器同时登录多个账号很容易造成“同时登录的这几个账号的数据错乱”，导致数据不安全。
  • 例如：如果同一个浏览器允许登录多个账号，用户A（权限少，普通用户）登录自己的账号，用户B（权限多，超级管理员）在用户A的电脑上同时登录自己的账号，用户B使用完后关闭自己的标签页，用户A刷新页面后，显示的是用户B的账号，这样用户A就可以操作用户B账号的内容，存在严重的安全隐患。

3、同一个浏览器仅能同时登录一个账号的实现方法

  • 通过监听本地存储的字段用户id（常用userId表示）的变化来确定是否在同一个浏览器同时登录了不同账号。
  • 因为userId一定是唯一的，如果监听到本地存储的userId的值发生改变，则表示在该浏览器有新账户登录，即，在已经有账户A登录的情况下，在该浏览器又登录了一个B账号，所以强制账户A退出登录，通过让账户A跳转至登录页面实现账户A的退出登录。
  • 实现步骤如下：
  1. 首先，在账户A登录成功后，在登录页面login.vue页面使用localStorage将userId存储在本地。
localStorage.setItem('userId',userInfo.userId)
  1. 然后，在App.vue里的created方法中监听userId的变化，如果监听到userId发生变化，就强制旧userId值对应的账户A退出登录。
词库加载错误:未能找到文件“E:\highferrum_mysql\Configuration\Dict_Stopwords.txt”。

上一篇：2023.1.17单词打卡

下一篇：理财资金“存款化”趋势增强 理财产品收益下行趋势难改 理财上涨是趋势吗

相关内容

热门资讯

中乌签署乌克兰小麦粉输华议定书 4月7日消息，中国驻乌克兰大使马升琨6日会见乌克兰经济、环境和农业部副部长奥芙洽连科、食品安全与消费...
中信建投：看好国产算力和数据要... 4月7日消息，中信建投研报认为，2025年中国AI加速卡市场总出货量约400万张，国产AI加速卡份额...
仙乐健康：与广州雅拉源健康产业... 4月7日消息，仙乐健康发布关于近期媒体报道的初步情况说明称，针对近期 “澳洲优思益”产品的相关报道，...
6月夜空奇观：金木水火共舞天际... 嘿，小伙伴们！有没有想过，不用任何昂贵的设备，只需一双眼睛就能见证宇宙的奇妙？机会来了！从6月9日开...
调集百余架各类航空器、实施欺骗... 4月7日消息，美国总统特朗普当地时间6日召开新闻发布会，介绍营救美方战机飞行员相关事宜。特朗普称，一...
“囤词元能暴富”藏间谍窃取数据... 4月7日消息，国家安全部发文，近期，国家数据局正式定名的AI领域核心术语——词元（Token）成为网...
三星电子预计一季度利润同比飙升... 4月7日消息，三星电子公布，一季度初步营业利润为57.2万亿韩元（约合379亿美元），同比增长755...
美官员称美国已收到伊朗关于结束... 4月6日消息，美国阿克西奥斯新闻网6日援引一位美国官员的话报道，美国已收到伊朗关于结束战争的回应。（...
纳斯达克中国金龙指数涨幅扩大，... 4月6日消息，纳斯达克中国金龙指数涨幅扩大，现涨0.5%，最新报6784.58点。（科股宝播报）
AI算力爆发带飞液冷赛道，企业... 4月6日消息，今年以来，AI算力需求呈现爆发式增长，为相关产业链打开增量空间。算力要求越高，对数据中...