将 Angular 通用部署到 IIS
Deploy Angular Universal to IIS
我在 web.config:
中将 Node.js 部署到 IIS 时遇到问题
> <handlers>
> <add name="iisnode-ng-universal" path="dist/server.js" verb="*" modules="iisnode" />
> </handlers>
<rule name="ng-universal" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{HTTP_HOST}" pattern="test" />
</conditions>
<action type="Rewrite" url="dist/server.js" />
</rule>
我收到这个错误：
image
这是我的网络文件树的样子：
web files
我试图给 IIS_IUSRS 和 IUSR 完全权限，但它似乎不起作用。像这样 post 建议：
iisnode encountered an error when processing the request
你能试试下面的代码吗..它对我有用
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<handlers>
<add name="iisnode" path="server.js" verb="*" modules="iisnode"/>
</handlers>
<rewrite>
<rules>
<rule name="DynamicContent">
<match url="/*" />
<action type="Rewrite" url="server.js"/>
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
您的 server.js 可以在 dist 文件夹之外。
经过 2 天的反复试验，以下流程对我有用 (Angular 8)
- 假设您关注了 https://angular.io/guide/universal
- 假设您将 src\tsconfig.server.json 更改为 -- 如果 tsconfig.server.json[ 使用此 注释=61=] 已在 src 文件夹中生成
{
"extends": "./tsconfig.app.json",
"compilerOptions": {
"outDir": "../out-tsc/app-server",
"module": "commonjs"
},
"files": [
"src/main.server.ts" -- old
"main.server.ts" -- use this
],
"angularCompilerOptions": {
"entryModule": "./app/app.server.module#AppServerModule"
}
}
并使用npm 运行 build:ssr && npm 运行 serve:ssr[=17= 编译]
按照此 Post 的答案 1 并从中安装 iisnode
https://github.com/tjanczuk/iisnode (refer this guy's tutorial if required https://www.youtube.com/watch?v=JUYCDnqR8p0)
- 安装 url-从 Link
重写
- 将dist文件夹复制到iis网站文件夹
- 四处移动内容，直到看起来如下所示
website_root:.
│ server.js
│ web.config
│
├───dist
│ └───browser
│ 3rdpartylicenses.txt
│ favicon.ico
│ index.html
│ main-es2015.da6c4688eda738c0ae37.js
│ main-es5.da6c4688eda738c0ae37.js
│ polyfills-es2015.0ef207fb7b4761464817.js
│ polyfills-es5.2b9ce34c123ac007a8ba.js
│ runtime-es2015.e8a2810b3b08d6a1b6aa.js
│ runtime-es5.e8a2810b3b08d6a1b6aa.js
│ styles.09e2c710755c8867a460.css
│
└───server
main.js
部署到 Azure（灵感来自此 ）**
唯一不同的是额外的 'copy files' 任务将服务器文件夹移动到根目录
备注
如果事情不起作用总是使用节点指向 server.js this
node <path to server.js>
这会告诉你最基本的事情，你可能会犯错
将我的 Angular 8 项目升级到 9 之后，我的意思是我几乎将所有内容都升级到了最新版本，发生了几件事。
1.- webpack.config.js 文件被重命名为 .bak 所以似乎不再使用 webpack 了，事实上，如果我尝试重新激活 webpack 构建没有任何反应，它会创建构建但脚本没有 运行。 运行 node server.js进进出出什么都不说
2.- 现在 dist 文件夹的根目录中没有 .js 文件，浏览器和服务器构建的文件夹像以前一样在那里，但即使编辑 web.config 文件以指示 iisnode 运行 server/main.js 而不是 server.js 无论我做什么，总是抛出 500。
3.- 一开始唯一可行的是 运行本地登录
npm run dev:ssr
这意味着在浏览器构建中对视图的引用存在，但它 运行 应该 运行 从根请求 dist/browser。
我修改了 angular.json 中的构建路径和服务器构建路径，以在 ./dist 文件夹的根目录中创建 main.js 文件。
angular.json（修改输出路径）
architect: {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/browser",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "tsconfig.app.json",
...
},
...
},
"server": {
"builder": "@angular-devkit/build-angular:server",
"options": {
"outputPath": "dist",
"main": "server.ts",
"tsConfig": "tsconfig.server.json"
},
...
},
...
}
嗯，问题来了。浏览器构建生成 ./dist/browser 没有问题，服务器构建确实将 main.js 文件直接放在 ./dist 中，但不知何故它决定删除 ./dist/browser 文件夹，当 运行ning 节点 main.js (web.config 指向 to main.js) 它找不到 ./browser/index.html 当然不是因为服务器构建过程被管理删除浏览器文件夹。
hacky 解决方案，运行 第三次构建（浏览器再次构建）
我希望这个问题能得到解决，但老实说，这根本不会打扰我，计算机 运行 构建，而不是我，但你知道，如果服务器构建过程不会删除浏览器构建文件夹。
现在每次我部署选定的构建时，它都会直接从 AppVeyor 直接部署到 Azure App Service，没有任何问题。
package.json（注意服务器构建后的额外生产构建）
{
...
"scripts": {
...
"dev:ssr": "ng run Angular-Universal:serve-ssr",
"serve:ssr": "node dist/main.js",
"build:ssr": "npm run build:universal && ng run Angular-Universal:build:production",
"start:ssr": "npm run build:ssr && npm run serve:ssr",
"build:universal": "ng run Angular-Universal:build:production && ng run Angular-Universal:server:production",
"prerender": "ng run Angular-Universal:prerender"
},
...
}
请注意，build:ssr 脚本同时进行构建，然后浏览器再次构建。
另请注意，serve:ssr 脚本已修改为 运行 dist/main.js
最后，必须修改 server.ts 文件以从 ./browser/index.html 或 ./dist/browser/index.html 请求视图，具体取决于目标系统的文件夹结构。当部署到 Azure App Service main.js 请求 browser/index.html 但如果项目在我的本地环境中使用 npm run dev:ssr 或 node main.js 使用 运行s 在 macOS 上它请求 dist/browser/index.html。反正一个简单的if就可以跳过这个障碍。
server.ts（应用功能变化）
// The Express app is exported so that it can be used by serverless Functions.
export function app() {
const server = express();
let distFolder: string;
const path1 = join(process.cwd(), 'browser'); // Running from the deployed version (production)
const path2 = join(process.cwd(), 'dist/browser'); // Running from the source (macOS local development)
if (fs.existsSync(path1)) {
distFolder = path1;
} else if (fs.existsSync(path2)) {
distFolder = path2;
} else {
return null;
}
console.log('distFolder:', distFolder);
const indexHtml = fs.existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
server.engine('html', ngExpressEngine({
bootstrap: AppServerModule,
}));
server.set('view engine', 'html');
server.set('views', distFolder);
// Example Express Rest API endpoints
// server.get('/api/**', (req, res) => { });
// Serve static files from /browser
server.get('*.*', express.static(distFolder, {
maxAge: '1y'
}));
// All regular routes use the Universal engine
server.get('*', (req, res) => {
res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
});
return server;
}
以防万一你想知道如何将 web.config 文件复制到 dist 文件夹的根目录，好吧，因为我使用 AppVeyor for CI/CD 我已经修改了包含 web.config 的工件创建命令（从 repo 源文件直接进入 .7z 文件）
为什么不包括我的 web.config？
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.web>
<httpRuntime enableVersionHeader="false" />
</system.web>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Strict-Transport-Security" value="max-age=31536000"/>
<add name="X-Content-Type-Options" value="nosniff" />
<add name="X-Frame-Options" value="DENY" />
<add name="X-XSS-Protection" value="1; mode=block" />
<remove name="X-Powered-By" />
</customHeaders>
</httpProtocol>
<webSocket enabled="false" />
<handlers>
<!-- Indicates that the main.js file is a node.js site to be handled by the iisnode module -->
<add name="iisnode" path="main.js" verb="*" modules="iisnode"/>
</handlers>
<rewrite>
<rules>
<rule name="HTTP to HTTPS redirect" stopProcessing="true">
<match url="(.*)" />
<conditions>
<add input="{HTTPS}" pattern="off" ignoreCase="true" />
</conditions>
<action type="Redirect" url="https://{HTTP_HOST}/{R:1}" redirectType="Permanent" />
</rule>
<!-- Do not interfere with requests for node-inspector debugging -->
<rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
<match url="^main.js\/debug[\/]?" />
</rule>
<!-- All other URLs are mapped to the node.js site entry point -->
<rule name="DynamicContent">
<match url="^(?!.*login).*$"></match>
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true"/>
</conditions>
<action type="Rewrite" url="main.js"/>
</rule>
</rules>
<outboundRules>
<rule name="Add Strict-Transport-Security when HTTPS" enabled="true">
<match serverVariable="RESPONSE_Strict_Transport_Security" pattern=".*" />
<conditions>
<add input="{HTTPS}" pattern="on" ignoreCase="true" />
</conditions>
<action type="Rewrite" value="max-age=31536000" />
</rule>
</outboundRules>
</rewrite>
<!-- 'bin' directory has no special meaning in node.js and apps can be placed in it -->
<security>
<requestFiltering>
<hiddenSegments>
<remove segment="bin"/>
</hiddenSegments>
</requestFiltering>
</security>
<!-- Make sure error responses are left untouched -->
<httpErrors existingResponse="PassThrough" />
<!-- Restart the server if any of these files change -->
<iisnode watchedFiles="web.config;*.js;browser/*.*" />
</system.webServer>
</configuration>
我希望这可以帮助处于我情况的其他人，或者至少对辩论有用。在升级到版本 9 后，没有人喜欢挠头试图成功部署到 Azure 应用服务。请让我知道是否可以改进某些地方，也许是一个构建参数以避免浏览器构建文件夹删除或其他什么。干杯。
如果您想 运行 您的 angular 应用程序具有服务器端呈现：
1-新建项目：
ng new anguniversal
2-启用服务端渲染（SSR）
ng add @nguniversal/express-engine
第 1 步
首先执行下面给出的命令，用 express 服务器构建一个 Angular 应用程序。
npm run build:ssr
现在您可以在项目文件夹中看到 dist 文件夹。
第 2 步
在您的 windows 服务器中创建一个新文件夹（例如将其命名为 angular-universal）并从此处复制项目文件夹中的 dist 文件夹
第 3 步
从 dist/anguniversal/server 文件夹中复制 main.js 文件并将其直接粘贴到 angular-universal 文件夹中。
第 4 步
创建并打开 Web.config 文件（在 angular-universal 文件夹中）并向其中添加代码。
<?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>
第 5 步
在服务器上安装 IIS Node & URL Rewrite。
第 6 步
在 IIS 中添加网站...。
第 7 步
在 IIS 中，转到应用程序池。对于您创建的网站 (angular-universal)。然后将 .NET CLR 版本更改为无托管代码。
完成，您可以查看结果。
我在 web.config:
> <handlers>
> <add name="iisnode-ng-universal" path="dist/server.js" verb="*" modules="iisnode" />
> </handlers>
<rule name="ng-universal" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{HTTP_HOST}" pattern="test" />
</conditions>
<action type="Rewrite" url="dist/server.js" />
</rule>
我收到这个错误：
image
这是我的网络文件树的样子：
web files
我试图给 IIS_IUSRS 和 IUSR 完全权限，但它似乎不起作用。像这样 post 建议：
iisnode encountered an error when processing the request
你能试试下面的代码吗..它对我有用
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<handlers>
<add name="iisnode" path="server.js" verb="*" modules="iisnode"/>
</handlers>
<rewrite>
<rules>
<rule name="DynamicContent">
<match url="/*" />
<action type="Rewrite" url="server.js"/>
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
您的 server.js 可以在 dist 文件夹之外。
经过 2 天的反复试验，以下流程对我有用 (Angular 8)
- 假设您关注了 https://angular.io/guide/universal
- 假设您将 src\tsconfig.server.json 更改为 -- 如果 tsconfig.server.json[ 使用此 注释=61=] 已在 src 文件夹中生成
{
"extends": "./tsconfig.app.json",
"compilerOptions": {
"outDir": "../out-tsc/app-server",
"module": "commonjs"
},
"files": [
"src/main.server.ts" -- old
"main.server.ts" -- use this
],
"angularCompilerOptions": {
"entryModule": "./app/app.server.module#AppServerModule"
}
}
并使用npm 运行 build:ssr && npm 运行 serve:ssr[=17= 编译]
按照此 Post 的答案 1 并从中安装 iisnode https://github.com/tjanczuk/iisnode (refer this guy's tutorial if required https://www.youtube.com/watch?v=JUYCDnqR8p0)
- 安装 url-从 Link 重写
- 将dist文件夹复制到iis网站文件夹
- 四处移动内容，直到看起来如下所示
website_root:.
│ server.js
│ web.config
│
├───dist
│ └───browser
│ 3rdpartylicenses.txt
│ favicon.ico
│ index.html
│ main-es2015.da6c4688eda738c0ae37.js
│ main-es5.da6c4688eda738c0ae37.js
│ polyfills-es2015.0ef207fb7b4761464817.js
│ polyfills-es5.2b9ce34c123ac007a8ba.js
│ runtime-es2015.e8a2810b3b08d6a1b6aa.js
│ runtime-es5.e8a2810b3b08d6a1b6aa.js
│ styles.09e2c710755c8867a460.css
│
└───server
main.js
部署到 Azure（灵感来自此
唯一不同的是额外的 'copy files' 任务将服务器文件夹移动到根目录
备注
如果事情不起作用总是使用节点指向 server.js this
node <path to server.js>
这会告诉你最基本的事情，你可能会犯错
将我的 Angular 8 项目升级到 9 之后，我的意思是我几乎将所有内容都升级到了最新版本，发生了几件事。
1.- webpack.config.js 文件被重命名为 .bak 所以似乎不再使用 webpack 了，事实上，如果我尝试重新激活 webpack 构建没有任何反应，它会创建构建但脚本没有 运行。 运行 node server.js进进出出什么都不说
2.- 现在 dist 文件夹的根目录中没有 .js 文件，浏览器和服务器构建的文件夹像以前一样在那里，但即使编辑 web.config 文件以指示 iisnode 运行 server/main.js 而不是 server.js 无论我做什么，总是抛出 500。
3.- 一开始唯一可行的是 运行本地登录
npm run dev:ssr
这意味着在浏览器构建中对视图的引用存在，但它 运行 应该 运行 从根请求 dist/browser。
我修改了 angular.json 中的构建路径和服务器构建路径，以在 ./dist 文件夹的根目录中创建 main.js 文件。
angular.json（修改输出路径）
architect: {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/browser",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "tsconfig.app.json",
...
},
...
},
"server": {
"builder": "@angular-devkit/build-angular:server",
"options": {
"outputPath": "dist",
"main": "server.ts",
"tsConfig": "tsconfig.server.json"
},
...
},
...
}
嗯，问题来了。浏览器构建生成 ./dist/browser 没有问题，服务器构建确实将 main.js 文件直接放在 ./dist 中，但不知何故它决定删除 ./dist/browser 文件夹，当 运行ning 节点 main.js (web.config 指向 to main.js) 它找不到 ./browser/index.html 当然不是因为服务器构建过程被管理删除浏览器文件夹。
hacky 解决方案，运行 第三次构建（浏览器再次构建）
我希望这个问题能得到解决，但老实说，这根本不会打扰我，计算机 运行 构建，而不是我，但你知道，如果服务器构建过程不会删除浏览器构建文件夹。
现在每次我部署选定的构建时，它都会直接从 AppVeyor 直接部署到 Azure App Service，没有任何问题。
package.json（注意服务器构建后的额外生产构建）
{
...
"scripts": {
...
"dev:ssr": "ng run Angular-Universal:serve-ssr",
"serve:ssr": "node dist/main.js",
"build:ssr": "npm run build:universal && ng run Angular-Universal:build:production",
"start:ssr": "npm run build:ssr && npm run serve:ssr",
"build:universal": "ng run Angular-Universal:build:production && ng run Angular-Universal:server:production",
"prerender": "ng run Angular-Universal:prerender"
},
...
}
请注意，build:ssr 脚本同时进行构建，然后浏览器再次构建。
另请注意，serve:ssr 脚本已修改为 运行 dist/main.js
最后，必须修改 server.ts 文件以从 ./browser/index.html 或 ./dist/browser/index.html 请求视图，具体取决于目标系统的文件夹结构。当部署到 Azure App Service main.js 请求 browser/index.html 但如果项目在我的本地环境中使用 npm run dev:ssr 或 node main.js 使用 运行s 在 macOS 上它请求 dist/browser/index.html。反正一个简单的if就可以跳过这个障碍。
server.ts（应用功能变化）
// The Express app is exported so that it can be used by serverless Functions.
export function app() {
const server = express();
let distFolder: string;
const path1 = join(process.cwd(), 'browser'); // Running from the deployed version (production)
const path2 = join(process.cwd(), 'dist/browser'); // Running from the source (macOS local development)
if (fs.existsSync(path1)) {
distFolder = path1;
} else if (fs.existsSync(path2)) {
distFolder = path2;
} else {
return null;
}
console.log('distFolder:', distFolder);
const indexHtml = fs.existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
server.engine('html', ngExpressEngine({
bootstrap: AppServerModule,
}));
server.set('view engine', 'html');
server.set('views', distFolder);
// Example Express Rest API endpoints
// server.get('/api/**', (req, res) => { });
// Serve static files from /browser
server.get('*.*', express.static(distFolder, {
maxAge: '1y'
}));
// All regular routes use the Universal engine
server.get('*', (req, res) => {
res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
});
return server;
}
以防万一你想知道如何将 web.config 文件复制到 dist 文件夹的根目录，好吧，因为我使用 AppVeyor for CI/CD 我已经修改了包含 web.config 的工件创建命令（从 repo 源文件直接进入 .7z 文件）
为什么不包括我的 web.config？
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.web>
<httpRuntime enableVersionHeader="false" />
</system.web>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Strict-Transport-Security" value="max-age=31536000"/>
<add name="X-Content-Type-Options" value="nosniff" />
<add name="X-Frame-Options" value="DENY" />
<add name="X-XSS-Protection" value="1; mode=block" />
<remove name="X-Powered-By" />
</customHeaders>
</httpProtocol>
<webSocket enabled="false" />
<handlers>
<!-- Indicates that the main.js file is a node.js site to be handled by the iisnode module -->
<add name="iisnode" path="main.js" verb="*" modules="iisnode"/>
</handlers>
<rewrite>
<rules>
<rule name="HTTP to HTTPS redirect" stopProcessing="true">
<match url="(.*)" />
<conditions>
<add input="{HTTPS}" pattern="off" ignoreCase="true" />
</conditions>
<action type="Redirect" url="https://{HTTP_HOST}/{R:1}" redirectType="Permanent" />
</rule>
<!-- Do not interfere with requests for node-inspector debugging -->
<rule name="NodeInspector" patternSyntax="ECMAScript" stopProcessing="true">
<match url="^main.js\/debug[\/]?" />
</rule>
<!-- All other URLs are mapped to the node.js site entry point -->
<rule name="DynamicContent">
<match url="^(?!.*login).*$"></match>
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true"/>
</conditions>
<action type="Rewrite" url="main.js"/>
</rule>
</rules>
<outboundRules>
<rule name="Add Strict-Transport-Security when HTTPS" enabled="true">
<match serverVariable="RESPONSE_Strict_Transport_Security" pattern=".*" />
<conditions>
<add input="{HTTPS}" pattern="on" ignoreCase="true" />
</conditions>
<action type="Rewrite" value="max-age=31536000" />
</rule>
</outboundRules>
</rewrite>
<!-- 'bin' directory has no special meaning in node.js and apps can be placed in it -->
<security>
<requestFiltering>
<hiddenSegments>
<remove segment="bin"/>
</hiddenSegments>
</requestFiltering>
</security>
<!-- Make sure error responses are left untouched -->
<httpErrors existingResponse="PassThrough" />
<!-- Restart the server if any of these files change -->
<iisnode watchedFiles="web.config;*.js;browser/*.*" />
</system.webServer>
</configuration>
我希望这可以帮助处于我情况的其他人，或者至少对辩论有用。在升级到版本 9 后，没有人喜欢挠头试图成功部署到 Azure 应用服务。请让我知道是否可以改进某些地方，也许是一个构建参数以避免浏览器构建文件夹删除或其他什么。干杯。
如果您想 运行 您的 angular 应用程序具有服务器端呈现：
1-新建项目：
ng new anguniversal
2-启用服务端渲染（SSR）
ng add @nguniversal/express-engine
第 1 步
首先执行下面给出的命令，用 express 服务器构建一个 Angular 应用程序。npm run build:ssr
现在您可以在项目文件夹中看到 dist 文件夹。
第 2 步
在您的 windows 服务器中创建一个新文件夹（例如将其命名为 angular-universal）并从此处复制项目文件夹中的 dist 文件夹第 3 步
从 dist/anguniversal/server 文件夹中复制 main.js 文件并将其直接粘贴到 angular-universal 文件夹中。第 4 步
创建并打开 Web.config 文件（在 angular-universal 文件夹中）并向其中添加代码。
<?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>
第 5 步
在服务器上安装 IIS Node & URL Rewrite。
第 6 步
在 IIS 中添加网站...。
第 7 步
在 IIS 中，转到应用程序池。对于您创建的网站 (angular-universal)。然后将 .NET CLR 版本更改为无托管代码。
完成，您可以查看结果。