CODEWITHSUNDEEP
angularangular-cliasp.net-core-webapi
Adrian Brand
Adrian Brand

Reputation: 21638

Best way to integrate Angular 2 and .NET Core Web API?

I currently have 2 project for my solution. The frontend is an Angular 2 app created with the Angular cli and the backend in a .NET Core Web API.

How can I integrate both of these applications together so they are served on the same port? Currently I have put headers into the web API to allow all domains in cross origin requests but I don't want to do that in production and I also need to introduce authentication so I need a cookie that is shared between the Angular 2 app and the API.

I still want to use the Angular cli for scaffolding the Angular app but want the frontend served via the same port as the api.

I would like to add the Angular cli files to the Visual Studio project so that when I start an instance of the api it is also serving the frontend project.

Also when I do a publish from Visual Studio I would like it to do and ng build and include a production build of the frontend with the api. Is this possible?

Upvotes: 3

Views: 1664

Answers (2)

Artin Falahi
Artin Falahi

Reputation: 1151

You can't do that due to several reasons. It leads to conflict in two app routing. Also I don't think so web servers like Apache or IIS are enable to do that. I suggest you create subdomain for asp.net api like api.domain.com and host your angular app in main domain.

In addition your idea to combine angular app and asp.net is not usual since both apps need different tools to compile/transpile or deploy.

Upvotes: 1

Brivvirs
Brivvirs

Reputation: 2493

There is angular2 template for core, which is using webpack and server side rendering as well (angular universal). http://blog.stevensanderson.com/2016/10/04/angular2-template-for-visual-studio/

Unfortunately there are couple limitation regarding on server side rendering (like access to dom).

If so, you can start your angular2 project directly from index.cshtml and configure everything manually regarding on template settings.

Upvotes: 0

Related Questions