我的 ASP.NET Core Web API 项目和 Angular 项目是否需要在 IIS 中使用单独的网站？答案

【问题标题】：Do I need a separate Web Site in IIS for my ASP.NET Core Web API project and my Angular project?我的 ASP.NET Core Web API 项目和 Angular 项目是否需要在 IIS 中使用单独的网站？
【发布时间】：2022-10-13 03:23:03
【问题描述】：

如何在 IIS 中托管此 simple tutorial 的已发布结果？是否有关于如何最好地做到这一点的指导？

该解决方案包含一个 ASP.NET Core Web API 项目（后端）和一个 Angular 项目（前端）。它适用于 VS2022（使用 IIS表达）。当我发布后端项目时，它还包含包含 Angular 文件的 wwwroot 文件夹（见下文）。

在 IIS（在我的 Windows 10 工作站上）中，我添加了一个绑定到 http 端口 84 的新网站，并将应用程序池设置为无托管代码并将其指向发布文件夹（见下文）。

http://localhost:84结果为 404，但 http://localhost:84/weatherforecast 按预期返回 JSON 响应。 Web API 项目按预期工作，但不是 Angular 部分。我猜那是因为

我可以在 IIS 中将这两个项目作为单独的网站托管，并且我必须执行两个单独的发布步骤（没什么大不了的），但 Web API 发布文件夹仍将包含带有 Angular 文件的 wwwroot 文件夹，这感觉不对.

另一种选择是拥有一个同时包含 Web API 和 Angular 文件的项目，但这也让人感觉不对。

鉴于微软的指导（通过教程）是拥有单独的项目并将它们一起发布，似乎有一种在 IIS 中以这种方式托管它们的好方法，并且该社区中的某个人知道答案（任何其他陷阱表示赞赏以及）。

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

【问题讨论】：

标签： angular visual-studio asp.net-core iis asp.net-core-webapi

【解决方案1】：

我的建议是按照微软的教程一起发布，至于你得到的404错误，检查你是否安装了url rewrite，如果没有，安装它。

Install URL Rewrite。

【讨论】：

我已经安装了重写模块（但感谢您指出这一点，以防我错过了）。我需要对本教程进行一些修改以使其在 IIS 中运行吗？

【解决方案2】：

我最终自己找到了这个答案，所以我会把它贴在这里，以防它帮助其他人。

这里的关键部分是在 ASP.NET Core Web API 项目的 Program.cs 文件中添加以下两行代码。

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

此外，我将 IIS 网站的授权规则配置为允许所有用户（这不是生产建议，这是为了让它在您的本地计算机上启动并运行）。由于教程和模板不包含 web.config 文件（它在发布步骤中自动生成），您需要通过 IIS 执行此步骤（每次发布时）或将 web.config 文件添加到项目中并在那里包含相关的代码部分（FWIW，我包含了一个 web.config 文件）。为了完整起见，我将两者都包括在下面。

我将我的项目命名为 Backend，这就是为什么您会看到 Backend.dll（您需要相应地更改它）。此外，您将看到授权部分。

<?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=".logsstdout" hostingModel="inprocess" />
        </system.webServer>
    </location>
    <system.webServer>
        <security>
            <authorization>
                <add accessType="Allow" users="*" />
            </authorization>
        </security>
    </system.webServer>
</configuration>

由于我已经有一个绑定到端口 80 的网站，我将这个站点绑定到端口 83。

在您的浏览器中，转到

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.

在 IIS 中托管 ASP.NET Core 还有其他必要步骤，但这些步骤并不特定于这个问题。

希望这对其他人有帮助！

【讨论】：