feat: use ofetch insteadof fetch

entrypoints/popup/Popup.vue

@@ -125,10 +125,10 @@ const vanillaStatus: IStatus = {
 
 const status = ref<IStatus>(vanillaStatus);
 
-watch(isCheckTw5, (newValue) => {
+watch(isCheckTw5, async (newValue) => {
   chrome.storage.local.set({ isCheckTw5: newValue });
   if (newValue) {
-    checkStatus(port.value!, status, isChecking);
+    await checkStatus(port.value!, status, isChecking);
   } else {
     status.value = vanillaStatus;
   }

package.json

@@ -24,6 +24,7 @@
     "dayjs": "^1.11.10",
     "element-plus": "^2.6.2",
     "groq-sdk": "^0.3.2",
+    "ofetch": "^1.3.4",
     "postcss": "^8.4.38",
     "rehype-document": "^7.0.3",
     "rehype-format": "^5.0.0",

utils/checkStatus.ts

@@ -1,42 +1,37 @@
 import { ElMessage as notify } from 'element-plus';
+import { ofetch } from 'ofetch';
 
-export function checkStatus(
+export async function checkStatus(
   port: number,
   status: Ref<IStatus>,
   isChecking: Ref<boolean>
 ) {
   isChecking.value = true;
-  const url = `http://localhost:${port}/status`;
-  fetch(url)
-    .then((res) => {
-      return res.json();
-    })
-    .then((data) => {
-      if (!data) {
-        return;
-      }
-      status.value = data;
-
-      if (!data.tiddlywiki_version) {
-        notify({
-          message: 'TiddlyWiki 未连接',
-          type: 'error',
-        });
-      } else {
-        notify({
-          message: 'TiddlyWiki 连接成功',
-          type: 'success',
-        });
-      }
-    })
+  const baseURL = `http://localhost:${port}`;
+  const twFetch = ofetch.create({ baseURL });
 
+  const data = await twFetch('/status')
     .catch((e) => {
       notify({
-        message: 'TiddlyWiki 未成功连接' + e,
+        message: 'TiddlyWiki 未成功连接' + e.message,
         type: 'error',
       });
     })
     .finally(() => {
       isChecking.value = false;
     });
+
+  status.value = data;
+
+  if (!data.tiddlywiki_version) {
+    notify({
+      message: 'TiddlyWiki 未连接',
+      type: 'error',
+    });
+  } else {
+    notify({
+      message: 'TiddlyWiki 连接成功',
+      type: 'success',
+    });
+  }
 }

utils/save2TiddlyWiki.ts

@@ -1,5 +1,6 @@
 import { formattime } from './formattime';
 import { ElMessage as notify } from 'element-plus';
+import { ofetch } from 'ofetch';
 
 const save2TiddlyWiki = async (
   title: string,
@@ -29,7 +30,27 @@ const save2TiddlyWiki = async (
 
   const currentTime = formattime(new Date());
 
-  fetch(`http://localhost:${port}/recipes/default/tiddlers/${title}`, {
+  const baseURL = `http://localhost:${port}`;
+  const savetwFetch = ofetch.create({
+    baseURL,
+    async onResponse({ request, response, options }) {
+      if (response.status === 204) {
+        notify({
+          message: '保存成功',
+          type: 'success',
+        });
+      }
+    },
+    async onResponseError({ request, response, options }) {
+      console.log('[fetch error]', response.status);
+      notify({
+        message: '保存失败' + response._data,
+        type: 'error',
+      });
+    },
+  });
+
+  await savetwFetch(`/recipes/default/tiddlers/${title}`, {
     method: 'PUT',
     headers: {
       'Content-Type': 'application/json',
@@ -44,21 +65,7 @@ const save2TiddlyWiki = async (
       modified: currentTime,
       tags,
     }),
-  })
-    .then((res) => {
-      if (res.ok) {
-        notify({
-          message: '保存成功',
-          type: 'success',
-        });
-      }
-    })
-    .catch((e) => {
-      notify({
-        message: '保存失败' + e,
-        type: 'error',
-      });
-    });
+  });
 };
 
 export default save2TiddlyWiki;