Question

我正在尝试使用FTP上传通过TeamCity将AngularJS网站（dist文件夹）发布到Azure。文件似乎没问题，并且正确上传。 App服务正在运行。

但是当我浏览网站时，我只能看到azure app服务的登陆页面。 Website link供您参考。

TeamCity的步骤如下


获取最新代码并执行npm install

执行ng build以便创建并填充dist文件夹。

FTP将dist文件夹上传到azure app service

我正在使用以下版本

Angular CLI: 1.6.0
Node: 8.9.3
OS: win32 x64
Angular: 5.1.1
@angular/cli: 1.6.0
@angular/language-service: 4.4.6
@angular-devkit/build-optimizer: 0.0.36
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.0
@schematics/angular: 0.1.11
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.10.0

我还添加了一个网络配置，看看是否修复了任何内容，但无济于事。我的网络配置如下所示：

<?xml version="1.0"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="angular cli routes" stopProcessing="true">
                    <match url=".*" />
                    <conditions logicalGrouping="MatchAll">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                    </conditions>
                    <action type="Rewrite" url="/" />
                </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

即使我尝试手动进行FTP上传，它仍然是我看到的着陆页。我试过浏览到/index页面，但后来我得到资源不存在。我是否错过了托管角度应用程序所需的一些azure app服务配置？

Answer 1

通过将web.config更改为以下内容来解决此问题。我可能错过了regex标记的正确match url。

<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="redirect all reqi=uests" stopProcessing="true">
                    <match url="^(.*)$" ignoreCase="false"/>
                    <conditions logicalGrouping="MatchAll">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" pattern="" ignoreCase="false" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" pattern="" ignoreCase="false" />
                    </conditions>
                    <action type="Rewrite" url="/" appendQueryString="true" />
                </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

然后将以下内容添加到angular-cli.json。这将在构建时自动包含dist文件夹中的Web配置。

 "assets": [
    "assets",
    "favicon.ico"
    "web.config"
  ],

Azure应用服务无法加载AngularJS5应用

1 个答案: