11

問題なく Azure App Service にデプロイできる Angular アプリケーションがあります。

まず、次のコマンドを使用してアプリケーションをコンパイルします。

ng build --output-path=dist --aot -prod

web.config次に、以下をdistフォルダーに追加します。

<configuration>
    <system.webServer>
         <rewrite>
            <rules>
              <rule name="AngularJS 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>
          <caching enabled="true" enableKernelCache="true">
              <profiles>
                  <add extension=".js" policy="DisableCache" kernelCachePolicy="DisableCache" />
              </profiles>
          </caching>
    </system.webServer>
</configuration>

次に、distフォルダーの内容を圧縮して、Azure アプリケーションにドラッグします ( https://<site.scm.azurewebsites.net>/ZipDeploy)。この時点で、アプリは正常に動作します。

私の問題は、さまざまなロケール用にさまざまなバージョンのアプリケーションをデプロイしたいということです。

次のコマンドを使用して、さまざまなバージョンをコンパイルします。

ng build --output-path=dist/en --aot -prod --bh /en/ --i18n-format=xlf --locale=en

ng build --output-path=dist/fr --aot -prod --bh /fr/ --i18n-file=src/locale/messages.fr.xlf --i18n-format=xlf --locale=fr

これにより、フォルダーが出力enされ、さまざまなバージョンのアプリが含まれますfr。アプリの各バージョンに、たとえば とを/dist追加します。web.config/dist/endist/fr

次に、en & fr フォルダーを圧縮しZipDeploy、上記のようにデプロイします。

アプリケーションのホームページが次の場所で正常に動作していることを確認できます。

https://<site>.azurewebsites.net/en
https://<site>.azurewebsites.net/fr

ただし、(Azure B2C を使用してサインインしている) で自分のアプリケーションにリダイレクトされるとhttps://<site>.azurewebsites.net/fr/redirect.html#state....、次のエラーが発生します。

You do not have permission to view this directory or page.

これは、Angular にルーティングを処理させるのではなく、iis が文字通り私の URL をディレクトリとして解釈しようとしているように感じますが、よくわかりません。

これを正しく行う方法を知っている人はいますか？

4

3 に答える 3

0

以下のような各ロケールへの特定のルートが必要だと思います

<configuration>
<system.webServer>
    <rewrite>
        <rules>
            <rule name="Angular Routes fr" stopProcessing="true">
                <match url="fr/*" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                </conditions>
                <action type="Rewrite" url="/fr" />
            </rule>
            <rule name="Angular Routes en" stopProcessing="true">
                <match url="en/*" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                </conditions>
                <action type="Rewrite" url="/en" />
            </rule>
            <rule name="Angular Routes default" 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="/en" />
            </rule>
        </rules>
    </rewrite>
</system.webServer>
于 2018-04-18T09:34:43.603 に答える