Encode snippet panel resource url with vscode.env.asExternalUri

James-Yu · Feb 16, 2024 · b7ce373 · b7ce373
1 parent 2f8770b
commit b7ce373
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 10 deletions.
diff --git a/resources/snippetview/snippetview.html b/resources/snippetview/snippetview.html
@@ -5,15 +5,15 @@
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <meta http-equiv="Content-Security-Policy" content="default-src 'none'; base-uri 'none'; connect-src %CSP%; script-src %CSP% 'unsafe-inline' blob:; style-src %CSP% 'unsafe-inline';">
         <script>
-            var mathSymbolsJsonUrl = 'http://127.0.0.1:%PORT%/snippetview/snippetpanel.json';
+            var mathSymbolsJsonUrl = '%SRC%/snippetview/snippetpanel.json';
         </script>
-        <script src="http://127.0.0.1:%PORT%/snippetview/snippetview.js" defer></script>
+        <script src="%SRC%/snippetview/snippetview.js" defer></script>
         <script>
-            var pdfjsDistUri = 'http://127.0.0.1:%PORT%';
+            var pdfjsDistUri = '%SRC%';
         </script>
-        <script src="http://127.0.0.1:%PORT%/build/pdf.mjs" type="module"></script>
-        <script src="http://127.0.0.1:%PORT%/snippetview/pdfrenderer.js" defer></script>
-        <link rel="stylesheet" href="http://127.0.0.1:%PORT%/snippetview/snippetview.css">
+        <script src="%SRC%/build/pdf.mjs" type="module"></script>
+        <script src="%SRC%/snippetview/pdfrenderer.js" defer></script>
+        <link rel="stylesheet" href="%SRC%/snippetview/snippetview.css">
     </head>
     <body>
         <div class="tab">

diff --git a/src/extras/snippet-view.ts b/src/extras/snippet-view.ts
@@ -68,7 +68,7 @@ function receive(message: SnippetViewResult) {
 class SnippetViewProvider implements vscode.WebviewViewProvider {
     private serverHandlerInserted = false
 
-    public resolveWebviewView(webviewView: vscode.WebviewView) {
+    public async resolveWebviewView(webviewView: vscode.WebviewView) {
         if (this.serverHandlerInserted === false) {
             lw.server.setHandler((url: string) => {
                 if (url.startsWith('/snippetview/')) {
@@ -91,7 +91,7 @@ class SnippetViewProvider implements vscode.WebviewViewProvider {
 
         const webviewSourcePath = path.join(lw.extensionRoot, 'resources', 'snippetview', 'snippetview.html')
         webviewView.webview.html = readFileSync(webviewSourcePath, { encoding: 'utf8' })
-            .replaceAll('%PORT%', lw.server.getPort().toString())
+            .replaceAll('%SRC%', (await lw.server.getUrl()).url)
             .replaceAll('%CSP%', webviewView.webview.cspSource + ' http://127.0.0.1:*')
 
         webviewView.webview.onDidReceiveMessage((e: SnippetViewResult) => {

diff --git a/src/preview/server.ts b/src/preview/server.ts
@@ -72,10 +72,12 @@ function getPort(): number {
     return portNum
 }
 
-async function getUrl(pdfUri: vscode.Uri): Promise<{url: string, uri: vscode.Uri}> {
+async function getUrl(pdfUri?: vscode.Uri): Promise<{url: string, uri: vscode.Uri}> {
     // viewer/viewer.js automatically requests the file to server.ts, and server.ts decodes the encoded path of PDF file.
     const origUrl = await vscode.env.asExternalUri(vscode.Uri.parse(`http://127.0.0.1:${lw.server.getPort()}`, true))
-    const url = origUrl.toString() + (origUrl.toString().endsWith('/') ? '' : '/' ) + `viewer.html?file=${encodePathWithPrefix(pdfUri)}`
+    const url =
+        (origUrl.toString().endsWith('/') ? origUrl.toString().slice(0, -1) : origUrl.toString()) +
+        (pdfUri ? ('/viewer.html?file=' + encodePathWithPrefix(pdfUri)) : '')
     return { url, uri: vscode.Uri.parse(url, true) }
 }