-
Notifications
You must be signed in to change notification settings - Fork 12k
"[WDS] Disconnected!" error on new Angular 6 project #11060
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Comments
Me acabo de encontrar con el mismo error en un proyecto recien creado con Angular 6, no entiendo muy bien lo de wds disconected!, pero he buscado por google y wds hace referencia a "Wireless Distribution System". yo suelo tener problemas con la conexión wifi, pequeños cortes de conexion, no creo que este sea el problema, pero he comprobado otra cosa, cuando cargo la página por primera vez no aparece el error, este aparece cuando refreco la página con F5, abriendo una nueva ventana y accediendo a la página de nuevo el error no aparece, pero vuelve a aparecer cuando refresco la página. Esperemos que no tenga importancia el error y que alguien experimentado en Angular nos despeje esta duda. un saludo I just found with the same error in a project just created with Angular 6, I do not understand very well the wds disconected !, but I searched for google and wds refers to "Wireless Distribution System." I usually have problems with the Wi-Fi, small connection cuts, I do not think this is the problem, but I have checked something else, when I load the page for the first time the error does not appear, it appears when I refrigate the page with F5, opening a new window and accessing the page again the error does not appear, but it reappears when I refresh the page. Hopefully it does not matter the error and that someone experienced in Angular will clear this doubt. a greeting |
Buenos dias, reporto el mismo problema con Angular 6 Este error me aparece cuando declaro "<h1 [ngStyle]="{ 'background': colorHex() }"> Quito el [ngStyle] y no aparece error, no se a q se deba esto. [WDS] Disconnected! vendor.js:133520:5 |
Angular CLI 6.1.X moved back to webpack 4.6.0. UPD: |
Hello, I am getting this error . Angular: 6.0.8 |
Receive similar [WDS] Disconnected! message on page refreshes only. Navigating to the page directly does not create the message, nor does any router view changes.
|
Firefox : 61.0.2
|
I'm seeing same behavior. It's brought me to a grinding halt. |
Got the same error. But! I don't know why and how, after disabling wi-fi i have running ng serve and auto-reloading got worked. Error still appear in console(in firefox, but not in chrome), but auto-reloading is working without problems(and after enabling wi-fi and rerun ng serve it's still working). |
I found a solution for my situation and posted about it here: webpack/webpack-dev-server#851 |
Hi all, I'm trying to gather some more information about this issue but finding it hard to reproduce on the latest CLI. Can someone give me reproduction steps? Preferably that don't need VMs, as that complicates the setup. |
@filipesilva I could send you project, which isn't ginormous, but I found that the symptoms only began after a certain level of complexity was reached. (Could yet turn out to be a bug or wrong step on my part, but that's how it played out for me...) Let me know if you would like to proceed. This week is rough, but I could send it to you next week. |
@WellspringCS I'm game, let me know when suits. |
Any update on this? |
To my shame, I've not followed through. @filipesilva I confess I don't know how to send you the code privately. What's the typical route by which this is done? I'm not too adept with github yet. |
Just learning angular here so can't make an in depth comment or have any idea what it means. I'm getting this running the first few steps of the heroes app tutorial, i.e. it is close to a clean new project. When I Angular CLI: 7.1.0 Package Version@angular-devkit/architect 0.11.0 |
Hi!, -Invalid Host/Origin header Error loop is happening, it showed up in a project I started, so I tested with a brand new project and it show up on ng serve. |
For anyone who is having the same issue with the"webpack-dev-server": A loop of Invalid Host/Origin header -> [WDS] Disconnected! errors. I found that in the webpack-dev-server release 3.1.11 they added a check for the origin websocket connection, the problem is that when you make the call from a same origin connection browsers do not add an origin to the headers so the validation always failed. For a quick fix you can edit the "Server.js" file in the webpack-dev-server>lib>Server.js path: Or you can add a validation that triggers only when the 'origin' property is present in the headers object. I hope this may be helpful for someone that face the same issue. |
Since yesterday several students in our Angular courses (and I myself) suddenly faced this issue. |
The warning points to a solution for the WDS disconnect issue. Using --disable-host-check will additionally warn the user that this might be insecure. Fixes angular#11060
This is a configuration issue and will not be fixed. You can use The proper way to fix this is to implement a reverse proxy to your development server, which requires a lot more than what |
The warning points to a solution for the WDS disconnect issue. Using --disable-host-check will additionally warn the user that this might be insecure. Fixes #11060
The warning points to a solution for the WDS disconnect issue. Using --disable-host-check will additionally warn the user that this might be insecure. Fixes #11060
The Invalid Host/Origin Header problem I reported above (same like in @MichFe's screenshot) had suddenly appeared for us on 2018/12/22 (for different developers independently, after having created new projects with |
In angular.json, add the following under architect -> serve -> options: |
issue resolved after adding below in polyfills.ts file: |
I have set "disableHostCheck": true. Still getting this error, constantly. If I change tabs in Chrome and let the tab load in the background, it works fine. I can also temporarily resolve it by killing the dev server and restarting |
received this error too "[WDS] Disconnected!" on firefox. It's ok when the page is loaded for the first time but, if I reload or refresh the page this error appears. Anyway to fix this ? Already tried the fixes above nothing works. Angular CLI: 7.3.5 Package Version@angular-devkit/architect 0.13.5 |
any update on this one, it seems to only appear on initial load and if i reload the page the error disappears. |
I had the same issue after upgrading to Angular 6.0. I found that my inastalled zone.js version was 9.0. I downgraded to ^0.8.26 and it worked. |
I tried this downgrade fix but didn't worked for me using Angular 7.3.7. Opened a new thread for this because the TS here Closed this thread. Follow the link above for the others who's facing this problem too. It's still open as of now. |
el mismo error, al iniciar no aparece.. despues de refrescar la pagina si [WDS] Disconnected! client:177 |
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
After upgrading my Angular 5.2 app to 6.0 the connection to the Webpack Dev Server could not be established anymore ("[WDS] Disconnected!"). I then verified that the same problem occurs on a newly created project as well.
Versions
Ubuntu 16.04 Vagrant VM running under Windows 10.
Port 4200 is forwarded in the Vagrantfile:
config.vm.network "forwarded_port", guest: 4200, host: 4200
Repro steps
ng new blabla
in the VMng serve --host 0.0.0.0 --port 4200 --disable-host-check
http://<ip-of-my-vm>:4200
in the host's browser (Firefox and Chrome tested)[WDS] Disconnected!
appears in the browser's consoleObserved behavior
As similar [WDS] problems seem to have struggled a lot of people in the past I tried to follow their advices but never found something to solve it.
To narrow down the error I created a new project to see if the error persists - and it does.
When I follow the above steps the [WDS] Disconnected! error occurs and live updates don't work.
I have stepped through what is happening before that error and noticed that SockJS cannot establish a connection because all its 'transport' mechanism return 'disabled'.
For example in SockJS's
sockjs-client/lib/transport/websocket.js
you find this:But
WebsocketDriver
isundefined
although Websockets are supported by the browsers I use (FF 60, Chrome 66).The other transport mechanisms of SockJS also return
false
whenenabled
is requested on them so SockJS has no valid transport mechanism left and closes the connection before any request has been made which then causes the output of[WDS] Disconnected!
.Desired behavior
As I had no problems with the dev server in my setup when using Angular 4 or 5 I would have expected the
ng serve
command to still work the way it has.But something must have changed in either the webpack dev server, SockJS, faye-websocket or the angular cli that now makes this error pop up. I unfortunately couldn't find out what.
Mention any other details that might be useful (optional)
I also tried out if there's a difference when using nginx as a reverse proxy instead of using the VM's forwarded port, but there isn't...
fyi: For the Angular 5.2 project I used the same version of node
The text was updated successfully, but these errors were encountered: