diff --git a/change/@acedatacloud-nexior-e748743e-a214-4d17-b505-4bb106dbfcdc.json b/change/@acedatacloud-nexior-e748743e-a214-4d17-b505-4bb106dbfcdc.json
new file mode 100644
index 00000000..ee58dc25
--- /dev/null
+++ b/change/@acedatacloud-nexior-e748743e-a214-4d17-b505-4bb106dbfcdc.json
@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "optimize auth flow",
+  "packageName": "@acedatacloud/nexior",
+  "email": "office@acedata.cloud",
+  "dependentChangeType": "patch"
+}
diff --git a/src/App.vue b/src/App.vue
index 6cb7f6b5..445070ac 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,7 +1,6 @@
 <template>
   <el-config-provider :locale="locale">
     <router-view />
-    <auth-panel />
   </el-config-provider>
 </template>
 
@@ -9,12 +8,10 @@
 import { defineComponent } from 'vue';
 import { ElConfigProvider } from 'element-plus';
 import zhCn from 'element-plus/dist/locale/zh-cn.mjs';
-import AuthPanel from './components/common/AuthPanel.vue';
 
 export default defineComponent({
   components: {
-    ElConfigProvider,
-    AuthPanel
+    ElConfigProvider
   },
   data() {
     return {
diff --git a/src/components/common/Navigator.vue b/src/components/common/Navigator.vue
index 05d33436..1a1c020b 100644
--- a/src/components/common/Navigator.vue
+++ b/src/components/common/Navigator.vue
@@ -97,7 +97,6 @@ import {
   ROUTE_PROFILE_INDEX,
   ROUTE_DISTRIBUTION_INDEX,
   ROUTE_INDEX,
-  ROUTE_MIDJOURNEY_HISTORY,
   ROUTE_MIDJOURNEY_INDEX,
   ROUTE_QRART_INDEX,
   ROUTE_QRART_HISTORY,
@@ -150,7 +149,7 @@ export default defineComponent({
           },
           displayName: this.$t('common.nav.midjourney'),
           icon: 'fa-solid fa-palette',
-          routes: [ROUTE_MIDJOURNEY_INDEX, ROUTE_MIDJOURNEY_HISTORY]
+          routes: [ROUTE_MIDJOURNEY_INDEX]
         });
       }
 
@@ -201,16 +200,6 @@ export default defineComponent({
         !this.$store?.state?.site?.distribution?.force_inviter_id ||
         this.$store.getters.user?.id === this.$store?.state?.site?.distribution?.force_inviter_id
       );
-    },
-    collapsed: {
-      get() {
-        return this.$store.state.setting?.navigationCollapsed;
-      },
-      set(val: boolean) {
-        this.$store.commit('setSetting', {
-          navigationCollapsed: val
-        });
-      }
     }
   },
   methods: {
@@ -229,18 +218,8 @@ export default defineComponent({
         name: ROUTE_DISTRIBUTION_INDEX
       });
     },
-    async onOpenMenu() {
-      this.collapsed = false;
-    },
-    async onCollapseMenu() {
-      this.collapsed = true;
-    },
     async onLogout() {
-      await this.$store.dispatch('resetAll');
-      await this.$store.dispatch('chat/resetAll');
-      await this.$store.dispatch('midjourney/resetAll');
-      await this.$store.dispatch('chatdoc/resetAll');
-      await this.$store.dispatch('qrart/resetAll');
+      await this.$store.dispatch('logout');
     },
     onConsole() {
       this.$router.push({ name: ROUTE_CONSOLE_ROOT });
diff --git a/src/components/midjourney/tasks/TaskList.vue b/src/components/midjourney/tasks/TaskList.vue
index 39eae70c..9ef54e9c 100644
--- a/src/components/midjourney/tasks/TaskList.vue
+++ b/src/components/midjourney/tasks/TaskList.vue
@@ -31,7 +31,6 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import TaskItem from './TaskItem.vue';
-import { ROUTE_MIDJOURNEY_HISTORY } from '@/router';
 import { ElSkeleton, ElSkeletonItem } from 'element-plus';
 import { Status } from '@/models';
 
@@ -49,9 +48,6 @@ export default defineComponent({
     };
   },
   computed: {
-    loading() {
-      return this.$store.state.midjourney.status.getApplication === Status.Request;
-    },
     tasks() {
       // eslint-disable-next-line vue/no-side-effects-in-computed-properties
       return this.$store.state.midjourney.tasks?.items?.reverse();
@@ -59,42 +55,6 @@ export default defineComponent({
     application() {
       return this.$store.state.midjourney.application;
     }
-  },
-  watch: {
-    tasks: {
-      handler(val, oldVal) {
-        if (val && oldVal && JSON.stringify(val) !== JSON.stringify(oldVal)) {
-          this.$emit('refresh', val);
-        }
-      },
-      deep: true
-    }
-  },
-  async mounted() {
-    await this.$store.dispatch('midjourney/setTasks', undefined);
-    this.getTasks();
-    // @ts-ignore
-    this.job = setInterval(() => {
-      this.getTasks();
-    }, 5000);
-  },
-  unmounted() {
-    clearInterval(this.job);
-  },
-  methods: {
-    async onLoadHistory() {
-      this.$router.push({ name: ROUTE_MIDJOURNEY_HISTORY });
-    },
-    async getTasks() {
-      // ensure that the previous request has been completed
-      if (this.loading) {
-        return;
-      }
-      await this.$store.dispatch('midjourney/getTasks', {
-        limit: 30,
-        offset: 0
-      });
-    }
   }
 });
 </script>
diff --git a/src/components/qrart/RecentPanel.vue b/src/components/qrart/RecentPanel.vue
index a9e72656..64b4fbfe 100644
--- a/src/components/qrart/RecentPanel.vue
+++ b/src/components/qrart/RecentPanel.vue
@@ -47,9 +47,6 @@ export default defineComponent({
     };
   },
   computed: {
-    loading() {
-      return this.$store.state.qrart?.status?.getApplication === Status.Request;
-    },
     tasks() {
       // reverse the order of the tasks.items
       return {
@@ -57,39 +54,6 @@ export default defineComponent({
         items: this.$store.state.qrart?.tasks?.items?.slice().reverse()
       };
     }
-  },
-  async mounted() {
-    await this.$store.dispatch('qrart/setTasks', undefined);
-    await this.getTasks();
-    await this.onScrollDown();
-    // @ts-ignore
-    this.job = setInterval(() => {
-      this.getTasks();
-    }, 5000);
-  },
-  async unmounted() {
-    clearInterval(this.job);
-  },
-  methods: {
-    async onScrollDown() {
-      setTimeout(() => {
-        // scroll to bottom for `.recent`
-        const el = document.querySelector('.recent');
-        if (el) {
-          el.scrollTop = el.scrollHeight;
-        }
-      }, 500);
-    },
-    async getTasks() {
-      // ensure that the previous request has been completed
-      if (this.loading) {
-        return;
-      }
-      await this.$store.dispatch('qrart/getTasks', {
-        limit: 50,
-        offset: 0
-      });
-    }
   }
 });
 </script>
diff --git a/src/layouts/Chat.vue b/src/layouts/Chat.vue
index 2a17c002..b25ff03e 100644
--- a/src/layouts/Chat.vue
+++ b/src/layouts/Chat.vue
@@ -35,22 +35,6 @@ export default defineComponent({
     return {
       drawer: false
     };
-  },
-  async mounted() {
-    await this.onGetService();
-    await this.onGetApplication();
-    await this.onGetConversations();
-  },
-  methods: {
-    async onGetService() {
-      await this.$store.dispatch('chat/getService');
-    },
-    async onGetApplication() {
-      await this.$store.dispatch('chat/getApplication');
-    },
-    async onGetConversations() {
-      await this.$store.dispatch('chat/getConversations');
-    }
   }
 });
 </script>
diff --git a/src/layouts/Midjourney.vue b/src/layouts/Midjourney.vue
index 9fc73f4a..58cd791e 100644
--- a/src/layouts/Midjourney.vue
+++ b/src/layouts/Midjourney.vue
@@ -29,21 +29,8 @@ export default defineComponent({
   },
   data() {
     return {
-      drawer: false,
-      drawer2: false
+      drawer: false
     };
-  },
-  async mounted() {
-    await this.onGetService();
-    await this.onGetApplication();
-  },
-  methods: {
-    async onGetService() {
-      await this.$store.dispatch('midjourney/getService');
-    },
-    async onGetApplication() {
-      await this.$store.dispatch('midjourney/getApplication');
-    }
   }
 });
 </script>
diff --git a/src/layouts/Qrart.vue b/src/layouts/Qrart.vue
index 92758d23..20606ef1 100644
--- a/src/layouts/Qrart.vue
+++ b/src/layouts/Qrart.vue
@@ -31,18 +31,6 @@ export default defineComponent({
     return {
       drawer: false
     };
-  },
-  async mounted() {
-    await this.onGetService();
-    await this.onGetApplication();
-  },
-  methods: {
-    async onGetService() {
-      await this.$store.dispatch('qrart/getService');
-    },
-    async onGetApplication() {
-      await this.$store.dispatch('qrart/getApplication');
-    }
   }
 });
 </script>
diff --git a/src/main.ts b/src/main.ts
index ec414b2b..e8694d67 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -13,6 +13,8 @@ import {
   initializeCookies,
   initializeDescription,
   initializeFavicon,
+  initializeToken,
+  initializeUser,
   initializeKeywords,
   initializeSite,
   initializeTitle
@@ -20,6 +22,8 @@ import {
 
 const main = async () => {
   await initializeCookies();
+  await initializeToken();
+  await initializeUser();
   await initializeSite();
   await initializeTitle();
   await initializeDescription();
diff --git a/src/operators/common.ts b/src/operators/common.ts
index bcc422dd..92d040b9 100644
--- a/src/operators/common.ts
+++ b/src/operators/common.ts
@@ -28,7 +28,7 @@ httpClient.interceptors.response.use(
   },
   (error) => {
     if (error?.response?.status === 401) {
-      store.dispatch('resetToken');
+      store.dispatch('login');
     }
     return Promise.reject(error);
   }
diff --git a/src/pages/auth/Callback.vue b/src/pages/auth/Callback.vue
index 688c3c71..483da9c8 100644
--- a/src/pages/auth/Callback.vue
+++ b/src/pages/auth/Callback.vue
@@ -1,46 +1,20 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { IUser, IToken } from '@/models';
 
 interface IData {
-  accessToken: string | undefined;
-  refreshToken: string | undefined;
   redirect: string | undefined;
-  code: string | undefined;
-  user: IUser | undefined;
 }
 
 export default defineComponent({
   name: 'AuthCallback',
   data(): IData {
     return {
-      accessToken: undefined,
-      refreshToken: undefined,
-      redirect: this.$route.query.redirect?.toString(),
-      code: this.$route.query.code?.toString(),
-      user: undefined
+      redirect: this.$route.query.redirect?.toString()
     };
   },
   async mounted() {
-    // if auth code is provided, get token via oauth
-    if (this.code) {
-      const data: IToken = await this.$store.dispatch('getToken', this.code);
-      this.accessToken = data.access;
-      this.refreshToken = data.refresh;
-    } else {
-      this.$store.dispatch('resetToken');
-      return;
-    }
-    // if token acquired, get user info
-    if (this.accessToken && this.refreshToken) {
-      const user = await this.$store.dispatch('getUser');
-      this.user = user;
-      if (this.redirect) {
-        await this.$router.push(this.redirect);
-      }
-    } else {
-      // reset token and trigger popup login window
-      this.$store.dispatch('resetToken');
+    if (this.redirect) {
+      await this.$router.push(this.redirect);
     }
   }
 });
diff --git a/src/pages/auth/Login.vue b/src/pages/auth/Login.vue
index ac740c2c..1c4f3298 100644
--- a/src/pages/auth/Login.vue
+++ b/src/pages/auth/Login.vue
@@ -1,5 +1,5 @@
 <script lang="ts">
-import { getBaseUrlAuth, getBaseUrlHub } from '@/utils';
+import { login } from '@/utils';
 import { defineComponent } from 'vue';
 
 interface IData {
@@ -14,13 +14,7 @@ export default defineComponent({
     };
   },
   async mounted() {
-    const hubBaseUrl = getBaseUrlHub();
-    const authBaseUrl = getBaseUrlAuth();
-    // callback url used to init access token and then redirect back of `redirect`
-    const callbackUrl = `${hubBaseUrl}/auth/callback?redirect=${this.redirect}`;
-    // redirect to auth service to get access token then redirect back
-    const targetUrl = `${authBaseUrl}/auth/login?redirect=${callbackUrl}`;
-    window.location.href = targetUrl;
+    login(this.redirect);
   },
   methods: {}
 });
diff --git a/src/pages/chat/Conversation.vue b/src/pages/chat/Conversation.vue
index 3cfdd318..155cdd38 100644
--- a/src/pages/chat/Conversation.vue
+++ b/src/pages/chat/Conversation.vue
@@ -128,10 +128,28 @@ export default defineComponent({
       }
     }
   },
-  mounted() {
-    this.onScrollDown();
+  async mounted() {
+    await this.onGetService();
+    await this.onGetApplication();
+    await this.onGetConversations();
+    await this.onScrollDown();
   },
   methods: {
+    async onGetService() {
+      console.debug('start onGetService');
+      await this.$store.dispatch('chat/getService');
+      console.debug('end onGetService');
+    },
+    async onGetApplication() {
+      console.debug('start onGetApplication');
+      await this.$store.dispatch('chat/getApplication');
+      console.debug('end onGetApplication');
+    },
+    async onGetConversations() {
+      console.debug('start onGetConversations');
+      await this.$store.dispatch('chat/getConversations');
+      console.debug('end onGetConversations');
+    },
     async onDraft(question: string) {
       this.question = question;
       this.onSubmit();
diff --git a/src/pages/midjourney/Index.vue b/src/pages/midjourney/Index.vue
index e49aa2c6..329bbe45 100644
--- a/src/pages/midjourney/Index.vue
+++ b/src/pages/midjourney/Index.vue
@@ -12,7 +12,7 @@
           :need-apply="needApply"
           @refresh="onGetApplication"
         />
-        <task-list @custom="onCustom" @refresh="onGetApplication" />
+        <task-list @custom="onCustom" />
       </div>
       <div class="bottom">
         <el-card v-show="operating" class="operations">
@@ -66,6 +66,7 @@ interface IData {
   ignore: string;
   references: string[];
   operating: boolean;
+  job: number;
 }
 
 const CALLBACK_URL = 'https://webhook.acedata.cloud/midjourney';
@@ -90,7 +91,8 @@ export default defineComponent({
       elements: [],
       ignore: '',
       references: [],
-      operating: false
+      operating: false,
+      job: 0
     };
   },
   computed: {
@@ -106,6 +108,9 @@ export default defineComponent({
     preset() {
       return this.$store.state.midjourney.preset;
     },
+    loading() {
+      return this.$store.state.midjourney.status.getApplication === Status.Request;
+    },
     initializing() {
       return this.$store.state.midjourney.status.getApplication === Status.Request;
     },
@@ -198,7 +203,31 @@ export default defineComponent({
       deep: true
     }
   },
+  async mounted() {
+    await this.onGetService();
+    await this.onGetApplication();
+    await this.onScrollDown();
+    await this.onGetTasks();
+    await this.onScrollDown();
+    // @ts-ignore
+    this.job = setInterval(() => {
+      this.onGetTasks();
+    }, 5000);
+  },
+  async unmounted() {
+    clearInterval(this.job);
+  },
   methods: {
+    async onGetService() {
+      console.debug('start onGetService');
+      await this.$store.dispatch('midjourney/getService');
+      console.debug('end onGetService');
+    },
+    async onGetApplication() {
+      console.debug('start onGetApplication');
+      await this.$store.dispatch('midjourney/getApplication');
+      console.debug('end onGetApplication');
+    },
     onApply() {
       applicationOperator
         .create({
@@ -215,9 +244,6 @@ export default defineComponent({
           }
         });
     },
-    async onGetApplication() {
-      await this.$store.dispatch('midjourney/getApplication');
-    },
     async onStartTask(request: IMidjourneyImagineRequest) {
       const token = this.credential?.token;
       if (!token) {
@@ -236,7 +262,7 @@ export default defineComponent({
           ElMessage.error(this.$t('midjourney.message.startTaskFailed'));
         })
         .finally(async () => {
-          await this.onSyncTasks();
+          await this.onGetTasks();
           await this.onScrollDown();
         });
     },
@@ -271,7 +297,11 @@ export default defineComponent({
         }
       }, 500);
     },
-    async onSyncTasks() {
+    async onGetTasks() {
+      if (this.loading) {
+        console.debug('loading');
+        return;
+      }
       await this.$store.dispatch('midjourney/getTasks', {
         limit: 30,
         offset: 0
diff --git a/src/pages/qrart/Index.vue b/src/pages/qrart/Index.vue
index 6931237f..acbf91ed 100644
--- a/src/pages/qrart/Index.vue
+++ b/src/pages/qrart/Index.vue
@@ -35,6 +35,7 @@ const CALLBACK_URL = 'https://webhook.acedata.cloud/qrart';
 
 interface IData {
   task: IQrartTask | undefined;
+  job: number;
 }
 
 export default defineComponent({
@@ -48,10 +49,14 @@ export default defineComponent({
   },
   data(): IData {
     return {
-      task: undefined
+      task: undefined,
+      job: 0
     };
   },
   computed: {
+    loading() {
+      return this.$store.state.qrart?.status?.getApplication === Status.Request;
+    },
     service() {
       return this.$store.state.qrart.service;
     },
@@ -71,7 +76,31 @@ export default defineComponent({
       return this.$store.state.qrart.application;
     }
   },
+  async mounted() {
+    await this.onGetService();
+    await this.onGetApplication();
+    await this.onScrollDown();
+    await this.onGetTasks();
+    await this.onScrollDown();
+    // @ts-ignore
+    this.job = setInterval(() => {
+      this.onGetTasks();
+    }, 5000);
+  },
+  async unmounted() {
+    clearInterval(this.job);
+  },
   methods: {
+    async onGetService() {
+      console.debug('start onGetService');
+      await this.$store.dispatch('qrart/getService');
+      console.debug('end onGetService');
+    },
+    async onGetApplication() {
+      console.debug('start onGetApplication');
+      await this.$store.dispatch('qrart/getApplication');
+      console.debug('end onGetApplication');
+    },
     onApply() {
       applicationOperator
         .create({
@@ -88,9 +117,6 @@ export default defineComponent({
           }
         });
     },
-    async onGetApplication() {
-      await this.$store.dispatch('qrart/getApplication');
-    },
     async onScrollDown() {
       setTimeout(() => {
         // scroll to bottom for `.tasks`
@@ -100,6 +126,16 @@ export default defineComponent({
         }
       }, 500);
     },
+    async onGetTasks() {
+      if (this.loading) {
+        console.debug('loading');
+        return;
+      }
+      await this.$store.dispatch('qrart/getTasks', {
+        limit: 30,
+        offset: 0
+      });
+    },
     async onGenerate() {
       const request = {
         type: this.config?.type,
@@ -142,10 +178,7 @@ export default defineComponent({
           ElMessage.error(this.$t('qrart.message.startTaskFailed'));
         })
         .finally(async () => {
-          await this.$store.dispatch('qrart/getTasks', {
-            limit: 50,
-            offset: 0
-          });
+          await this.onGetTasks();
           await this.onScrollDown();
         });
     }
diff --git a/src/router/constants.ts b/src/router/constants.ts
index a6eb7069..527c03b3 100644
--- a/src/router/constants.ts
+++ b/src/router/constants.ts
@@ -9,7 +9,6 @@ export const ROUTE_CHAT_CONVERSATION = 'chat-conversation';
 export const ROUTE_CHAT_CONVERSATION_NEW = 'chat-conversation-new';
 
 export const ROUTE_MIDJOURNEY_INDEX = 'midjourney-index';
-export const ROUTE_MIDJOURNEY_HISTORY = 'midjourney-history';
 
 export const ROUTE_QRART_INDEX = 'qrart-index';
 export const ROUTE_QRART_HISTORY = 'qrart-history';
diff --git a/src/store/chat/models.ts b/src/store/chat/models.ts
index 7b2bfb87..e0d7738f 100644
--- a/src/store/chat/models.ts
+++ b/src/store/chat/models.ts
@@ -1,7 +1,7 @@
 import { IApplication, IChatConversation, IChatModel, ICredential, IService, Status } from '@/models';
 
 export interface IChatState {
-  model: IChatModel;
+  model: IChatModel | undefined;
   application: IApplication | undefined;
   service: IService | undefined;
   conversations: IChatConversation[] | undefined;
diff --git a/src/store/chat/mutations.ts b/src/store/chat/mutations.ts
index eeeae31f..ab09ae56 100644
--- a/src/store/chat/mutations.ts
+++ b/src/store/chat/mutations.ts
@@ -4,6 +4,9 @@ import { IChatState } from './models';
 export const resetAll = (state: IChatState): void => {
   state.application = undefined;
   state.conversations = undefined;
+  state.credential = undefined;
+  state.service = undefined;
+  state.model = undefined;
 };
 
 export const setModel = (state: IChatState, payload: IChatModel): void => {
diff --git a/src/store/common/actions.ts b/src/store/common/actions.ts
index 1ad7dd63..d7a84b1d 100644
--- a/src/store/common/actions.ts
+++ b/src/store/common/actions.ts
@@ -4,11 +4,11 @@ import { userOperator, oauthOperator, siteOperator } from '@/operators';
 import { log } from '@/utils/log';
 import { IToken, IUser } from '@/models';
 import { getSiteOrigin } from '@/utils/site';
+import { login as authLogin } from '@/utils';
 
 export const resetAll = ({ commit }: ActionContext<IRootState, IRootState>) => {
   commit('resetToken');
   commit('resetUser');
-  commit('resetSetting');
   commit('resetSite');
 };
 
@@ -16,10 +16,6 @@ export const resetUser = ({ commit }: ActionContext<IRootState, IRootState>) =>
   commit('resetUser');
 };
 
-export const resetSetting = ({ commit }: ActionContext<IRootState, IRootState>) => {
-  commit('resetSetting');
-};
-
 export const resetSite = ({ commit }: ActionContext<IRootState, IRootState>) => {
   commit('resetSite');
 };
@@ -38,28 +34,36 @@ export const setUser = ({ commit }: ActionContext<IRootState, IRootState>, paylo
 
 export const getUser = async ({ commit }: ActionContext<IRootState, IRootState>): Promise<IUser> => {
   log(getUser, 'start to get user');
-  const { data: user } = await userOperator.getMe();
-  commit('setUser', user);
-  log(getUser, 'get user success', user);
-  return user;
+  try {
+    const { data: user } = await userOperator.getMe();
+    commit('setUser', user);
+    log(getUser, 'get user success', user);
+    return user;
+  } catch (error) {
+    log(getUser, 'get user failed', error);
+  }
 };
 
 export const getToken = async ({ commit }: ActionContext<IRootState, IRootState>, code: string): Promise<IToken> => {
   log(getToken, 'start to get token using code', code);
-  const { data } = await oauthOperator.token({
-    code
-  });
-  const token = {
-    access: data.access_token,
-    refresh: data.refresh_token,
-    expiration: data.expires_in
-  };
-  commit('setToken', token);
-  log(getToken, 'get token success', data);
-  return token;
+  try {
+    const { data } = await oauthOperator.token({
+      code
+    });
+    const token = {
+      access: data.access_token,
+      refresh: data.refresh_token,
+      expiration: data.expires_in
+    };
+    commit('setToken', token);
+    log(getToken, 'get token success', data);
+    return token;
+  } catch (error) {
+    log(getToken, 'get token failed', error);
+  }
 };
 
-export const initializeSite = async ({ state, commit }: ActionContext<IRootState, IRootState>) => {
+export const initializeSite = async ({ state, commit, dispatch }: ActionContext<IRootState, IRootState>) => {
   log(initializeSite, 'start to initialize site');
   const origin = getSiteOrigin(state?.site);
   try {
@@ -68,26 +72,45 @@ export const initializeSite = async ({ state, commit }: ActionContext<IRootState
     log(initializeSite, 'initialize site success', data);
   } catch (error) {
     log(initializeSite, 'initialize site failed', error);
+    dispatch('login');
   }
 };
 
 export const getSite = async ({ state, commit }: ActionContext<IRootState, IRootState>) => {
   log(getSite, 'start to get site');
-  const origin = getSiteOrigin(state?.site);
-  const site = (
-    await siteOperator.getAll({
-      origin
-    })
-  )?.data?.items?.[0];
-  commit('setSite', site);
-  log(getSite, 'get site success', site);
+  try {
+    const origin = getSiteOrigin(state?.site);
+    const site = (
+      await siteOperator.getAll({
+        origin
+      })
+    )?.data?.items?.[0];
+    commit('setSite', site);
+    log(getSite, 'get site success', site);
+  } catch (error) {
+    log(getSite, 'get site failed', error);
+  }
+};
+
+export const login = async ({ state }: ActionContext<IRootState, IRootState>) => {
+  const site = state?.site?.origin;
+  authLogin({ redirect: window.location.pathname, site });
+};
+
+export const logout = async ({ dispatch }: ActionContext<IRootState, IRootState>) => {
+  await dispatch('resetAll');
+  await dispatch('chat/resetAll');
+  await dispatch('midjourney/resetAll');
+  await dispatch('chatdoc/resetAll');
+  await dispatch('qrart/resetAll');
 };
 
 export default {
+  login,
+  logout,
   resetToken,
   resetAll,
   resetUser,
-  resetSetting,
   resetSite,
   setToken,
   setUser,
diff --git a/src/store/common/mutations.ts b/src/store/common/mutations.ts
index b64eecd1..130402e1 100644
--- a/src/store/common/mutations.ts
+++ b/src/store/common/mutations.ts
@@ -19,10 +19,6 @@ export const resetToken = (state: IRootState): void => {
   state.token = {};
 };
 
-export const resetSetting = (state: IRootState): void => {
-  state.setting = {};
-};
-
 export const resetSite = (state: IRootState): void => {
   state.site = {};
 };
@@ -31,13 +27,6 @@ export const resetUser = (state: IRootState): void => {
   state.user = {};
 };
 
-export const setSetting = (state: IRootState, payload: any): void => {
-  state.setting = {
-    ...state.setting,
-    ...payload
-  };
-};
-
 export const setSite = (state: IRootState, payload: any): void => {
   state.site = {
     ...state.site,
@@ -51,7 +40,5 @@ export default {
   resetUser,
   setToken,
   resetToken,
-  setSetting,
-  resetSetting,
   resetSite
 };
diff --git a/src/utils/index.ts b/src/utils/index.ts
index b62311e7..70a1d08d 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -4,3 +4,5 @@ export * from './log';
 export * from './initializer';
 export * from './highlight';
 export * from './is';
+export * from './login';
+export * from './site';
diff --git a/src/utils/initializer.ts b/src/utils/initializer.ts
index f1bb922d..4f686b2b 100644
--- a/src/utils/initializer.ts
+++ b/src/utils/initializer.ts
@@ -3,6 +3,7 @@ import favicon from '@/assets/images/favicon.ico';
 import { getLocale } from '@/i18n';
 import store from '@/store';
 import { log } from './log';
+import { IToken } from '@/models';
 
 export const getDomain = () => {
   const host = window.location.hostname;
@@ -140,3 +141,28 @@ export const initializeSite = async () => {
     await store.dispatch('initializeSite');
   }
 };
+
+/**
+ * Initialize token by code
+ */
+export const initializeToken = async () => {
+  const query = new URLSearchParams(window.location.search);
+  const code = query.get('code');
+  if (code) {
+    const token = await store.dispatch('getToken', code);
+    console.debug('get token', token);
+  }
+};
+
+/**
+ * Initialize user by token
+ */
+export const initializeUser = async () => {
+  const token = store.state.token as IToken;
+  if (!token?.access) {
+    console.debug('no access token, skip get user');
+    return;
+  }
+  const user = await store.dispatch('getUser');
+  console.debug('get user', user);
+};
diff --git a/src/utils/login.ts b/src/utils/login.ts
new file mode 100644
index 00000000..4e02cd93
--- /dev/null
+++ b/src/utils/login.ts
@@ -0,0 +1,11 @@
+import { getBaseUrlAuth, getBaseUrlHub } from './baseUrl';
+
+export const login = ({ redirect = '/', site = window.location.origin }: { redirect?: string; site?: string }) => {
+  const hubBaseUrl = getBaseUrlHub();
+  const authBaseUrl = getBaseUrlAuth();
+  // callback url used to init access token and then redirect back of `redirect`
+  const callbackUrl = `${hubBaseUrl}/auth/callback?redirect=${redirect}`;
+  // redirect to auth service to get access token then redirect back
+  const targetUrl = `${authBaseUrl}/auth/login?redirect=${callbackUrl}&site=${site}`;
+  window.location.href = targetUrl;
+};