Add refresh get accessToken

YangzhenZhao · Mar 1, 2021 · 47b7717 · 47b7717
1 parent 411adfa
commit 47b7717
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 16 deletions.
diff --git a/front_end/src/components/Weather.vue b/front_end/src/components/Weather.vue
@@ -62,13 +62,41 @@ window.WIDGET = {
     key: '2vgaxeXBaw'
   }
 }
+const hefengidRequest = axios.create({
+  baseURL: utils.baseUrl(),
+  timeout: 5000
+})
 export default defineComponent({
   name: 'Weather',
   setup () {
     const areaCode = ref(defaulfAreaId)
     const store = useStore()
     const userName = computed(() => store.state.userName)
     const accessToken = computed(() => store.state.accessToken)
+    const getHefengCityId = async () => {
+      hefengidRequest.defaults.headers.Authorization = `Bearer ${accessToken.value}`
+      try {
+        const res = await hefengidRequest.get(`users/hefeng_city_id/${userName.value}`)
+        areaCode.value = res.data
+      } catch (err) {
+        console.log(err)
+        if (err.response.status === 401) {
+          const refreshBody = { refresh: store.state.refreshToken }
+          try {
+            const res = await hefengidRequest.post('/api/token/refresh/', refreshBody)
+            if (res.status === 200) {
+              store.commit('refresh', res.data.access)
+              const headerAuthorization = `Bearer ${res.data.access}`
+              hefengidRequest.defaults.headers.Authorization = headerAuthorization
+              const response = await hefengidRequest.get(`users/hefeng_city_id/${userName.value}`)
+              areaCode.value = response.data
+            }
+          } catch (err) {
+            console.log('refresh err:', err)
+          }
+        }
+      }
+    }
     onMounted(async () => {
       (function (d) {
         const c = d.createElement('link')
@@ -82,26 +110,13 @@ export default defineComponent({
           sn.parentNode.insertBefore(s, sn)
         }
       })(document)
-      const hefengidRequest = axios.create({
-        baseURL: utils.baseUrl(),
-        timeout: 5000,
-        headers: { Authorization: 'Bearer ' + accessToken.value }
-      })
-      console.log(accessToken.value)
-      const res = await hefengidRequest.get(`users/hefeng_city_id/${userName.value}`)
-      areaCode.value = res.data
+      await getHefengCityId()
     })
     watch(userName, async () => {
       if (userName.value === '') {
         return
       }
-      const hefengidRequest = axios.create({
-        baseURL: utils.baseUrl(),
-        timeout: 5000,
-        headers: { Authorization: 'Bearer ' + accessToken.value }
-      })
-      const res = await hefengidRequest.get(`users/hefeng_city_id/${userName.value}`)
-      areaCode.value = res.data
+      await getHefengCityId()
     })
     const warningList = ref()
     const dailyData = ref()
@@ -170,7 +185,8 @@ export default defineComponent({
       warningList,
       userName,
       areaCode,
-      accessToken
+      accessToken,
+      getHefengCityId
     }
   }
 })

diff --git a/front_end/src/store.ts b/front_end/src/store.ts
@@ -23,6 +23,10 @@ const store = createStore({
       localStorage.refreshToken = tokenData.refresh
       state.refreshToken = tokenData.refresh
     },
+    refresh (state, accessToken) {
+      localStorage.accessToken = accessToken
+      state.accessToken = accessToken
+    },
     logout (state) {
       localStorage.userName = ''
       state.userName = ''