From 08f6a22d44b0dc3cd8002f65ad5aa34fcdd6404b Mon Sep 17 00:00:00 2001
From: pengx17 <pengxiao@outlook.com>
Date: Wed, 22 Jan 2025 09:31:05 +0000
Subject: [PATCH] fix(core): linkpreview and imageproxy url should be prefixed
 with server url (#9838)

fix AF-2150
---
 .../block-suite-editor/blocksuite-editor.tsx  | 20 ++++++++++++---
 .../workspace/detail/mobile-detail-page.tsx   | 25 +++++++++++++------
 2 files changed, 33 insertions(+), 12 deletions(-)

diff --git a/packages/frontend/core/src/components/blocksuite/block-suite-editor/blocksuite-editor.tsx b/packages/frontend/core/src/components/blocksuite/block-suite-editor/blocksuite-editor.tsx
index 9d9207b1bbec7..42d4f28ad2d25 100644
--- a/packages/frontend/core/src/components/blocksuite/block-suite-editor/blocksuite-editor.tsx
+++ b/packages/frontend/core/src/components/blocksuite/block-suite-editor/blocksuite-editor.tsx
@@ -1,5 +1,6 @@
 import { useRefEffect } from '@affine/component';
 import { EditorLoading } from '@affine/component/page-detail-skeleton';
+import { ServerService } from '@affine/core/modules/cloud';
 import {
   customImageProxyMiddleware,
   type DocMode,
@@ -9,6 +10,7 @@ import {
 import { DisposableGroup } from '@blocksuite/affine/global/utils';
 import type { AffineEditorContainer } from '@blocksuite/affine/presets';
 import type { Store } from '@blocksuite/affine/store';
+import { useService } from '@toeverything/infra';
 import type { CSSProperties } from 'react';
 import { useEffect, useState } from 'react';
 
@@ -47,6 +49,8 @@ const BlockSuiteEditorImpl = ({
     };
   }, [page]);
 
+  const server = useService(ServerService).server;
+
   const editorRef = useRefEffect(
     (editor: AffineEditorContainer) => {
       globalThis.currentEditor = editor;
@@ -63,14 +67,22 @@ const BlockSuiteEditorImpl = ({
             // host should be ready
 
             // provide image proxy endpoint to blocksuite
+            const imageProxyUrl = new URL(
+              BUILD_CONFIG.imageProxyUrl,
+              server.baseUrl
+            ).toString();
+            const linkPreviewUrl = new URL(
+              BUILD_CONFIG.linkPreviewUrl,
+              server.baseUrl
+            ).toString();
             editor.host?.std.clipboard.use(
-              customImageProxyMiddleware(BUILD_CONFIG.imageProxyUrl)
+              customImageProxyMiddleware(imageProxyUrl)
             );
-            ImageBlockService.setImageProxyURL(BUILD_CONFIG.imageProxyUrl);
+            ImageBlockService.setImageProxyURL(imageProxyUrl);
 
             editor.host?.doc
               .get(LinkPreviewerService)
-              .setEndpoint(BUILD_CONFIG.linkPreviewUrl);
+              .setEndpoint(linkPreviewUrl);
 
             return editor.host?.updateComplete;
           })
@@ -91,7 +103,7 @@ const BlockSuiteEditorImpl = ({
         disposableGroup.dispose();
       };
     },
-    [onEditorReady, page]
+    [onEditorReady, page, server]
   );
 
   return (
diff --git a/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx b/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx
index 03b3e28c7cdd7..b5b71118bca66 100644
--- a/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx
+++ b/packages/frontend/core/src/mobile/pages/workspace/detail/mobile-detail-page.tsx
@@ -10,6 +10,7 @@ import { DetailPageWrapper } from '@affine/core/desktop/pages/workspace/detail-p
 import { PageHeader } from '@affine/core/mobile/components';
 import { useGlobalEvent } from '@affine/core/mobile/hooks/use-global-events';
 import { AIButtonService } from '@affine/core/modules/ai-button';
+import { ServerService } from '@affine/core/modules/cloud';
 import { DocService } from '@affine/core/modules/doc';
 import { DocDisplayMetaService } from '@affine/core/modules/doc-display-meta';
 import { EditorService } from '@affine/core/modules/editor';
@@ -142,21 +143,29 @@ const DetailPageImpl = () => {
   const title = useLiveData(doc.title$);
   usePageDocumentTitle(title);
 
+  const server = useService(ServerService).server;
+
   const onLoad = useCallback(
     (editorContainer: AffineEditorContainer) => {
       // blocksuite editor host
       const editorHost = editorContainer.host;
 
       // provide image proxy endpoint to blocksuite
-      editorHost?.std.clipboard.use(
-        customImageProxyMiddleware(BUILD_CONFIG.imageProxyUrl)
-      );
-      ImageBlockService.setImageProxyURL(BUILD_CONFIG.imageProxyUrl);
+      const imageProxyUrl = new URL(
+        BUILD_CONFIG.imageProxyUrl,
+        server.baseUrl
+      ).toString();
+
+      const linkPreviewUrl = new URL(
+        BUILD_CONFIG.linkPreviewUrl,
+        server.baseUrl
+      ).toString();
+
+      editorHost?.std.clipboard.use(customImageProxyMiddleware(imageProxyUrl));
+      ImageBlockService.setImageProxyURL(imageProxyUrl);
 
       // provide link preview endpoint to blocksuite
-      editorHost?.doc
-        .get(LinkPreviewerService)
-        .setEndpoint(BUILD_CONFIG.linkPreviewUrl);
+      editorHost?.doc.get(LinkPreviewerService).setEndpoint(linkPreviewUrl);
 
       // provide page mode and updated date to blocksuite
       const refNodeService = editorHost?.std.getOptional(RefNodeSlotsProvider);
@@ -190,7 +199,7 @@ const DetailPageImpl = () => {
         disposable.dispose();
       };
     },
-    [docCollection.id, editor, jumpToPageBlock, openPage]
+    [docCollection.id, editor, jumpToPageBlock, openPage, server]
   );
 
   return (