多网页登录Cookie免登通俗理解

背景,现在有A、B两个系统,其中B是乾坤框架的微前端,里面又有若干可以单独运行的系统C、D、E、F,现在的目标是,如果没有登录过其中任一系统,则需要跳转登录页登录,登录后,所有的A-F都不再需要登录,登录token有效期12h,每次访问都重新刷新12h,上面A-F的域名结尾都是abc.com如a.abc.com、b.abc.com

解决思路:利用浏览器的Cookie实现

登录页面登录后,登录前端在Cookie存放token,先来看下面效果

首先是cookie的key值,也就是_micro.common-info

然后value值是自己前端定义的,比如我这里定义了 环境变量+token

然后是Domain,这是个领域的意思,一般用于区分不同的域名

核心代码是setCookie和getCookie,Cookie.js如下

import Cookies from 'js-cookie';
const TOKENKEY = 'xToken';
const COOKIEKEY = '_micro-common-info';
const ENV = process.env.ENV_CONFIG;
const DOMAIN = 'paymentru.com';
const REG = /paymentru\.com$/;export function getCookie() {const cookie = getAllCookie()[ENV];return cookie && cookie[TOKENKEY];
}export function setCookie(token) {const cookie = getAllCookie();if (!cookie[ENV]) {cookie[ENV] = {};}cookie[ENV][TOKENKEY] = token;// save the token for 1 yearreturn new Promise((resolve, reject) => {try {Cookies.set(COOKIEKEY, cookie, {domain: getDomain(),});resolve();} catch (error) {reject(error);}});
}export function removeCookie() {setCookie('');return true;
}function getDomain() {return ['localhost', '127.0.0.1', '0.0.0.0'].includes(document.domain)? document.domain : REG.test(document.domain) ? DOMAIN : document.domain;
}function getAllCookie() {const cookStr = Cookies.get(COOKIEKEY, {domain: getDomain(),});if (cookStr && typeof cookStr == 'string') {try {const cookie = JSON.parse(cookStr);if (cookie && typeof cookie == 'object') {return cookie;}} catch (e) {console.error(e);}}return {};
}
其中这里比较关键
const DOMAIN = 'paymentru.com';
const REG = /paymentru\.com$/;
function getDomain() {return ['localhost', '127.0.0.1', '0.0.0.0'].includes(document.domain)? document.domain : REG.test(document.domain) ? DOMAIN : document.domain;
}

解释下来的意思就是 getDomain 函数返回当前文档的域名。如果域名是 'localhost''127.0.0.1' 或 '0.0.0.0' 中的一个,它将返回当前域名。否则,它将检查当前域名是否符合正则表达式 /paymentru\.com$/ [这个正则表达式的意思是匹配以paymentru.com结尾的域名],如果符合,则返回常量 DOMAIN 的值 'paymentru.com',否则返回当前域名

所以ABCD系统登录时,先去paymentru.com这个Domain下指定环境变量的Cookie获取token,这样这些系统都用统一后缀的cookie实现互相免登

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/29716.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python 自动化测试入门有哪些内容?

自动化测试是软件测试领域中的一个重要技术,它利用脚本和工具来执行测试任务,减少了人工操作的工作量和时间消耗。Python 是一种功能强大且易于学习的编程语言,被广泛应用于自动化测试领域。本文将从0到1讲解如何使用 Python 进行自动化测试&…

网络编程(一)基本概念

文章目录 一、概念(一)网络发展阶段1. ARPAnet阶段2. TCP/IP两个协议阶段3. 网络体系结构和OSI开放系统互联模型4. TCP/IP协议簇体系结构(1) 应用层:(2)传输层:(3&#x…

白名单在数据防篡改方面的优势与局限

白名单作为一种安全机制,其主要目的是通过预先设定受信任的程序、文件或用户列表,来限制系统资源的访问和执行权限。这种机制在防止未授权的程序或文件运行方面具有一定的效果,从而在一定程度上减少病毒入侵的机会。然而,当我们探…

读书笔记-《人人都是产品经理》

在开发工程师与产品经理的段子中,常看到“人人都是产品经理”这句话,用来调侃这个岗位似乎没有什么门槛。 很明显,这句话的出处,即本书作者想表达的是每个人都可以运用产品思维去解决问题。 01 产品 产品:用来解决某…

python中scrapy

安装环境 pip install scrapy 发现Twisted版本不匹配 卸载pip uninstall Twisted 安装 pip install Twisted22.10.0 新建scrapy项目 scrapy startproject 项目名 注意:项目名称不允许使用数字开头,也不能包含中文 eg: scrapy startproject scrapy_baidu_…

热重启(硬重启)获取Bitlocker密钥取证

计算机内存(条)在系统运行时存储了大量敏感信息,当断电后,内存中的数据荡然无存。反之,当一直通电的情况下,内存中的一些敏感数据一直存在。当然,正如某些人了解的,当断电后&#xf…

管道光电液位传感器应用在哪些设备

管道光电液位传感器在现代智能设备中扮演着至关重要的角色,特别是在需要检测水管缺水的应用场景中。与传统的浮球开关相比,这种传感器具有高可靠性、稳定性和不易卡死等优点。其先进的光学感应原理无需机械运动,确保了长久的寿命和稳定的性能…

《CGT行业监管及上市路径解析》——锦天城高级合伙人虞正春先生在线分享

细胞和基因治疗(Cell and Gene Therapy, CGT)已成为近年来全球药物研发的热点与前沿领域,也得到了国家政策的大力支持。《“十四五”生物经济发展规划》中提到“发展基因诊疗、干细胞治疗、免疫细胞等新技术”,“围绕加快创新药上…

Spring中事务的隔离级别和传播机制

上一篇博客中讲解了关于事务的两种使用方式包括Transactional的详解。 Transactional 注解当中的三个常⻅属性: 1. rollbackFor: 异常回滚属性. 指定能够触发事务回滚的异常类型. 可以指定多个异常类型 2. Isolation: 事务的隔离级别. 默认值为 Isolation.DEFAULT 3. propagat…

短视频矩阵系统:高效运营,解决多账号管理难题

前言 在当下短视频风靡的时代,如何高效管理和运营多个短视频账号,成为了众多运营者面临的挑战。而今,一款全新的短视频矩阵系统应运而生,它不仅融合了AI文案生成与剪辑模式等先进功能,更支持多平台授权,助…

超分辨率重建——2022冠军RLFN网络推理测试(详细图文教程)

💪 专业从事且热爱图像处理,图像处理专栏更新如下👇: 📝《图像去噪》 📝《超分辨率重建》 📝《语义分割》 📝《风格迁移》 📝《目标检测》 📝《暗光增强》 &a…

如何用Vue3打造一个炫酷的树状图

本文由ScriptEcho平台提供技术支持 项目地址:传送门 基于 Vue.js 的 Treemap 可视化组件 应用场景介绍 Treemap 可视化组件是一种强大的工具,用于以直观的方式展示分层数据。它将数据点绘制为矩形,其中每个矩形的大小与数据点的大小成正比…

阿里云平台创建设备及连接

使用阿里云平台创建项目,利用MQTT.fx软件配置相关的连接,在软件上完成消息的订阅与推送,与手机APP进行同步数据。了解MQTT相关的协议。 1.注册阿里云平台账号,完成实名注册! 618创新加速季_新迁入云享5亿算力补贴-阿里…

JCR一区 | Matlab实现GAF-PCNN、GASF-CNN、GADF-CNN的多特征输入数据分类预测/故障诊断

JJCR一区 | Matlab实现GAF-PCNN、GASF-CNN、GADF-CNN的多特征输入数据分类预测/故障诊断 目录 JJCR一区 | Matlab实现GAF-PCNN、GASF-CNN、GADF-CNN的多特征输入数据分类预测/故障诊断分类效果格拉姆矩阵图GAF-PCNNGASF-CNNGADF-CNN 基本介绍程序设计参考资料 分类效果 格拉姆…

【网络编程开发】16.域名解析与http服务器实现原理

16.域名解析与http服务器实现原理 文章目录 16.域名解析与http服务器实现原理gethostbyname 函数HTTP的操作过程实现httphome.htmlhttp-head.txtserver.c gethostbyname 函数 原型&#xff1a; #include <netdb.h> struct hostent *gethostbyname(const char *hostname);…

技巧|手机上看SwanLab实验的两种方法

什么是SwanLab? SwanLab是一个深度学习实验管理与训练可视化工具&#xff0c;由西安电子科技大学创业团队打造&#xff0c;融合了Weights & Biases与Tensorboard的特点&#xff0c;可以记录整个实验的超参数、指标、训练环境、Python版本等&#xff0c;并可视化图表&…

google chrome浏览器安装crx插件Jam

先上一张图&#xff1a; Jam是bug报告生成插件 1、在地址栏中输入chrome://extensions/&#xff0c;然后回车。 2、将下载好的crx插件&#xff0c;直接拖到里面就可以完成安装工作了。 3、测试了一下jam插件&#xff0c;发现直接没有响应。 4、点击【移除】直接可以删除插件…

这四个有意思的工具,很香

提醒英雄 提醒英雄应用是一款能够帮助用户彻底解决健忘症的应用程序。该应用创建的事项会完全同步到通知中心&#xff0c;并且持续保持在锁屏界面上&#xff0c;只要打开手机&#xff0c;用户就会看到之前设置的提醒事项。这种设计确保了用户在任何时候都能及时收到提醒&#…

YOLOv10改进 | 注意力篇 | YOLOv10引入Polarized Self-Attention注意力机制

1. Polarized Self-Attention介绍 1.1 摘要:像素级回归可能是细粒度计算机视觉任务中最常见的问题,例如估计关键点热图和分割掩模。 这些回归问题非常具有挑战性,特别是因为它们需要在低计算开销的情况下对高分辨率输入/输出的长期依赖性进行建模,以估计高度非线性的像素语…

JavaFX DatePicker

JavaFX DatePicker允许从给定日历中选择一天。DatePicker控件包含一个带有日期字段和日期选择器的组合框。JavaFX DatePicker控件使用JDK8日期时间API。 import javafx.application.Application; import javafx.scene.Scene; import javafx.scene.control.DatePicker; import j…