Загрузка файла удаленной конфигурации в приложениях Angular - PullRequest
Новая
       23

Загрузка файла удаленной конфигурации в приложениях Angular

0 голосов
/ 30 апреля 2019

Приложение: Мое угловое приложение размещено на сервере Nginx.Приложение использует два разных сервера API, оба размещены на NodeJS / express.

Проблема: Имена хостов и порты для обоих серверов API статически определены в приложении Angular в моей REST-службе.

export class AppREST {

    primary_api_server_hostname: string = "https://hostname_1:port_1"
    secondary_api_server_hostname: string = "https://hostname_2:port_2"

    //using the above hosts for API
}

Конструкция приложения такова, что оба сервера API могут иметь разные имена хостов и имена портов, которые могут отличаться от имени хоста самого сервера Nginx.

Ожидается: После того, как угловое приложение построено с использованием ng build --prod и полученные файлы помещены в html-папку сервера nginx, должна быть опция для динамической настройки имен хостов и портов, используемых приложением.

Я хочу найти лучший способ сделать это динамически настраиваемым с использованием внешнего файла json.

Я попытался поместить файл hosts.json непосредственно на сервер nginx, который был прочитан ранееинициализация REST API.

Это работало нормально, но может рассматриваться только как обходной путь, так как разработка приложения с использованием углового интерфейса командной строки ng serve становится беспорядком.

Есть ли какое-либо решение, рекомендованное командой Angular

1 Ответ

0 голосов
/ 30 апреля 2019

Итак, вы хотите создать сервис, который инициализирует и загружает переменные из файла JSON при загрузке приложения Angular.

Вам необходимо создать сервис, который загружает конфиги и будет запускаться при загрузке вашего приложения: 

import { Injectable, Injector } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class AppConfigService {
    private appConfig;

    constructor (private injector: Injector) { }

    loadAppConfig() {
        let http = this.injector.get(HttpClient);

        return http.get('/assets/app-config.json')
        .toPromise()
        .then(data => {
            this.appConfig = data;
        })
    }

    get config() {
        return this.appConfig;
    }
}

Кредиты: Как использовать переменные среды выполнения в угловых

...