From c04fcd3f1f7c53436f5d2fb7937e82b17aaa96ff Mon Sep 17 00:00:00 2001 From: oeyoews Date: Sat, 6 Jul 2024 11:11:39 +0800 Subject: [PATCH] fix: #15 support auth --- entrypoints/sidepanel/Sidepanel.vue | 56 +++++++++++++++++++++++++---- package.json | 2 +- utils/checkStatus.ts | 43 ++++++++++++++++------ utils/save2TiddlyWiki.ts | 12 ++++++- utils/storage.ts | 10 ++++++ 5 files changed, 104 insertions(+), 19 deletions(-) diff --git a/entrypoints/sidepanel/Sidepanel.vue b/entrypoints/sidepanel/Sidepanel.vue index 21347a6..c0e2c0a 100644 --- a/entrypoints/sidepanel/Sidepanel.vue +++ b/entrypoints/sidepanel/Sidepanel.vue @@ -14,8 +14,13 @@ import save2TiddlyWiki from '@/utils/save2TiddlyWiki'; import { html2md, md2html } from '@/utils/parser'; import { ElMessage as notify } from 'element-plus'; import { checkStatus } from '@/utils/checkStatus'; -import { isCheckTw5Storage, tagStorage, portStorage } from '@/utils/storage'; -import getAI from '@/utils/openai'; +import { + isCheckTw5Storage, + tagStorage, + portStorage, + authStorage, +} from '@/utils/storage'; +// import getAI from '@/utils/openai'; const editRef = ref(); const isChecking = ref(false); @@ -33,12 +38,19 @@ const inputVisible = ref(false); const InputRef = ref(); const inputValue = ref(); const dynamicTags = ref(); -const port = ref(); +const port = ref(8000); +const username = ref(''); +const password = ref(''); const aihtml = ref(''); const infoDialogStatus = ref(false); port.value = await portStorage.getValue(); +const auth = await authStorage.getValue(); + +username.value = auth.username; +password.value = auth.password; + isCheckTw5.value = await isCheckTw5Storage.getValue(); dynamicTags.value = Object.values(await tagStorage.getValue()); @@ -82,7 +94,9 @@ const handleSave = () => port.value!, link.value, dynamicTags.value, - status + status, + username, + password ); function addJournal() { @@ -136,7 +150,7 @@ const status = ref(vanillaStatus); watchEffect(async () => { await isCheckTw5Storage.setValue(isCheckTw5.value); if (isCheckTw5.value) { - await checkStatus(port.value!, status, isChecking); + await checkStatus(port!, status, isChecking, username, password); } }); @@ -183,7 +197,14 @@ async function savePort(port: number) { await portStorage.setValue(port); if (isCheckTw5.value) { // 更新status - checkStatus(port, status, isChecking); + checkStatus(toRef(port), status, isChecking, username, password); + } +} + +async function saveAuth(option: { username: string; password: string }) { + await authStorage.setValue(option); + if (password.value) { + checkStatus(port, status, isChecking, username, password); } } @@ -356,6 +377,27 @@ const toggleInfoDialog = () => { --el-switch-off-color: #ff4949; " /> + +
+

TiddlyWiki5 登录认证

+
+ + + 保存 +
+
+

Nodejs TiddlyWiki5 端口

@@ -363,7 +405,7 @@ const toggleInfoDialog = () => { 保存
diff --git a/package.json b/package.json index dd1ebeb..e3a0066 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "usewiki2", "description": "Convert HTML to Markdown, and save to your computer, support nodejs tiddlywiki", "private": true, - "version": "3.4.0", + "version": "3.5.0", "type": "module", "scripts": { "dev": "wxt", diff --git a/utils/checkStatus.ts b/utils/checkStatus.ts index eb3fffe..26491f7 100644 --- a/utils/checkStatus.ts +++ b/utils/checkStatus.ts @@ -4,15 +4,23 @@ import { ofetch } from 'ofetch'; // 如果设置了username, password, 进行登录, 保存的时候应该也需要？ export async function checkStatus( - port: number, + port: Ref, status: Ref, - isChecking: Ref + isChecking: Ref, + username: Ref, + password: Ref ) { + const baseURL = `http://localhost:${port.value}`; + const token = 'Basic ' + btoa(username.value + ':' + password.value); + isChecking.value = true; - const baseURL = `http://localhost:${port}`; + const twFetch = ofetch.create({ baseURL, - retry: 0, + retry: 1, + headers: { + Authorization: token, + }, onResponse({ request, response, options }) { if (response.ok) { notify({ @@ -20,19 +28,34 @@ export async function checkStatus( type: 'success', position: 'bottom-right', }); + } else { + if (response.status == 401) { + // response.statusText, + notify({ + title: '请设置用户名和密码', + type: 'error', + position: 'bottom-right', + }); + } } }, async onRequestError({ request, response, options }) { notify({ - title: '连接失败', + title: response?.statusText, type: 'error', }); }, }); - const data = await twFetch('/status').finally(() => { - isChecking.value = false; - }); - - status.value = data; + try { + const data = await twFetch('/status'); + status.value = data; + } catch (error) { + // notify({ + // title: '请设置用户名和密码', + // type: 'error', + // position: 'bottom-right', + // }); + } + isChecking.value = false; } diff --git a/utils/save2TiddlyWiki.ts b/utils/save2TiddlyWiki.ts index 2811607..eac4a65 100644 --- a/utils/save2TiddlyWiki.ts +++ b/utils/save2TiddlyWiki.ts @@ -9,7 +9,9 @@ const save2TiddlyWiki = async ( port: number, url: string, tag: string[], - status: Ref + status: Ref, + username: Ref, + password: Ref ) => { const baseURL = `http://localhost:${port}/recipes/default/tiddlers`; @@ -43,6 +45,7 @@ const save2TiddlyWiki = async ( tags, }; + const token = 'Basic ' + btoa(username.value + ':' + password.value); const savetwFetch = ofetch.create({ baseURL, method: 'PUT', @@ -50,6 +53,7 @@ const save2TiddlyWiki = async ( headers: { 'Content-Type': 'application/json', 'x-requested-with': 'TiddlyWiki', + Authorization: token, }, async onResponse({ request, response, options }) { if (response.ok) { @@ -74,6 +78,7 @@ const save2TiddlyWiki = async ( headers: { 'Content-Type': 'application/json', 'x-requested-with': 'TiddlyWiki', + Authorization: `Basic ${btoa('oeyoews' + ':' + 'oeyoews')}`, }, }); @@ -82,6 +87,11 @@ const save2TiddlyWiki = async ( switch (response.status) { case 200: break; + case 401: + notify({ + message: response.statusText, + }); + break; case 404: await savetwFetch(`/${title}`, { body: tiddler, diff --git a/utils/storage.ts b/utils/storage.ts index 95b0800..b5a94af 100644 --- a/utils/storage.ts +++ b/utils/storage.ts @@ -4,6 +4,16 @@ export const portStorage = storage.defineItem('sync:port', { defaultValue: constant.default_port, }); +export const authStorage = storage.defineItem<{ + username: string; + password: string; +}>('sync:auth', { + defaultValue: { + username: '', + password: '', + }, +}); + export const tagStorage = storage.defineItem('sync:tags', { defaultValue: [constant.default_tag], });