CODEWITHSUNDEEP
angularasp.net-corelivereload.net-core-3.1
Aceofspades25
Aceofspades25

Reputation: 373

Live reloading no longer seems to work with Angular in .net core 3.1

I'm trying to scaffold up a brand new ASP.NET Core Web Application in Visual Studio 2019 with an Angular template targeting ASP.NET Core 3.1.

While the application works, Live Reloading will only work once or twice before breaking and then it stops working altogether regardless of whether you make changes to .ts files or .html files. Closing Visual Studio and then using the task manager to shut down instances of Node.js sometimes gets it working again but then if you're lucky it will only do a live reload once or twice before breaking again.

I can tell that the Angular CLI is recompiling my code every time I save changes because all I have to do is click on the address bar in my browser and hit enter to see my changes being reflected. So this appears to primarily be a failure in trying to send the browser a refresh command.

Things I have tried to narrow down this issue:

    if (env.IsDevelopment())
    {
        //spa.UseAngularCliServer(npmScript: "start");
        spa.UseProxyToSpaDevelopmentServer("http://localhost:4200");
    }

The Live reloading bug is still present in this scenario

Has any one else had this issue or found any work arounds? I would really like to start my new project in .net core 3 but I am concerned that it has issues and doesn't play well with Angular at the moment.

EDIT

I don't know if it's related but this problem shows up slightly differently in Internet Explorer. In IE, bringing up the console repeatedly shows the following script errors occuring over and over

Invalid Host/Origin header
[WDS] Disconnected!

enter image description here

These script errors disappear when using an older Angular framework (5.2.0) but live reloading still does not work in this case so long as I'm using ASP.NET Core 3.1

It is also possible to prevent these script errors using either

"disableHostCheck": true (angular.json -> architect -> serve -> options)

OR "start": "ng serve --configuration es5 --disable-host-check" (package.json)

BUT this will not fix live reloading in internet explorer

Upvotes: 6

Views: 5209

Answers (1)

Aceofspades25
Aceofspades25

Reputation: 373

It appears that this bug has been posted about here:

https://github.com/dotnet/aspnetcore/issues/11498

One solution that works was posted by user Cito: https://github.com/dotnet/aspnetcore/issues/11498#issuecomment-566928086

To get live reloading working, make sure to enable SSL in your webserver settings. I'm not sure why Live Reloading only works in .NET Core 3.1 over SSL but it does.

I'd be interested to hear why this fixes the problem if anyone has any theories

Upvotes: 2

Related Questions