Я пытаюсь развернуть приложение angular 6 на платформе службы приложений Azure (Windows Machine).Само приложение - это просто новое угловое приложение (основной код, сгенерированный из ng new appname).Я добавил небольшой код после этого учебного пособия, чтобы использовать файл конфигурации и использовать подстановку переменных в конвейерах выпуска vsts - управлять настройками для углового приложения с помощью vsts .
Это изменения кода, которые я внес в сгенерированное приложение.В app.module.ts
export function initializeAppSettings(appSettings: AppSettings) {
return () => appSettings.load();
}
...
providers: [AppSettings, {
provide: APP_INITIALIZER,
useFactory: initializeAppSettings,
deps: [AppSettings],
multi: true
}]
Для моего файла appsettings.ts
export interface AppConfiguration {
apiUrl: string;
}
@Injectable()
export class AppSettings {
static config: AppConfiguration;
constructor(private http: HttpClient) {}
load(): Promise<any> {
const appSettingsJson = environment.production ? 'assets/appsettings.json' : 'assets/appsettings.local.json';
return new Promise<any>(((resolve, reject) => {
this.http.get<AppConfiguration>(appSettingsJson)
.toPromise()
.then(result => {
AppSettings.config = result;
resolve();
}).catch(reason => {
reject(`unable to load settings file ${appSettingsJson} due to ${JSON.stringify(reason)}`);
});
}));
}
}
В моем файле angular.json у меня есть
"assets": [
"src/favicon.ico",
"src/assets",
"src/web.config"
]
И следующий файл web.config
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Angular" 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>
В моем файле src / assets / appsettings.json есть одна настройка atm
{
"apiUrl": "https://localhost:5001/api/"
}
Эта настройка прекрасно работает при локальном запуске с использованием ng serve или даже при развертывании на локальном IIS с использованием ng build.Я использую загруженные настройки в моих app.component.ts и app.component.html, чтобы убедиться, что он загружается правильно.Но когда я развертываю приложение в Azure, я получаю ошибку 404.
ОШИБКА не удается загрузить файл настроек assets / appsettings.local.json из-за {"headers": {"normalizedNames": {}, "lazyUpdate": null}, "status": 404, "statusText": "Not Found", "url": "https://mydomain/assets/appsettings.local.json","ok":false,"name":"HttpErrorResponse","message":"Http ответ об ошибке для https://mydomain/assets/appsettings.local.json: 404 Not Found", "error":" Ресурс, который вы ищете, был удален, изменилось его имя или временно недоступен. "}
Я попытался явно добавить отдельный файл appsettings.json в мой массив ресурсов вangular.json, а также пробовал с и без файла web.config.Если я разверну в Azure только простое угловое приложение (т.е. без дополнительного кода для загрузки файла appsettings.json), оно будет работать (даже без файла web.config).Я довольно новичок в angular (и в веб-разработке в целом) и искал повсюду, где мог, решение, но пока ничего не исправило.