angular - 使用 web.config 在 IIS 服务器上部署 Angular 9 通用 9？如何在 IIS 服务器上部署 Angular 9 服务器端渲染

以下是创建示例应用程序并在 iis 中部署的步骤：

1) 安装 Angular 10 CLI 并初始化一个新项目。（如果您已经创建了应用程序并安装了 npm，则可以跳过此步骤）

npm install -g @angular/cli
ng new angular-seo-app

2）回到你的命令行界面，首先导航到你的项目文件夹：

cd angular-seo-app

ng add @nguniversal/express-engine --clientProject angular-seo-app

原理图会自动将所需的配置和包添加到您的项目中，甚至会添加一个 Express 服务器。

Express 服务器将呈现 Angular 应用程序的一部分并将 HTML 返回给浏览器。服务器默认运行在4000端口

3）返回您的终端并运行以下命令：

npm run build:ssr 
npm run serve:ssr

这将使用 SSR 支持构建您的项目，并从 http://localhost:4000 地址启动 Express 服务器。

您将在项目文件夹中看到 dist 文件夹。

4）转到您的 Windows 服务器（C:\inetpub\wwwroot）并创建一个空文件夹（例如，将其命名为 ng-ssr）

5）复制到dist文件夹到ng-ssr

6) 打开 C:\inetpub\wwwroot\ng-ssr\dist\angular-seo-app\server 文件夹，你会发现 main.js 文件

7) 复制 main.js 并直接粘贴到 ng-ssr 文件夹中

8）在您的 ng-ssr 文件夹中创建 web.conifg 文件并在其中添加以下代码：

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>        
      <handlers>
        <add name="iisnode" path="main.js" verb="*" modules="iisnode" />
      </handlers>
      <rewrite>
        <rules>
            <rule name="DynamicContent">
                 <match url="/*" />
                 <action type="Rewrite" url="main.js"/>
            </rule>
            <rule name="StaticContent" stopProcessing="true">  
                  <match url="([\S]+[.](jpg|jpeg|gif|css|png|js|ts|cscc|less|ico|html|map|svg))" />
                  <action type="None" />
            </rule>  
       </rules>
      </rewrite>
        <staticContent>
          <clientCache cacheControlMode="UseMaxAge" />
          <remove fileExtension=".svg" />
          <remove fileExtension=".eot" />
          <remove fileExtension=".ttf" />
          <remove fileExtension=".woff" />
          <remove fileExtension=".woff2" />
          <remove fileExtension=".otf" />
          <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
          <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />
          <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
          <mimeMap fileExtension=".woff" mimeType="application/x-woff" />
          <mimeMap fileExtension=".woff2" mimeType="application/x-woff" />
          <mimeMap fileExtension=".otf" mimeType="application/otf" />
         </staticContent>      
    </system.webServer>
  </configuration>

IIS web.config 文件是一个 XML 文件，其中包含 Web 服务器上特定站点（或目录）的规则。它类似于 Apache 中的 .htaccess 文件。此文件可能包含您网站的规则设置 404、403 等错误页面以及旧 URL 的重定向规则。

我们的 web.config 文件包含 URL 重写规则、iis 节点设置和 mime 类型。

注意：下载URL Rewrite和iisnodex64，iisnodex86

现在您的网站文件夹必须如下所示：

9) 在 IIS 中创建网站

并添加文件夹路径：C:\inetpub\wwwroot\ng-ssr

10) 在 IIS 中，转到您创建的网站的应用程序池，将 .Net Framework 版本更改为无托管代码

注意：确保将 iis_iusrs 和 iusr 完全控制权限分配给 ng-ssr 文件夹。

浏览您的网站：

angular - 使用 web.config 在 IIS 服务器上部署 Angular 9 通用 9？如何在 IIS 服务器上部署 Angular 9 服务器端渲染

问题描述

解决方案

推荐阅读