🎨 optimized code
This commit is contained in:
@@ -1,76 +0,0 @@
|
||||
import {defineStore} from 'pinia';
|
||||
import {ref} from "vue";
|
||||
|
||||
// const expiresTime: number = 60 * 30; // 自定义过期时间 30 分钟
|
||||
// const expiredStorage: Storage = getExpiredStorage(localStorage, expiresTime);
|
||||
//
|
||||
// function getExpiredStorage(storage: Storage, expiresTime: string | number | Date) {
|
||||
// return {
|
||||
// getItem(key: string) {
|
||||
// const itemStr = storage.getItem(key);
|
||||
// if (!itemStr) {
|
||||
// return null;
|
||||
// }
|
||||
// // 读取的时候是字符串,需要转换为对象
|
||||
// const item = JSON.parse(itemStr);
|
||||
// const now: Date = new Date();
|
||||
// if (now.getTime() > item.expiry) {
|
||||
// storage.removeItem(key);
|
||||
// return null;
|
||||
// }
|
||||
// // pinia 的持久化插件要求返回JSON字符串
|
||||
// return JSON.stringify(item.value);
|
||||
// },
|
||||
// setItem(key: string, value: string) {
|
||||
// const now = new Date();
|
||||
// const item = {
|
||||
// value: JSON.parse(value), // value是JSON字符串,需要转换为对象
|
||||
// expiry: now.getTime() + Number(expiresTime) * 1000,
|
||||
// };
|
||||
// storage.setItem(key, JSON.stringify(item)); // 存储又要转为JSON字符串
|
||||
// },
|
||||
// removeItem(key: string) {
|
||||
// storage.removeItem(key);
|
||||
// },
|
||||
// clear() {
|
||||
// Object.keys(storage).forEach((key: string) => {
|
||||
// storage.removeItem(key);
|
||||
// });
|
||||
// },
|
||||
// key(index: number): string | null {
|
||||
// const keys = Object.keys(storage);
|
||||
// return keys[index] || null;
|
||||
// },
|
||||
// length: Object.keys(storage).length,
|
||||
// } as Storage;
|
||||
// }
|
||||
|
||||
export const useClientStore = defineStore(
|
||||
'clientId',
|
||||
() => {
|
||||
const clientId = ref<string>();
|
||||
|
||||
function setClientId(id: string) {
|
||||
clientId.value = id;
|
||||
}
|
||||
|
||||
function getClientId() {
|
||||
return clientId.value;
|
||||
}
|
||||
|
||||
return {
|
||||
clientId,
|
||||
setClientId,
|
||||
getClientId
|
||||
};
|
||||
},
|
||||
{
|
||||
// 开启数据持久化
|
||||
persist: {
|
||||
key: 'clientId',
|
||||
storage: localStorage,
|
||||
pick: ["clientId"],
|
||||
}
|
||||
}
|
||||
);
|
||||
|
@@ -1,6 +1,12 @@
|
||||
import {defineStore} from 'pinia';
|
||||
import {reactive} from 'vue';
|
||||
|
||||
import {generateClientId} from "@/api/client";
|
||||
import {getGithubUrl} from "@/api/oauth/github.ts";
|
||||
import {getQQUrl} from "@/api/oauth/qq.ts";
|
||||
import {getGiteeUrl} from "@/api/oauth/gitee.ts";
|
||||
import {getUserDevice} from "@/api/user";
|
||||
import message from "@/components/MyUI/Message/Message.vue";
|
||||
import {useI18n} from "vue-i18n";
|
||||
|
||||
export const useAuthStore = defineStore(
|
||||
'user',
|
||||
@@ -13,9 +19,127 @@ export const useAuthStore = defineStore(
|
||||
avatar: '',
|
||||
status: '',
|
||||
});
|
||||
const clientId = ref<string>('');
|
||||
const githubRedirectUrl = ref<string>('');
|
||||
const giteeRedirectUrl = ref<string>('');
|
||||
const qqRedirectUrl = ref<string>('');
|
||||
const router = useRouter();
|
||||
const {t} = useI18n();
|
||||
|
||||
/**
|
||||
* Get the redirect url of Github OAuth
|
||||
*/
|
||||
async function getGithubRedirectUrl() {
|
||||
const res: any = await getGithubUrl(clientId.value);
|
||||
if (res.code === 200 && res.data) {
|
||||
githubRedirectUrl.value = res.data;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the redirect url of Gitee OAuth
|
||||
*/
|
||||
async function getGiteeRedirectUrl() {
|
||||
const res: any = await getGiteeUrl();
|
||||
if (res.code === 200 && res.data) {
|
||||
giteeRedirectUrl.value = res.data;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the redirect url of QQ OAuth
|
||||
*/
|
||||
async function getQQRedirectUrl() {
|
||||
const res: any = await getQQUrl(clientId.value);
|
||||
if (res.code === 200 && res.data) {
|
||||
qqRedirectUrl.value = res.data;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取client_id
|
||||
*/
|
||||
async function getClientId() {
|
||||
const res: any = await generateClientId();
|
||||
if (res.code === 200 && res.data) {
|
||||
clientId.value = res.data;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理消息
|
||||
* @param e
|
||||
*/
|
||||
const messageHandler = async (e: any) => {
|
||||
if (typeof e.data === 'string') {
|
||||
const res: any = JSON.parse(e.data);
|
||||
if (res.code === 200 && res.data) {
|
||||
user.uid = res.data.uid;
|
||||
user.access_token = res.data.access_token;
|
||||
user.username = res.data.username;
|
||||
user.avatar = res.data.avatar;
|
||||
user.nickname = res.data.nickname;
|
||||
user.status = res.data.status;
|
||||
await getUserDevice();
|
||||
message.success(t('login.loginSuccess'));
|
||||
window.removeEventListener("message", messageHandler);
|
||||
setTimeout(() => {
|
||||
router.push('/main');
|
||||
}, 1000);
|
||||
} else {
|
||||
message.error(t('login.loginError'));
|
||||
window.removeEventListener("message", messageHandler);
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
function openGithubUrl() {
|
||||
const iWidth = 800; //弹出窗口的宽度;
|
||||
const iHeight = 500; //弹出窗口的高度;
|
||||
//window.screen.height获得屏幕的高,window.screen.width获得屏幕的宽
|
||||
const iTop = (window.screen.height - 30 - iHeight) / 2; //获得窗口的垂直位置;
|
||||
const iLeft = (window.screen.width - 10 - iWidth) / 2; //获得窗口的水平位置;
|
||||
window.open(githubRedirectUrl.value, 'newwindow', 'height=' + iHeight + ',innerHeight=' + iHeight + ',width=' + iWidth + ',innerWidth=' + iWidth + ',top=' + iTop + ',left=' + iLeft + ',toolbar=no,menubar=no,scrollbars=auto,resizable=no,location=no,status=no');
|
||||
window.addEventListener("message", messageHandler);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Open the Gitee OAuth page in a new window
|
||||
*/
|
||||
function openGiteeUrl() {
|
||||
const iWidth = 800; //弹出窗口的宽度;
|
||||
const iHeight = 500; //弹出窗口的高度;
|
||||
//window.screen.height获得屏幕的高,window.screen.width获得屏幕的宽
|
||||
const iTop = (window.screen.height - 30 - iHeight) / 2; //获得窗口的垂直位置;
|
||||
const iLeft = (window.screen.width - 10 - iWidth) / 2; //获得窗口的水平位置;
|
||||
window.open(giteeRedirectUrl.value, '_blank', 'height=' + iHeight + ',innerHeight=' + iHeight + ',width=' + iWidth + ',innerWidth=' + iWidth + ',top=' + iTop + ',left=' + iLeft + ',toolbar=no,menubar=no,scrollbars=auto,resizable=no,location=no,status=no');
|
||||
window.addEventListener("message", messageHandler);
|
||||
}
|
||||
|
||||
|
||||
function openQQUrl() {
|
||||
const iWidth = 800; //弹出窗口的宽度;
|
||||
const iHeight = 500; //弹出窗口的高度;
|
||||
//window.screen.height获得屏幕的高,window.screen.width获得屏幕的宽
|
||||
const iTop = (window.screen.height - 30 - iHeight) / 2; //获得窗口的垂直位置;
|
||||
const iLeft = (window.screen.width - 10 - iWidth) / 2; //获得窗口的水平位置;
|
||||
window.open(qqRedirectUrl.value, 'newwindow', 'height=' + iHeight + ',innerHeight=' + iHeight + ',width=' + iWidth + ',innerWidth=' + iWidth + ',top=' + iTop + ',left=' + iLeft + ',toolbar=no,menubar=no,scrollbars=auto,resizable=no,location=no,status=no');
|
||||
window.addEventListener("message", messageHandler);
|
||||
}
|
||||
|
||||
|
||||
return {
|
||||
user,
|
||||
clientId,
|
||||
getGithubRedirectUrl,
|
||||
getGiteeRedirectUrl,
|
||||
getQQRedirectUrl,
|
||||
getClientId,
|
||||
openGithubUrl,
|
||||
openGiteeUrl,
|
||||
openQQUrl,
|
||||
};
|
||||
},
|
||||
{
|
||||
@@ -23,7 +147,7 @@ export const useAuthStore = defineStore(
|
||||
persist: {
|
||||
key: 'user',
|
||||
storage: localStorage,
|
||||
pick: ['user'],
|
||||
pick: ['user', "clientId", "githubRedirectUrl", "giteeRedirectUrl", "qqRedirectUrl"],
|
||||
}
|
||||
}
|
||||
);
|
||||
|
Reference in New Issue
Block a user