'Vite. http proxy error at /weatherforecast...' error when launching the Angular and ASP.NET Core app in Visual Studio

Question

I created an app from the 'Angular with ASP.NET Core' project template in Visual Studio 2022 17.8 and .NET 8. It launches the API app in Chrome and the Angular app in Edge. In Edge it doesn't show the weather temperature values. I see the error below in the console. The app used to work but then I tried to make Chrome the default browser for the Angular app and it never properly anymore. I made Edge the default browser for the Angular project. I also deleted and recreated the app several times and it never worked correctly anymore. Using Node 20 and Angular 17.

What could be the issue? I don't know much about Vite and how it relates to the reverse proxy in ASP.NET.

Error:

[vite] http proxy error at /weatherforecast: AggregateError at internalConnectMultiple (node:net:1114:18) at afterConnectMultiple (node: net: 1667:5)

Answer 1

[vite] http proxy error at /weatherforecast: AggregateError at internalConnectMultiple (node:net:1114:18) at afterConnectMultiple (node: net: 1667:5)

The reason is that the client loads faster than the server. Right click the server project, and execute debug from there, and see if you still get the error.

In Edge it doesn't show the weather temperature values.

It actually does show the values, however, the color of the font is silver, and is semi transparent. Click down, and drag your mouse over the weather table.

Answer 2

Continuing off of what Rich76 said, the server needs to be started before starting the client. The default VisualStudio project does not do this for you. Heres a quick fix:

Right click on your server project, and "Set as Startup project". Now, when you click on the run button, the server starts first, then the client, and everything is wired properly.