diff --git a/.env.development b/.env.development
index fe5c2e8..cc6dd92 100644
--- a/.env.development
+++ b/.env.development
@@ -14,7 +14,7 @@ VITE_API_BASE_URL='http://127.0.0.1:3000'
VITE_TITLE_NAME='五味子云存储'
# token key
-VITE_APP_TOKEN_KEY='token'
+VITE_APP_TOKEN_KEY='schisandra'
# the upload url
VITE_UPLOAD_URL='http://127.0.0.1:3000'
diff --git a/src/api/user/index.ts b/src/api/user/index.ts
index 7c66f75..41a7eca 100644
--- a/src/api/user/index.ts
+++ b/src/api/user/index.ts
@@ -21,12 +21,4 @@ export const oauthLogin = (type: string) => {
method: "get",
});
};
-/**
- * 获取用户信息
- */
-export const geOauthtUserInfo = () => {
- return web.request({
- url: "/oauth/userInfo/",
- method: "get",
- });
-};
+
diff --git a/src/components/LoadingPage/index.tsx b/src/components/LoadingPage/index.tsx
index ef0ae31..0a986a6 100644
--- a/src/components/LoadingPage/index.tsx
+++ b/src/components/LoadingPage/index.tsx
@@ -1,27 +1,24 @@
/** @format */
-import React, { useEffect } from "react";
+import { useEffect } from "react";
import "./index.less";
-import { geOauthtUserInfo } from "@/api/user";
-import localforage from "localforage";
-
-const LoadingPage: React.FC = () => {
- async function getUserInfo() {
- const res: any = await geOauthtUserInfo();
- localforage.setItem("token", res.data.token).then();
- localforage.setItem("userId", res.data.userId).then();
- }
+import { useNavigate, useSearchParams } from "react-router-dom";
+import useStore from "@/utils/store/useStore.tsx";
+import { observer } from "mobx-react";
+const LoadingPage = () => {
+ const [search] = useSearchParams();
+ const navigate = useNavigate();
+ const token: any = search.get("token");
+ const userId: any = search.get("userId");
+ const store = useStore("user");
+ store.setToken(token);
+ store.setUserId(userId);
useEffect(() => {
document.body.classList.add("loading-body");
- getUserInfo().then(() => {
- if (
- localforage.getItem("token").then() !== null &&
- localforage.getItem("userId").then() !== null
- ) {
- window.location.href = "/main";
- }
- });
+ if (store.getToken() !== null && store.getUserId() !== null) {
+ navigate("/main");
+ }
return () => {
document.body.classList.remove("loading-body");
};
@@ -70,4 +67,4 @@ const LoadingPage: React.FC = () => {
>
);
};
-export default React.memo(LoadingPage);
+export default observer(LoadingPage);
diff --git a/src/router/index.ts b/src/router/index.ts
index 44cc720..bd09ac0 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -33,7 +33,7 @@ const routes: RouteObject[] = [
},
{
path: "/loading",
- Component: (props) => ComponentLoading(Loading, props),
+ Component: Loading,
},
];
diff --git a/src/router/modules/main/index.ts b/src/router/modules/main/index.ts
index 16548a1..a79839c 100644
--- a/src/router/modules/main/index.ts
+++ b/src/router/modules/main/index.ts
@@ -1,9 +1,11 @@
-import { lazy } from 'react'
+/** @format */
+
+import { lazy } from "react";
const main = lazy(
- () =>
- new Promise((resolve: any) => {
- setTimeout(() => resolve(import('@/views/Main')), 1000)
- }),
-)
-export default main
+ () =>
+ new Promise((resolve: any) => {
+ setTimeout(() => resolve(import("@/views/Main")), 1000);
+ }),
+);
+export default main;
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index 4059444..17f9811 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,26 +1,28 @@
/** @format */
-import { action, makeAutoObservable } from "mobx";
-import { makePersistable, isHydrated } from "mobx-persist-store";
+import { action, makeObservable, observable } from "mobx";
+import { isHydrated, makePersistable } from "mobx-persist-store";
import { handleLocalforage } from "@/utils/localforage";
export class useUserStore {
- token: any = "";
+ token: string = "";
+ userId: string = "";
constructor() {
- makeAutoObservable(
- this,
- {
- setToken: action,
- },
- { autoBind: true },
- );
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
- // @ts-ignore
+ // makeAutoObservable(this);
+ makeObservable(this, {
+ token: observable,
+ userId: observable,
+ setToken: action,
+ setUserId: action,
+ getToken: action,
+ getUserId: action,
+ isHydrated: action,
+ });
makePersistable(this, {
// 在构造函数内使用 makePersistable
- name: "token", // 保存的name,用于在storage中的名称标识,只要不和storage中其他名称重复就可以
- properties: ["token"], // 要保存的字段,这些字段会被保存在name对应的storage中,注意:不写在这里面的字段将不会被保存,刷新页面也将丢失:get字段例外。get数据会在数据返回后再自动计算
+ name: "userInfo", // 保存的name,用于在storage中的名称标识,只要不和storage中其他名称重复就可以
+ properties: ["token", "userId"], // 要保存的字段,这些字段会被保存在name对应的storage中,注意:不写在这里面的字段将不会被保存,刷新页面也将丢失:get字段例外。get数据会在数据返回后再自动计算
storage: handleLocalforage, // 保存的位置:看自己的业务情况选择,可以是localStorage,sessionstorage
// 。。还有一些其他配置参数,例如数据过期时间等等,可以康康文档,像storage这种字段可以配置在全局配置里,详见文档
}).then(
@@ -31,15 +33,23 @@ export class useUserStore {
);
}
- get getToken() {
+ getToken() {
return this.token ? this.token : null;
}
- get isHydrated() {
+ getUserId() {
+ return this.userId ? this.userId : null;
+ }
+
+ isHydrated() {
return isHydrated(this);
}
setToken(token: string) {
this.token = token;
}
+
+ setUserId(userId: string) {
+ this.userId = userId;
+ }
}
diff --git a/src/utils/axios/web.ts b/src/utils/axios/web.ts
index 69e56a4..be12010 100644
--- a/src/utils/axios/web.ts
+++ b/src/utils/axios/web.ts
@@ -3,13 +3,11 @@
import Request from "./request";
import { handleLocalforage } from "@/utils/localforage";
-const token = String(handleLocalforage.getItem("token"));
+const token = handleLocalforage.getItem("token").then();
const web: Request = new Request({
baseURL: import.meta.env.VITE_APP_BASE_API,
headers: {
- // 'Content-Type': 'application/json;charset=utf-8',
- // Accept: 'application/json',
- Authorization: token,
+ token: import.meta.env.VITE_APP_TOKEN_KEY + " " + token,
},
});
diff --git a/src/utils/encrypt/encrypt.ts b/src/utils/encrypt/encrypt.ts
index 5f2d073..568c3a4 100644
--- a/src/utils/encrypt/encrypt.ts
+++ b/src/utils/encrypt/encrypt.ts
@@ -4,26 +4,28 @@ import CryptoJS from "crypto-js";
const key = CryptoJS.enc.Hex.parse("d86d7bab3d6ac01ad9dc6a897652f2d2");
// const iv = CryptoJS.enc.Latin1.parse("d86d7bab3d6ac01ad9dc6a897652f2d2");
-// 加密
+/**
+ * 加密
+ * @param data
+ */
function EncryptData(data: any) {
- const srcs = CryptoJS.enc.Utf8.parse(data);
- const encrypted = CryptoJS.AES.encrypt(srcs, key, {
+ const src = CryptoJS.enc.Utf8.parse(data);
+ const encrypted = CryptoJS.AES.encrypt(src, key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7,
});
return encrypted.toString();
}
-// 解密
+/**
+ * 解密
+ * @param data
+ */
function DecryptData(data: any) {
- // const stime = new Date().getTime();
const decrypt = CryptoJS.AES.decrypt(data, key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7,
});
- const result = JSON.parse(CryptoJS.enc.Utf8.stringify(decrypt).toString());
- // const etime = new Date().getTime();
- // console.log("DecryptData Time:" + (etime - stime));
- return result;
+ return JSON.parse(CryptoJS.enc.Utf8.stringify(decrypt).toString());
}
export { EncryptData, DecryptData };
diff --git a/src/views/Main/index.tsx b/src/views/Main/index.tsx
index 454a203..275a498 100644
--- a/src/views/Main/index.tsx
+++ b/src/views/Main/index.tsx
@@ -1,11 +1,14 @@
/** @format */
import DefaultLayOut from "@/layout/default";
+import { useEffect } from "react";
+import { observer } from "mobx-react";
-export default () => {
+export default observer(() => {
+ useEffect(() => {}, []);
return (
<>
>
);
-};
+});
diff --git a/src/views/User/Login/index.tsx b/src/views/User/Login/index.tsx
index 1b65bc9..939e8ce 100644
--- a/src/views/User/Login/index.tsx
+++ b/src/views/User/Login/index.tsx
@@ -10,9 +10,8 @@ import {
WechatOutlined,
} from "@ant-design/icons";
import { ProFormCaptcha, ProFormCheckbox, ProFormText } from "@ant-design/pro-components";
-import { Divider, Space, Tabs, message, Image, Alert, Form, Button } from "antd";
-import { CSSProperties, useRef } from "react";
-import { useState } from "react";
+import { Alert, Button, Divider, Form, Image, message, Space, Tabs } from "antd";
+import { CSSProperties, useRef, useState } from "react";
import logo from "@/assets/icons/schisandra.svg";
import qrCode from "@/assets/images/login_qrcode-landaiqing.jpg";
import styles from "./index.module.less";
@@ -351,6 +350,9 @@ export default observer(() => {
borderRadius: "50%",
}}>
{
+ oAuthLogin("github").then();
+ }}
style={{ ...iconStyles, color: "#333333" }}
/>
@@ -367,7 +369,7 @@ export default observer(() => {
}}>
{
- oAuthLogin("GITEE").then();
+ oAuthLogin("gitee").then();
}}
style={{ ...iconStyles, color: "#FF6A10" }}
/>