WebSocket connection to 'ws://localhost:4000/sockjs-node/612/2pdjfv15/websocket' failed: Connection closed before receiving a handshake response error WebSocket connection to 'ws://localhost:4000/sockjs-node/612/2pdjfv15/websocket' failed: Connection closed before receiving a handshake response error angular angular

WebSocket connection to 'ws://localhost:4000/sockjs-node/612/2pdjfv15/websocket' failed: Connection closed before receiving a handshake response error


I've had this occur recently with Angular 11 (Ivy). The solution should be relevant to webpack-dev-server in general -- since this is an identical behavior.

The issue occurs when when load the webpack-dev-server application is loaded on a separate webserver endpoint. The sockjs-node connection thinks that it needs to use an absolute url relative to the web root -- which won't work since your webserver root is pointing to a different process/port/host than the dev webserver.

I scoured the interwebs for what CLI or property to set to override the base that it uses -- I haven't found anything (yet!)

Solution: Build your project each time you make changes and test it. Generally a non-production build only takes a minute, so it's not bad.