diff --git a/modules/web/src/components/ChapterContent.vue b/modules/web/src/components/ChapterContent.vue index 1be09befa..405a4f368 100644 --- a/modules/web/src/components/ChapterContent.vue +++ b/modules/web/src/components/ChapterContent.vue @@ -13,7 +13,7 @@ @error.once="proxyImage" loading="lazy" /> -

+

@@ -48,11 +48,37 @@ const getImageSrc = (content: string) => { return src } const proxyImage = (event: Event) => { - ;(event.target as HTMLImageElement).src = API.getProxyImageUrl( - bookUrl.value, - (event.target as HTMLImageElement).src, - readWidth.value, - ) + /* 获取IMG标签原始的src + + 假设location.href = http://example.com + event.target.src 返回 http://example.com/test + (event.target as HTMLImageElement)?.getAttribute("src") 返回/test + */ + const src = (event.target as HTMLImageElement)?.getAttribute("src") + if (src != null && src.length > 0) { + (event.target as HTMLImageElement).src = API.getProxyImageUrl( + bookUrl.value, + src, + readWidth.value, + ) + } +} + +/** + * 处理传入的IMG标签错误事件,自动替换图片的代理链接 + */ +const handleImgLoadError = (event: Event) => { + if ((event.target as HTMLElement)?.tagName === "IMG") { + console.log("[ChapterContent]: IMG Load Error, replace src:", + (event.target as HTMLImageElement)?.getAttribute("src"), "=>", + API.getProxyImageUrl( + bookUrl.value, + (event.target as HTMLImageElement)?.getAttribute("src") ?? "", + readWidth.value, + ) + ) + proxyImage(event) + } } const calculateWordCount = (paragraph: string) => { diff --git a/modules/web/src/views/BookChapter.vue b/modules/web/src/views/BookChapter.vue index d022348b2..966c6ac3a 100644 --- a/modules/web/src/views/BookChapter.vue +++ b/modules/web/src/views/BookChapter.vue @@ -305,12 +305,6 @@ const getContent = (index: number, reloadChapter = true, chapterPos = 0) => { if (res.data.isSuccess) { const data = res.data.data const content = data.split(/\n+/) - const urlEncodedBookUrl = encodeURIComponent(bookUrl) - for (let i = 0; i < content.length; i++) { - if (!/^\s*]*src[^>]+>$/.test(content[i])) { - content[i] = content[i].replace(new RegExp('img src="', 'g'), `img src="/image?url=${urlEncodedBookUrl}&path=`); - } - } chapterData.value.push({ index, content, title }) if (reloadChapter) toChapterPos(chapterPos) } else {