fix(vscodePlugin): relative path img (#972)

Tencent · Nov 12, 2024 · 67c5ae5 · 67c5ae5
1 parent 00f1083
commit 67c5ae5
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 9 deletions.
diff --git a/vscodePlugin/src/webview.ts b/vscodePlugin/src/webview.ts
@@ -11,8 +11,10 @@ import * as fs from 'fs';
  */
 export function getWebviewContent(mdInfo: object, currentPanel: vscode.WebviewPanel, extensionPath: string) {
   const baseResourcePath = getWebViewPath(currentPanel);
+  const activeTextEditorPath = getActiveTextEditorPath(currentPanel);
   const filePath = writeGlobalVarsToFile(extensionPath, {
-    baseResourcePath
+    baseResourcePath,
+    activeTextEditorPath,
   });
   const pageResourceUrlsMap = {
     'global-vars.js': currentPanel.webview.asWebviewUri(vscode.Uri.file(filePath)),
@@ -57,18 +59,25 @@ content="default-src 'none'; img-src ${currentPanel.webview.cspSource} https: ht
   </html>`;
 }
 
-const getWebViewPath = (currentPanel: vscode.WebviewPanel) => {
+const getWebViewPath = (currentPanel: vscode.WebviewPanel): vscode.Uri => {
   const workspaceFolder = vscode.workspace.workspaceFolders![0].uri.fsPath ?? '';
-  const imgUri = vscode.Uri.file(workspaceFolder);
-  return currentPanel.webview.asWebviewUri(imgUri);
+  const workspacePath = vscode.Uri.file(workspaceFolder);
+  return currentPanel.webview.asWebviewUri(workspacePath);
 };
 
-function writeGlobalVarsToFile(extensionPath: string, globalVars: { baseResourcePath: vscode.Uri }): string {
+const getActiveTextEditorPath = (currentPanel: vscode.WebviewPanel): vscode.Uri => {
+  const editor = vscode.window.activeTextEditor;
+  const activeTextEditorPath = editor ? currentPanel.webview.asWebviewUri(editor.document.uri) : getWebViewPath(currentPanel);;
+  return activeTextEditorPath;
+};
+
+function writeGlobalVarsToFile(extensionPath: string, globalVars: { baseResourcePath: vscode.Uri, activeTextEditorPath: vscode.Uri }): string {
   const globalVarsContent = `
     window._baseResourcePath = "${globalVars.baseResourcePath}";
+    window._activeTextEditorPath = "${globalVars.activeTextEditorPath}";
   `;
+
   const filePath = path.join(extensionPath, 'web-resources/scripts', 'global-vars.js');
   fs.writeFileSync(filePath, globalVarsContent);
   return filePath;
 }
-
diff --git a/vscodePlugin/web-resources/scripts/index.js b/vscodePlugin/web-resources/scripts/index.js
@@ -245,15 +245,20 @@ const basicConfig = {
     // eslint-disable-next-line no-undef
     changeString2Pinyin: pinyin,
     beforeImageMounted(srcProp, srcValue) {
+      const { _activeTextEditorPath } = window;
+
+      //  http路径 或 data路径
       if (isHttpUrl(srcValue) || isDataUrl(srcValue)) {
         return {
           src: srcValue,
         };
       }
-      // eslint-disable-next-line no-underscore-dangle
-      const basePath = window._baseResourcePath || '';
+      // TODO: 绝对路径(如windows上D:\GithubDesktop\cherry-markdown\README.md)
+
+      // 相对路径
+      const absolutePath = new URL(srcValue, _activeTextEditorPath).href;
       return {
-        src: path.join(basePath, srcValue),
+        src: absolutePath,
       };
     },
     onClickPreview: (e) => {