tpl
/
obsidian-sample-plugin
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update LinkThumbnailWidgetParams.ts

This commit is contained in:
kim365my 2024-04-08 16:42:34 +09:00
parent b943ba02c9
commit 0ecba57dc8
1 changed files with 46 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
src/LinkThumbnailWidgetParams.ts
View File

@ -1,28 +1,32 @@
import { requestUrl } from "obsidian";
import { decode } from 'iconv-lite';
interface ogData {
"ogTitle": string,
"ogDescription": string,
"ogImage": string,
"ogImageAlt": string,
"ogUrl": string
}
// 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})?(\\/.*)?$");
export async function LinkThumbnailWidgetParams(url: string) {
async function getOgData(url: string) {
const urlArr = urlRegex.exec(url);
if (urlArr) {
try {
const response = await requestUrl({
url:url,
throw: true
});
const response = await requestUrl(url);
if (response && response.headers && response.headers['content-type'] && !response.headers['content-type']?.includes('text/')) {
throw new Error('Page must return a header content-type with text/');
}
// 인코딩 문제 해결
const bodyArrayBuffer = response.arrayBuffer;
const charset = response.headers["content-type"].replace("text/html;charset=","").toLowerCase();
const bodyArrayBuffer = response.arrayBuffer;
const contentType = response.headers["content-type"].toLowerCase().trim();
const charset = contentType.substring(contentType.indexOf("charset=") + 8, contentType.length);
let body;
if (charset.trim() === "utf-8") {
if (charset === "utf-8") {
body = Buffer.from(bodyArrayBuffer).toString('utf-8');
} else {
body = decode(Buffer.from(bodyArrayBuffer), charset);
@ -41,20 +45,39 @@ export async function LinkThumbnailWidgetParams(url: string) {
const ogImageAlt = document.querySelector("meta[property='og:image:alt']")?.getAttribute("content") || "";
const ogUrl = document.querySelector("meta[property='og:url']")?.getAttribute("content") || url;
const result = `
<div class="openGraphPreview">
${(ogImage === "")? "" : `<div class="se-oglink-thumbnail"><img src="${ogImage}" alt="${ogImageAlt}" class="se-oglink-thumbnail-resource"></img></div>`}
<div class="se-oglink-info-container">
<strong class="se-oglink-info">${ogTitle}</strong>
<description class="se-oglink-summary">${ogDescription}</description>
<p class="se-oglink-url">${ogUrl}</p>
</div>
</div>
`
return result;
const data: ogData = {
"ogTitle": ogTitle,
"ogDescription": ogDescription,
"ogImage": ogImage,
"ogImageAlt": ogImageAlt,
"ogUrl": ogUrl
}
return data;
} catch (error) {
throw new Error(error);
console.error(error);
}
}
return null
}
function renderOgData(data:ogData) {
return `
<div class="openGraphPreview">
${(data?.ogImage === "")? "" : `<div class="se-oglink-thumbnail"><img src="${data?.ogImage}" alt="${data?.ogImageAlt}" class="se-oglink-thumbnail-resource"></img></div>`}
<div class="se-oglink-info-container">
<strong class="se-oglink-info">${data?.ogTitle}</strong>
<description class="se-oglink-summary">${data?.ogDescription}</description>
<p class="se-oglink-url">${data?.ogUrl}</p>
</div>
</div>
`;
}
export async function LinkThumbnailWidgetParams(url: string) {
const data = await getOgData(url);
if (data) {
const result = renderOgData(data);
return result;
}
return null;
}