auth.ts 3.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. import Cookies from "js-cookie";
  2. import { storageLocal } from "@pureadmin/utils";
  3. import { useUserStoreHook } from "@/store/modules/user";
  4. export interface DataInfo<T> {
  5. /** token */
  6. accessToken: string;
  7. /** `accessToken`的过期时间(时间戳) */
  8. expires: T;
  9. /** 用于调用刷新accessToken的接口时所需的token */
  10. refreshToken: string;
  11. /** 用户名 */
  12. username?: string;
  13. /** 当前登陆用户的角色 */
  14. roles?: Array<string>;
  15. }
  16. export const userKey = "user-info";
  17. export const TokenKey = "authorized-token";
  18. /**
  19. * 通过`multiple-tabs`是否在`cookie`中,判断用户是否已经登录系统,
  20. * 从而支持多标签页打开已经登录的系统后无需再登录。
  21. * 浏览器完全关闭后`multiple-tabs`将自动从`cookie`中销毁,
  22. * 再次打开浏览器需要重新登录系统
  23. * */
  24. export const multipleTabsKey = "multiple-tabs";
  25. /** 获取`token` */
  26. export function getToken(): DataInfo<number> {
  27. // 此处与`TokenKey`相同,此写法解决初始化时`Cookies`中不存在`TokenKey`报错
  28. return Cookies.get(TokenKey)
  29. ? JSON.parse(Cookies.get(TokenKey))
  30. : storageLocal().getItem(userKey);
  31. }
  32. /**
  33. * @description 设置`token`以及一些必要信息并采用无感刷新`token`方案
  34. * 无感刷新:后端返回`accessToken`(访问接口使用的`token`)、`refreshToken`(用于调用刷新`accessToken`的接口时所需的`token`,`refreshToken`的过期时间(比如30天)应大于`accessToken`的过期时间(比如2小时))、`expires`(`accessToken`的过期时间)
  35. * 将`accessToken`、`expires`这两条信息放在key值为authorized-token的cookie里(过期自动销毁)
  36. * 将`username`、`roles`、`refreshToken`、`expires`这四条信息放在key值为`user-info`的localStorage里(利用`multipleTabsKey`当浏览器完全关闭后自动销毁)
  37. */
  38. export function setToken(data: DataInfo<Date>) {
  39. let expires = 0;
  40. const { accessToken, refreshToken } = data;
  41. const { isRemembered, loginDay } = useUserStoreHook();
  42. expires = new Date(data.expires).getTime(); // 如果后端直接设置时间戳,将此处代码改为expires = data.expires,然后把上面的DataInfo<Date>改成DataInfo<number>即可
  43. const cookieString = JSON.stringify({ accessToken, expires });
  44. expires > 0
  45. ? Cookies.set(TokenKey, cookieString, {
  46. expires: (expires - Date.now()) / 86400000
  47. })
  48. : Cookies.set(TokenKey, cookieString);
  49. Cookies.set(
  50. multipleTabsKey,
  51. "true",
  52. isRemembered
  53. ? {
  54. expires: loginDay
  55. }
  56. : {}
  57. );
  58. function setUserKey(username: string, roles: Array<string>) {
  59. useUserStoreHook().SET_USERNAME(username);
  60. useUserStoreHook().SET_ROLES(roles);
  61. storageLocal().setItem(userKey, {
  62. refreshToken,
  63. expires,
  64. username,
  65. roles
  66. });
  67. }
  68. if (data.username && data.roles) {
  69. const { username, roles } = data;
  70. setUserKey(username, roles);
  71. } else {
  72. const username =
  73. storageLocal().getItem<DataInfo<number>>(userKey)?.username ?? "";
  74. const roles =
  75. storageLocal().getItem<DataInfo<number>>(userKey)?.roles ?? [];
  76. setUserKey(username, roles);
  77. }
  78. }
  79. /** 删除`token`以及key值为`user-info`的localStorage信息 */
  80. export function removeToken() {
  81. Cookies.remove(TokenKey);
  82. Cookies.remove(multipleTabsKey);
  83. storageLocal().removeItem(userKey);
  84. }
  85. /** 格式化token(jwt格式) */
  86. export const formatToken = (token: string): string => {
  87. return "Bearer " + token;
  88. };