Angular 4 throwing error EventSource's response has a MIME type ("text/html") that is not "text/event-stream" after migrating to .NetCore 2.0

Question

I have an existing SPA based on Asp .Net Core (I was using Yo generator-aspnetcore-spa to generate a template). It worked perfectly fine, but after migration to .NetCore 2.0 it started to throw the error:

EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection.

As I understood this problem affects only auto-refresh after updating any file (hot module replacement as far as I know). All other stuff is working fine.

So, the question is how to fix the error above?

Answer 1

I found the solution, mainly the problem is in .NetCore routing system, it is taking over and trying to handle the request, returning text/html, so it's sending the actual webpack_hmr hot file. To fix it you need to edit Configure method in the Startup.cs file.

1. Before:

   // some code
   app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions {
               HotModuleReplacement = true                    
           });
   //some code
   

2. After:

   // some code
   app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions {
               HotModuleReplacement = true,
               HotModuleReplacementEndpoint = "/dist/__webpack_hmr"                   
           });
   // some code
   

The solution is taken from this thread on GitHub

Answer 2

Try Changing the hosting environment from Production to Development

1. Check whether your Hosting environment is set to Production or to Development (Webpack HMR is disabled for Production)
2. Change the Hosting environment to Development.
   Add export ASPNETCORE_ENVIRONMENT=development to your ~/.bash_profile or ~/.zshrc file.
   Follow the link for more exhaustive explanation.
   Thus your output should be:

This link explains how to change the env in more depth.