Как можно прочитать переменную среды из файла .NET appSettings.json в службе Angular? - PullRequest
Новая
       12

Как можно прочитать переменную среды из файла .NET appSettings.json в службе Angular?

0 голосов
/ 13 ноября 2018

Я новичок в Angular2 и у меня есть несколько вопросов.

У меня есть служба, которая запрашивает некоторые данные JSON из веб-API: 

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class ReviewService {
    private actionUrl: string;

    constructor(private _http: Http) {
        this.actionUrl = 'http://api.dc-shop.com/review';
    }

    public GetAll = (): any => {
        return this._http.get(this.actionUrl)
            .map(x => x.json());
    }
}

Я бы хотел избежать жесткого кодированияадрес API в конструкторе и вместо этого прочитайте параметр из appSettings.json, который я могу использовать для URL-адреса действия при запуске для производственных и локальных серверов.

Каков наилучший способ сделать это в ASP.NET MVCядро

Ответы [ 2 ]

0 голосов
/ 13 ноября 2018

Два варианта, которые я могу придумать:

1) Поместите конфигурацию в environment.ts, а также appSettings.json - доступ к ней встроен в угловой.

2) Шаг 1 вашего сервиса загружает appSettings.json с помощью простого http.get, а затем использует конфигурацию из него для загрузки необходимых данных.

Пример среды.ts 

export const environment = {
    apiUrl: 'http://api.dc-shop.com',
    mode: 'prod'
};

Пример использования: 

import { environment } from './environment';    
constructor(private _http: Http) {
    this.actionUrl = environment.apiUrl + '/review';
}
0 голосов
/ 13 ноября 2018

Это можно реализовать с помощью Angular Http Intercepter

Добавить префикс http://api.dc -shop.com в каждом запросе.

Пример кода:

Напишите перехватчик запросов в вашем угловом приложении: 

@Injectable()
export class RequestInterceptor implements HttpInterceptor {

 intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    let req_url = req.url
    req.clone({url:`http://api.dc-shop.com/${req_url}`})
    return next.handle(req);
    }


}

И в вашем основном модуле: 

   export const httpInterceptorProviders = [
      {provide: HTTP_INTERCEPTORS, useClass: RequestInterceptor, multi: true},
    } 

   @NgModule({
       providers: [...,httpInterceptorProviders]
    })

Если выВы хотите настроить свой префикс url в другой среде:

Вы можете определить его в вашем environment.xx.ts в /src/environments

И определить конфигурацию сборки в angular.json 

 ....
 "configurations": {
   "api": {
    ....
       "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.api.ts"
            }
          ]
     }
   ....
 }
 ...

А когда вы создаете свое приложение,

просто добавьте конфигурацию 

 ng build   --configuration=api

Удачи!

...