Изменение переменной среды посредством ввода пользователем в Angular - PullRequest
Новая
       1

Изменение переменной среды посредством ввода пользователем в Angular

1 голос
/ 14 июля 2020

В настоящее время я создаю приложение angular, которое использует REST API для отправки и приема вызовов от экземпляра на бэкэнде. В настоящее время этот URL-адрес определяется как переменная среды, как показано ниже: 

export const environment = {
  production: false,
  loggerLevel: NgxLoggerLevel.DEBUG,
  disableConsoleLogging: false,
  lang: 'en',
  api: {
    . //other variables
    .
    .
    host: "http://mycoolurl.com/rest/v11_1/",
    . 
    . //more variables
    .
  }
};

Теперь есть аналогичный вопрос, который решает эту проблему здесь , но даже в этом случае используются специальные настройки c . json файл, который будет извлечен с использованием APP INITIALIZER. Другой похожий вопрос здесь также предложил мне использовать отдельный файл JSON.

Недавнее изменение требований гласило, что пользователь должен иметь возможность указать URL-адрес, который он хочет отправить REST, поэтому предпочтительно, чтобы это было поле ввода, в которое он будет вводить URL-адрес, и это будет обновлять хост в файле среды. Как мне этого добиться?

К сожалению, я не могу изменить всю реализацию и удалить хост из среды, он импортируется и используется во многих местах приложения.

1 Ответ

1 голос
/ 14 июля 2020

Вы не можете изменить значение окружения прямо в коде, потому что оно связано со всем остальным. Это также действительно плохой подход, потому что вы будете перезаписывать значение каждый раз, когда обновляете приложение. Сохраните его отдельно на стороне сервера!

Вариант A:

Используйте APP_INITIALIZER и перезапишите значение среды там после его загрузки: environment.api.host = loadedValue

Это будет работать правильно, только если вы не используете значение до этого. Он будет использоваться до этого, только если вы используете его в определениях / конфигурации модулей и классах, которые вы вводите в инициализатор. Так что это может сработать для вас.

Вариант B

Это довольно некрасиво, но сработает нормально:

Сохраните URL-адрес api в отдельном javascript, который выглядит примерно так: 

window.userEnvironment = { host: "http://custom-host" };

Загрузите этот javascript в <head> часть index.html с помощью: <script src="user-env.js"></script>. Таким образом, будет загружено до того, как angular будет загружено. Это обеспечивается браузером!

Теперь внутри файла environment.ts вы можете сделать следующее: 

export const environment = {
  ...
};

const userEnv = (window as any).userEnvironment;
if (userEnv) Object.assign(environment, userEnv);

Это заменяет значение environemt значениями из файла user-env.js.

Вам не нужно делать это в среде. Вы также можете сделать это где-нибудь еще. Вам просто нужно сделать это до того, как будет использовано environment. Кроме того, если у вас несколько сред, вам понадобится это во всех файлах среды.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...