1

src/home.vue

@@ -5,47 +5,48 @@ import {onMounted, ref, watch} from 'vue'
 import {visit} from '@/api/index'
 import axios from 'axios'
 
-onMounted(() => {
-  getUrl()
-})
-
-const referrer = ref('')
+const referrer = ref(document.referrer || '')
 const ipUrl = ref('')
 
-console.log('11===>', window.location)
-function getUrl() {
-  referrer.value = document.referrer
+const CACHE_KEY = 'ip'
+const TIME_KEY = 'ipFetchTime'
+const CACHE_MIN = 60 * 60 * 1000 // 1h
 
-  axios
-    .get('https://api64.ipify.org?format=json')
-    .then(({data}) => {
-      ipUrl.value = data.ip
-    })
-    .catch(console.error)
+async function getUrl() {
+  const now = Date.now()
+  const cachedIp = sessionStorage.getItem(CACHE_KEY)
+  const cachedTime = sessionStorage.getItem(TIME_KEY)
+
+  if (cachedIp && cachedTime && now - Number(cachedTime) < CACHE_MIN) {
+    ipUrl.value = cachedIp
+    return cachedIp
+  }
+
+  try {
+    const {data} = await axios.get('https://api64.ipify.org?format=json')
+    ipUrl.value = data.ip
+    sessionStorage.setItem(CACHE_KEY, data.ip)
+    sessionStorage.setItem(TIME_KEY, now.toString())
+    postVisit()
+  } catch (e) {
+    console.error('获取 IP 失败:', e)
+  }
 }
 
-async function postVisit() {
-  let params = {
+function postVisit() {
+  const params = {
     timestamp: new Date(),
     url: window.location.href,
     referrer: referrer.value,
     real_ip: ipUrl.value,
   }
-  let {code, msg} = await visit(params)
+
+  visit(params).then((res) => {})
 }
 
-watch(
-  () => [referrer.value, ipUrl.value],
-  ([refer, ipUrl]) => {
-    if (refer && ipUrl) {
-      postVisit()
-    }
-  },
-  {
-    deep: true,
-    immediate: true,
-  }
-)
+onMounted(async () => {
+  await getUrl()
+})
 </script>
 
 <template>