microsoft / vscode-livepreview

Hosts a local server in your workspace for you to preview your webpages.
http://aka.ms/live-preview
MIT License
428 stars 59 forks source link

Does not work on codespaces #538

Closed mwisnicki closed 10 months ago

mwisnicki commented 1 year ago

Fails with following CSP error in console:

index.html?id=ecf3f705-5c6f-44be-808c-c32ae4e6ca53&origin=dc695ab0-0436-4d25-9221-918d6c757d15&swVersion=4&extensionId=ms-vscode.live-server&platform=browser&vscode-resource-base-authority=vscode-resource.vscode-cdn.net&parentOrigin=https%3A%2F%2Fdidactic-space-xylophone-4jx4gjj727rw5.github.dev&remoteAuthority=codespaces%2Bdidactic-space-xylophone-4jx4gjj727rw5:999

Refused to frame 'https://github.dev/' because it violates the following Content Security Policy directive: "frame-src https://didactic-space-xylophone-4jx4gjj727rw5-3000.app.github.dev".
andreamah commented 1 year ago

Did you try the steps in the FAQ?

Q. I'm trying to use Live Preview in Codespaces and the embedded preview isn't working.

A. Currently, you will need to manually navigate to the links host the forwarded port content before it works

In the area of the editor where the integrated terminal usually is, navigate to Ports and open the local addresses (usually at ports 3000 and 3001) in the browser. You can do this by using CTRL+Click on the URLs in the Ports menu.

Allow the browser to perform the necessary redirects, then close the windows. Re-open the preview window and it should work now.

andreamah commented 10 months ago

I think this was a duplicate of https://github.com/microsoft/vscode-livepreview/issues/546

mwisnicki commented 10 months ago

I switched to latest prerelease and had to follow the steps from FAQ mentioned above to get this working. @andreamah is this expected?

Also live reload does not work with simple static html files.

andreamah commented 10 months ago

Yes, this is expected. The full functionality is tracked in https://github.com/microsoft/vscode-livepreview/issues/111.

To get the full functionality, click on the forwarded port link for both 3000 and 3001. 3001 will say 'update required', but this is expected since it is a websocket port.