How do I turn an fsPath or any absolute path into a webview resource url in VSCode API?

The links I need look something akin to:

https://file%2B.vscode-resource.vscode-webview.net/d%3A/Programming/Python/Lectures/Compilers/doobedoo/Episode2.mp4

I have paths that look like: D:\Programming\Python\Lectures\Compilers\doobedoo\Episode2.mp4

The problem is, I can't just concatenate the string to look like that string, I need a way for VScode to do it for me so that it's consistent with OSes, future releases and when using WSL.

For context, I can only load resources under this content policy:

<meta http-equiv="Content-Security-Policy" content="default-src 'none'; media-src %cspSource% https:; img-src %cspSource% https:; script-src 'nonce-%nonce%'; style-src %cspSource% 'unsafe-inline'; font-src %cspSource% ;" />


Have you seen this: webview docs

asWebviewUri(localResource: Uri): Uri

Convert a uri for the local file system to one that can be used inside webviews.

Webviews cannot directly load resources from the workspace or local file system using file: uris. The asWebviewUri function takes a local file: uri and converts it into a uri that can be used inside of a webview to load the same resource:

webview.html = `<img src="${webview.asWebviewUri(
  vscode.Uri.file('/Users/codey/workspace/cat.gif')
)}">`;

So try:

yourWebview.asWebviewUri( vscode.Uri.file('D:\Programming\Python\Lectures\Compilers\doobedoo\Episode2.mp4'));