microsoft / vscode-livepreview

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

Live refresh not working in secure environments #645

Closed scbrubaker02 closed 3 months ago

scbrubaker02 commented 3 months ago

The preview shows the content at the time the preview window was loaded but fails to update as content is type or even when it is saved.

image

If you try this out in github codespaces, you will see an error like the following as it tries to upgrade from ws to wss.

Content-Security-Policy: Upgrading insecure request ‘ws://super-acorn-qvp5jgj4rgf97g9-3001.app.github.dev/9125841575581c6d4f0f633b6d1a798ecd199758’ to use ‘wss’
Content-Security-Policy: The page’s settings blocked the loading of a resource (connect-src) at https://github.dev/pf-signin?id=silent-mountain-ck5plmc&cluster=use2&name=super-acorn-qvp5jgj4rgf97g9&port=3001&pb=https%3A%2F%2Fsuper-acorn-qvp5jgj4rgf97g9-3001.app.github.dev%2Fauth%2Fpostback%2Ftunnel%3Frd%3D%252F9125841575581c6d4f0f633b6d1a798ecd199758%26tunnel%3D1 because it violates the following directive: “connect-src ws://super-acorn-qvp5jgj4rgf97g9-3001.app.github.dev/9125841575581c6d4f0f633b6d1a798ecd199758” [fake.html](https://1mn89f2cnojn8som5njndrklrcou4a5mfqmddboac866oqpas2vd.assets.github.dev/stable/dc96b837cf6bb4af9cd736aa3af08cf8279f7685/out/vs/workbench/contrib/webview/browser/pre/fake.html?id=fd0aeb67-29b6-4752-94cd-33c54ebf842a)
Firefox can’t establish a connection to the server at wss://super-acorn-qvp5jgj4rgf97g9-3001.app.github.dev/9125841575581c6d4f0f633b6d1a798ecd199758. [main.js:18:16](https://vscode-remote+codespaces-002bsuper-002dacorn-002dqvp5jgj4rgf97g9.vscode-resource.vscode-cdn.net/home/codespace/.vscode-remote/extensions/ms-vscode.live-server-0.4.13/media/main.js)
WebSocket error: [main.js:39:12](https://vscode-remote+codespaces-002bsuper-002dacorn-002dqvp5jgj4rgf97g9.vscode-resource.vscode-cdn.net/home/codespace/.vscode-remote/extensions/ms-vscode.live-server-0.4.13/media/main.js)
error { target: WebSocket, isTrusted: true, srcElement: WebSocket, currentTarget: WebSocket, eventPhase: 2, bubbles: false, cancelable: false, returnValue: true, defaultPrevented: false, composed: false, … }

In other contexts, you will see a "Mixed Content" error.

scbrubaker02 commented 3 months ago

It turns out that the failure of live refresh in codespaces in addressed in the FAQ under "I'm trying to use Live Preview in Codespaces and the embedded preview isn't working."

Meanwhile, the CSP errors listed above are actually related to a different websocket connection that has an obscure role in handling navigation history.

Closing.