运行Angular 2/4路由而不是.net Core路由

Question

in my Angular Module I have the following Route:

 { path: "something/:id", component: SomeComponent }

which runs fine when using "routerLinks" frontend, but as soon as I manually write the ID in the URL and press Enter, It runs the C# backend method instead and ignores the angular route.

[HttpGet("{myid:guid}")]

The backend method returns Json as it should but I cant get my Angular route to display my component, seeing I go straight to the Controller.

So my question is: How do I tell my application to run my frontend route instead of my backend route, or work my way around this problem when manually writing the id in the url?

Any help would be greatly appreciated.

Answer 1

I realise this isnt strictly answering your question, but unless you have a specific requirement to handle them on similar routes, isnt it simpler to serve your API on a clearly distinct route using a subdomain or specific base url fragment?

Eg front end routes go on: www.example.com

API routes go on: www.api.example.com or www.example.com/api/

Note that if you cant use the subdomain option, you'll need to configure URL rewrites in your web.config to route between your API and front end.

Answer 2

Have you tried configuring your startup.cs? On the configure method try:

 app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller=Home}/{action=Index}/{id?}");

                routes.MapSpaFallbackRoute(
                    name: "spa-fallback",
                    defaults: new { controller = "Home", action = "Index" });
            });