When a running task that opens a server on a port, that port will be attached to the task, turning it into a Preview-type DevTool. Previews appear at the beginning of the list when you toggle the DevTools dropdown.
We’ve patched WebSocket to ensure that the right URL is always accessed when opening a websocket. In case you try to access
http://localhost:3000 (opens in a new tab) using a websocket, we’ll rewrite it to
https://3000-:id.preview.csb.app so the socket automatically connects to the right URL.
This will often make hot module reloading work out of the box for frameworks like Vite.
If possible, we try to install a service worker in the preview that will proxy requests to
localhost:3000 (opens in a new tab) to the corresponding dev URL. The service worker only proxies URLs that are going to localhost, or URLs that go to e.g.
The service worker proxy is enabled by default, but you can turn it off in two ways:
- Configure the dev server to respond with the
x-csb-no-sw-proxyheader when sending HTML responses (any value is possible)
- Or, set
falsein the localStorage:
x-csb-no-sw-proxy header is set, we automatically add
localStorage.setItem('csbLocalProxyEnabled', 'false'); to the returned HTML from the dev server.