Do I need a separate Web Site in IIS for my ASP.NET Core Web API project and my Angular project?

Question

How can I host the published result of this simple tutorial in IIS? Is there guidance on how best to accomplish this?

The solution contains an ASP.NET Core Web API project (backend) and an Angular project (front-end). It works in VS2022 (using IIS Express). When I publish the backend project, it also contains the wwwroot folder containing the Angular files (see below).

In IIS (on my Windows 10 workstation), I added a new Web Site bound to http port 84 and set the app pool to No Managed Code and pointed it to the publish folder (see below).

http://localhost:84 results in 404, but http://localhost:84/weatherforecast returns the JSON response as expected. The Web API project is working as expected, but not the Angular part. I'm guessing that's because

I could host both projects as separate Web Sites in IIS and I would have to do two separate publish steps (not that big of a deal), but the Web API publish folder would still contain the wwwroot folder with the Angular files, which feels wrong.

Another option would be to have a single project that contains the Web API and Angular files together, but that also feels wrong.

Given that Microsoft's guidance (via the tutorial) is to have the separate projects and publish them together, it seems like there would be a good way to host them that way in IIS and that someone in this community knows the answer (any other gotchas appreciated as well).

C:\kk\AngularTypeScript\publish
|-- Backend.deps.json
|-- Backend.dll
|-- Backend.exe
|-- Backend.runtimeconfig.json
|-- Microsoft.OpenApi.dll
|-- Swashbuckle.AspNetCore.Swagger.dll
|-- Swashbuckle.AspNetCore.SwaggerGen.dll
|-- Swashbuckle.AspNetCore.SwaggerUI.dll
|-- appsettings.Development.json
|-- appsettings.json
|-- web.config
`-- wwwroot
    |-- 3rdpartylicenses.txt
    |-- favicon.ico
    |-- index.html
    |-- main.e3e89bda804b4330.js
    |-- polyfills.69ca295dd26cc35d.js
    |-- runtime.f8659de94caf0803.js
    `-- styles.ef46db3751d8e999.css

Answer 1

I ended up finding this answer myself, so I'll post it here in case it helps someone else down the line.

The critical piece here is the addition of the following two lines of code in the ASP.NET Core Web API project's Program.cs file.

app.UseDefaultFiles();
app.UseStaticFiles();

Additionally, I configured the IIS Web Site's Authorization Rules to allow All Users (this is not production advice, this is to get it up and running on your local machine). Since the tutorial and template do not include a web.config file (it gets autogenerated during the Publish step), you'll either need to do this step via IIS (every time you publish) or add a web.config file to the project and include the relevant section of code there (FWIW, I included a web.config file). I've included both below for completeness.

I named my project Backend, which is why you'll see Backend.dll (you'll need to change that accordingly). Also, you'll see the authorization section.

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <location path="." inheritInChildApplications="false">
        <system.webServer>
            <handlers>
                <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
            </handlers>
            <aspNetCore processPath="dotnet" arguments=".\Backend.dll" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" hostingModel="inprocess" />
        </system.webServer>
    </location>
    <system.webServer>
        <security>
            <authorization>
                <add accessType="Allow" users="*" />
            </authorization>
        </security>
    </system.webServer>
</configuration>

Since I already had a Web Site bound to port 80, I bound this site to port 83.

In your browser, go to

http://localhost:83 to see the Angular site load (with data from the backend Web API)

http://localhost:83/weatherforecast to see the JSON response from the WEB API controller.

There are other necessary steps to host ASP.NET Core in IIS, but those aren't specific to this question.

Hope this helps someone else!

Answer 2

My suggestion is to follow Microsoft's tutorial to publish them together, as for the 404 errors you get, check if you have url rewrite installed, if not, install it.

Install URL Rewrite.