I am trying to setup the solution for a web application which uses ASP.NET with .NET Framework 4.8 for the backend and Angular 13 for the frontend (we cannot use .NET Core or any newer version because some of the libraries we need to use are only available for .NET Framework).
In the solution, the angular project is in the same folder as the backend project (where the sln file is also located). Now, I created a publish profile for the backend project but it is not yet linked to the angular project in any way, so the output folder only contains the files for the backend. In addition to that, I built the angular frontend via ng build which generated all of the files I need for the frontend in the dist folder.
How can I deploy this to an IIS webserver so users can see and work with the angular frontend and all http requests to the backend are routed to the appropriate controller and action in my ASP.NET application? Are there any tutorials or instructions for this? So far, I was not able to find what I am looking for and I am very confused how I am supposed to make this work in IIS.
Related
I am using ABP Framework 5.2.2 and created an application using the "blazor" (webassembly) template. This creates a HttpApi.Host application and a Blazor application that run on separate sites.
How can I serve the Blazor files and host the API from the same site?
This can be done with one of the standard templates in Visual Studio, but how do I do this in the ABP Framework?
I've tried adding the Blazor project as a dependency in the HttpApi.Host project and eventually can get the index page to load, but that's as far as it goes.
Thanks for the help
I'm trying to deploy .net core app with Angular, a project I created from the template available in Visual Studio.
The application I have in IIS is set to run from the angular app
Now within the same application, I added api application which is pointing to the api folder:
While I'm able to access the angular app, when I'm trying to login by calling the controller in the .net core application I'm getting this error:
System.InvalidOperationException: The SPA default page middleware
could not return the default page '/index.html' because it was not
found, and no other middleware handled the request. Your application
is running in Production mode, so make sure it has been published, or
that you have built your SPA manually. Alternatively you may wish to
switch to the Development environment.
Previously, when I was working with angular and .net core I had one project in VS for the .net core app and one project for the angular app and they were running from different subdomains, for example app.mywebsite.com for the angular app and api.mywebsite.com for the .net core app and I didn't have issues.
I was hoping with the .net core / Angular template I'll be able to run both the app and the api from one project but I'm currently experiencing the issues I mentioned above.
I am trying to make a web based application using Spring MVC (5th version) & Angular 5... My idea is, Spring MVC will provide restful web-services & Angular 5 will call those web-services & manages User Interface at client side..
My question is, whether I require 2 separate web applications (one for UI & one for web-services) to be run on the server ? if yes- what will be the web-server for angular 5 application ? if no - how do we integrate angular 5 with spring MVC?.. could any one provide me the working example- how to be implement spring MVC with angular 5? Is it good practice to run both the application on single web-server? What do you suggest?
Any Help would be highly appreciated... Thanks a lot in advance..
1) you compulsory don't need 2 web application to be run on server.
2) you can build the angular project and then copy all the files from dist directory of angular project to WebContent directory of spring project.
3)
Follow below steps to run SPRING MVC with Angular5 on a single server.
1.Create normal Dynamic web project.
2.Add all dependancy required for spring or user maven pom.xml
3.Open CMD, navigate to angular2 application. Hit command
'npm install'
and then
'ng build'
or use 'ng build --prod' for production build.
this command will create a “dist” folder, copy all files including all folders.
4. Paste those files and folders into 'WebContent' directory.
5. Last thing, you need to change basehref=”./” in index.html.
Now you are ready to run server or you can deploy war file and serve it with tomcat or other servers.
i have found git repo containing full working example of Spring MVC with angular 2:https://github.com/rakshitshah94/Angular2-SpringBoot-Example
4) NO it can't be said good practice to include angular build files in Spring MVC project. because every time you make changes to angular, you have to rebuild your Spring war file and deploy it again to webserver.
Intergrate Spring4MVC with Angular 2 on a single server. Please refer this link. It will work Angular 5 as well
I currently have a Play project where Angular Front-end is integrated into it with Gulp. Now I need to re-use the angular code into a .Net Web-Api project. Having APP and API as separate project will work. But to avoid dealing with different ports and CORS only option is to have one project that is deployed to one port where AngularJs project gets integrated along with Web Api project.
I have checked many question only this Stack-overflow answer seems relatable to my scenario but no luck with that solution too.
Does anyone know how to do that kind of integration. And is it possible to have integrated both into one project
Create ASP.NET MVC application.
Change default Index.cshtml with your index.html from Angular application. (You'll maybe need to correct paths to other files).
Now ASP.NET runs your application so you can add WebAPI Controllers instead of MVC Controllers inherit from ApiController.
Could anybody please help me out regarding how to implement Angular 2 with Asp.Net Web API? Any tutorial link would be helpful.
There is very little to no documentation available in this regard.
I did implement the https://angular.io/docs/js/latest/quickstart.html
But it requires npm start which starts the node server useful for CommonJS module loading. I want to use IIS and Web API. Can I use CommonJS or do I have to use any other module system
If I use CommonJS with IIS development server I get this error:
in the console. The same link works fine when I start using Node server. This means on the production server I have to use Node as well as IIS for Web API? Is there any way I can use Angular 2 only with IIS and possibly eliminate CommonJS if needed. Any tutorial to Angular 2 with Asp.Net would be helpful.
You have to use SystemJS as your module system, if you want to use it exactly like in the tutorial. If you want to use CommonJS, use something like Browserify.
You can have a look to following article for Angular 2 and Asp.net MVC with Web API.
https://www.codeproject.com/Articles/1181888/Angular-in-ASP-NET-MVC-Web-API
It's a good one but this article uses Asp.Net MVC in the middle.
You might consider to remove Asp.net mvc part and develop a website with Angular(client side) and web api(server side).
This one is a simple example.
https://github.com/thinktecture/apisummit-2016-angular2-webapi
On the other hand, if you want to use IIS then you need the build your angular project with
ng build --prod
and move the dist folder into your IIS website folder. Note that you don't need a node server on IIS because nb build transpiles old the typescript files into javascript and gets the other static files(html, css, js, etc...) and prepares for you to deploy to any web server like IIS.
another sample angular(client side)-Asp.Net Web API(server side)
https://www.youtube.com/watch?v=AYgs0kLjTLE