如何为Angular 2和ASP.NET Core MVC提供共享环境变量

我在ASP.NET核心MVC项目中有一个Angular 2应用程序。Angular 2应用程序和

Startup.cs

都有特定环境的代码，即使用

http://localhost

作为web服务url而不是

http://devserver

（发布时应使用）。我需要以编程方式执行此操作，因此如果不在操作系统中设置

ASPNETCORE\u环境

，我不希望执行此操作。有办法做到这一点吗？

我已经设法做到了。不确定这是否是一个最佳的解决方案，但它对我有效

请注意，最后我选择了一个基于配置的文件（即，如果您在调试配置中，则使用.Debug.file）作为配置解决方案，而不是基于环境变量。

创建

appsettings.json

。当您按F5以调试模式运行项目时，将读取此信息。同时设置

appsettings.json

“

Copy to Output directory:Copy if newer

”：

创建

appsettings.Debug.json

。当发布项目时将使用此功能（假设您正在使用发布的

Debug

配置）：

编辑您的

.csproj

以添加

AfterBuild

事件，以便在生成时将

appsettings.json

文件复制到

/wwwroot

（假设您的Angular 2应用程序位于wwroot文件夹中），以便Angular可以读取：

<Target Name="AfterBuildOperations" AfterTargets="AfterBuild">
    <Copy SourceFiles="$(ProjectDir)appsettings.json" DestinationFiles="$(ProjectDir)wwwroot\appsettings.json" OverwriteReadOnlyFiles="true" />
  </Target>

将

AppSettings.cs

model添加到项目中以获取强类型配置：

public class AppSettings
    {
        public string MyApiUrl { get; set; }
    }

阅读

Startup.cs

中的

appsettings.json

内容，并将其作为单例添加到DI容器中：

public void ConfigureServices(IServiceCollection services)
        {
            var appSettings = ReadConfiguration();
            services.AddSingleton(appSettings);
        }

        public AppSettings ReadConfiguration()
        {
            var section = Configuration.GetSection("AppSettings");
            var settings = new AppSettings();
            new ConfigureFromConfigurationOptions<AppSettings>(section).Configure(settings);

            return settings;
        }

将

AppSettings.ts

添加到您的Angular 2

export interface AppSettings {
    MyApiUrl?: string;
}

现在，您可以在Angular 2中的任意位置阅读：

private ReadAppSettings() {
        this.http.get('/appsettings.json')
            .map(response => response.json())
            .subscribe(result => {
                let appSettings: AppSettings = <AppSettings>result.AppSettings;
            },
            error => { console.error(error); });
    }

private ReadAppSettings（）{
this.http.get（'/appsettings.json'））
.map（response=>response.json（））
.订阅（结果=>{
让appSettings:appSettings=result.appSettings；
},
error=>{console.error（error）；}）；
}

您想用它实现什么？您只是想分离不同环境的关注点，还是希望能够在应用程序运行时更改这些值？

public void ConfigureServices(IServiceCollection services)
        {
            var appSettings = ReadConfiguration();
            services.AddSingleton(appSettings);
        }

        public AppSettings ReadConfiguration()
        {
            var section = Configuration.GetSection("AppSettings");
            var settings = new AppSettings();
            new ConfigureFromConfigurationOptions<AppSettings>(section).Configure(settings);

            return settings;
        }

private AppSettings appSettings;

public MyController(AppSettings appSettings)
{
    this.appSettings = appSettings;
}

export interface AppSettings {
    MyApiUrl?: string;
}

private ReadAppSettings() {
        this.http.get('/appsettings.json')
            .map(response => response.json())
            .subscribe(result => {
                let appSettings: AppSettings = <AppSettings>result.AppSettings;
            },
            error => { console.error(error); });
    }