javascript - Aplicația Angular implementată cu Azure App Services nu poate găsi un asset pe care îl găsește atunci când folosește ng serve

Am o aplicație construită cu Angular CLI, un script în 'src/app/text-gen/text-gen.component.ts' încarcă un model tensorflow.js cu:

this.model = await tf.loadLayersModel('../assets/models/model.json');

Referindu-se la un fișier JSON din 'src/assets/models/model.json'.

Când se lansează această aplicație cu Azure App Services, totul funcționează, dar dintr-un anumit motiv acest model.json returnează 404 Not Found:

Când mă uit la Consola Kudu, pot vedea model.json în 'site/wwwroot/assets/models/model.json'.

De asemenea, în 'angular.json', "outputPath" este setat la "dist".

Sunt sigur că este ceva foarte evident - sunt foarte nou în Angular, dezvoltare web, Azure etc. - dar parcă nu reușesc să dau de capăt acestei probleme!

Mulțumesc!!!

Editare: Adaug un screenshot al model.json în consola Kudu, am încercat de asemenea '/assets/models/model.json' ca și cale și am primit aceeași eroare.

Răspuns #1

Am descoperit asta datorită acestei întrebări de aici.

În fișierul web.config, a trebuit să adaug <staticContent><mimeMap fileExtension=".json" mimeType="application/json" /></staticContent> chiar înainte de tag-ul <rewrite>. În total, obținând un fișier web.config care arată astfel:

<?xml version="1.0" encoding="utf-8"?>
<configuration>

<system.webServer>
  <staticContent><mimeMap fileExtension=".json" mimeType="application/json" />
  </staticContent>
  <rewrite>
    <rules>
      <rule name="Angular 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="./index.html" />
      </rule>
    </rules>
  </rewrite>
</system.webServer>

</configuration>

Pentru oricine citește asta în viitor și este nou în Angular, ca și mine. Fișierul web.config poate fi inclus în directorul dist/ prin adăugarea sa în "assets" din angular.json, așa că activele mele arată astfel, de exemplu:

"assets": [
  "src/favicon.ico",
  "src/model.json",
  "src/char2idx.json",
  "src/web.config"
]