mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-13 16:16:46 +08:00
chore: proxy image preview in frontend (#11957)
<!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Images and icons in bookmark cards are now loaded through an image proxy for improved reliability and consistency. - Embed blocks for GitHub, Loom, and YouTube now display banner and creator images via an image proxy service for enhanced image loading. - **Refactor** - Simplified backend URL handling and proxy logic for images, resulting in more efficient processing and reduced complexity. - Consolidated image proxy middleware and services into a shared adapter module for streamlined imports and improved maintainability. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
@@ -209,7 +209,6 @@ export class WorkerController {
|
||||
videos: [],
|
||||
favicons: [],
|
||||
};
|
||||
const baseUrl = new URL(request.url, this.url.baseUrl).toString();
|
||||
|
||||
if (response.body) {
|
||||
const resp = await decodeWithCharset(response, res);
|
||||
@@ -276,7 +275,7 @@ export class WorkerController {
|
||||
|
||||
await rewriter.transform(resp).text();
|
||||
|
||||
res.images = await reduceUrls(baseUrl, res.images);
|
||||
res.images = await reduceUrls(res.images);
|
||||
|
||||
this.logger.debug('Processed response with HTMLRewriter', {
|
||||
origin,
|
||||
@@ -293,7 +292,7 @@ export class WorkerController {
|
||||
appendUrl(faviconUrl.toString(), res.favicons);
|
||||
}
|
||||
|
||||
res.favicons = await reduceUrls(baseUrl, res.favicons);
|
||||
res.favicons = await reduceUrls(res.favicons);
|
||||
}
|
||||
|
||||
const json = JSON.stringify(res);
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
export * from './headers';
|
||||
export * from './proxy';
|
||||
export * from './url';
|
||||
|
||||
export function parseJson<T>(data: string): T | null {
|
||||
|
||||
@@ -1,54 +0,0 @@
|
||||
const IMAGE_PROXY = '/api/worker/image-proxy';
|
||||
|
||||
const httpsDomain = new Set();
|
||||
|
||||
async function checkHttpsSupport(url: URL): Promise<boolean> {
|
||||
const httpsUrl = new URL(url.toString());
|
||||
httpsUrl.protocol = 'https:';
|
||||
try {
|
||||
const response = await fetch(httpsUrl, {
|
||||
method: 'HEAD',
|
||||
redirect: 'manual',
|
||||
});
|
||||
|
||||
if (response.ok || (response.status >= 400 && response.status < 600)) {
|
||||
return true;
|
||||
}
|
||||
} catch {}
|
||||
return false;
|
||||
}
|
||||
|
||||
async function fixProtocol(url: string): Promise<URL> {
|
||||
const targetUrl = new URL(url);
|
||||
if (targetUrl.protocol !== 'http:') {
|
||||
return targetUrl;
|
||||
} else if (httpsDomain.has(targetUrl.hostname)) {
|
||||
targetUrl.protocol = 'https:';
|
||||
return targetUrl;
|
||||
} else if (await checkHttpsSupport(targetUrl)) {
|
||||
httpsDomain.add(targetUrl.hostname);
|
||||
targetUrl.protocol = 'https:';
|
||||
return targetUrl;
|
||||
}
|
||||
return targetUrl;
|
||||
}
|
||||
|
||||
export function imageProxyBuilder(
|
||||
url: string
|
||||
): (url: string) => Promise<string | undefined> {
|
||||
try {
|
||||
const proxy = new URL(url);
|
||||
proxy.pathname = IMAGE_PROXY;
|
||||
|
||||
return async url => {
|
||||
try {
|
||||
const targetUrl = await fixProtocol(url);
|
||||
proxy.searchParams.set('url', targetUrl.toString());
|
||||
return proxy.toString();
|
||||
} catch {}
|
||||
return;
|
||||
};
|
||||
} catch {
|
||||
return async url => url.toString();
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,5 @@
|
||||
import { getDomain, getSubdomain } from 'tldts';
|
||||
|
||||
import { imageProxyBuilder } from './proxy';
|
||||
|
||||
const localhost = new Set(['localhost', '127.0.0.1']);
|
||||
|
||||
const URL_FIXERS: Record<string, (url: URL) => URL> = {
|
||||
@@ -58,11 +56,6 @@ export function appendUrl(url: string | null, array?: string[]) {
|
||||
}
|
||||
}
|
||||
|
||||
export async function reduceUrls(baseUrl: string, urls?: string[]) {
|
||||
if (urls && urls.length > 0) {
|
||||
const imageProxy = imageProxyBuilder(baseUrl);
|
||||
const newUrls = await Promise.all(urls.map(imageProxy));
|
||||
return newUrls.filter((x): x is string => !!x);
|
||||
}
|
||||
return [];
|
||||
export async function reduceUrls(urls: string[] = []) {
|
||||
return Array.from(new Set(urls.filter(Boolean) as string[]));
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user