From 8702a3892224bdd8943854c9cec39f066687d055 Mon Sep 17 00:00:00 2001
From: kim365my <kim365my@knou.ac.kr>
Date: Tue, 9 Apr 2024 17:46:08 +0900
Subject: [PATCH] =?UTF-8?q?=EB=A1=9C=EC=BB=AC=EC=97=90=20=ED=81=AC?=
 =?UTF-8?q?=EB=A1=A4=EB=A7=81=ED=95=9C=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20?=
 =?UTF-8?q?=EC=A0=80=EC=9E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/LinkThumbnailWidgetParams.ts | 44 +++++++++++++++++++++++++++++++-
 1 file changed, 43 insertions(+), 1 deletion(-)

diff --git a/src/LinkThumbnailWidgetParams.ts b/src/LinkThumbnailWidgetParams.ts
index 4aae77a..babf9cc 100644
--- a/src/LinkThumbnailWidgetParams.ts
+++ b/src/LinkThumbnailWidgetParams.ts
@@ -9,9 +9,50 @@ interface ogData {
     "ogUrl": string
 }
 
+const OGDATACHACHE = "ogDataCache"
 // url 정규식
 const urlRegex = new RegExp("^(http:\\/\\/www\\.|https:\\/\\/www\\.|http:\\/\\/|https:\\/\\/)?[a-z0-9]+([\\-.]{1}[a-z0-9]+)*\\.[a-z]{2,5}(:[0-9]{1,5})?(\\/.*)?$");
 
+// 로컬데이터 접근
+function getLocalOgData(url: string) {
+    const data = localStorage.getItem(OGDATACHACHE + url);
+    if (data) {
+        const ogData: ogData = JSON.parse(data);
+        return ogData;
+    }
+}
+
+async function saveLocalOgData(url:string, ogData: ogData) {
+    const imgUrl = ogData.ogImage;
+    const lastDot = imgUrl.lastIndexOf(".");
+	const imgType = imgUrl.substring(lastDot, imgUrl.length).toLowerCase();
+
+    const file = await requestUrl({url:imgUrl, contentType: `image/${imgType}`});
+    const fileArrayBuffer = file.arrayBuffer;
+    // 방법 1) blob 변환
+    // const fileBlob = new Blob([fileArrayBuffer], { type: `image/${imgType}`});
+
+    // // 파일 리더 생성
+    // const reader = new FileReader();
+    // reader.readAsDataURL(fileBlob);
+    // let base64String = "";
+    // reader.onloadend = () => {
+    //     const base64 = reader.result;
+    //     if (typeof base64 === "string") base64String = base64;
+    // };
+
+    // 방법 2) ArrayBuffer 자체를 base64로 변환
+    const uint8 = new Uint8Array(fileArrayBuffer);
+    const base64String = btoa(uint8.reduce((data, byte)=> {
+        return data + String.fromCharCode(byte);
+      }, ''));
+    ogData.ogImage = `data:image/${imgType};charset=utf-8;base64,` + base64String;
+
+    // 저장하기 전에 img 데이터를 url-> blob -> base64로 변환 후 저장
+    localStorage.setItem(OGDATACHACHE + url, JSON.stringify(ogData));
+}
+
+
 async function getOgData(url: string) {
     const urlArr = urlRegex.exec(url);
     if (urlArr) {
@@ -53,6 +94,7 @@ async function getOgData(url: string) {
                 "ogUrl": ogUrl
             }
 
+            await saveLocalOgData(url, data);
             return data;
         } catch (error) {
             console.error(error);
@@ -74,7 +116,7 @@ function renderOgData(data:ogData) {
 }
 
 export async function LinkThumbnailWidgetParams(url: string) {
-    const data = await getOgData(url);    
+    const data = getLocalOgData(url) || await getOgData(url);    
     if (data) {
         const result = renderOgData(data);
         return result;