如何根据 ASP.NET Core 中的环境配置 fetch() URL？

Question

我有一个 Visual Studio 2019 解决方案，其中包含 2 个项目：

ASP.NET 核心 Web 应用程序 (Razor Pages) 项目
一个 ASP.NET 核心 Web API 项目

我正在使用 Fetch API 从 Razor Pages 应用程序中的 Razor Pages 对 Web JavaScript 调用 API。

例如：

fetch("https://localhost:44325/api/Customer/12")
    .then(response => response.json())
    .then(data => processData(data))
    .catch(err => showError(err));

如何根据 Web 应用程序运行的环境配置 url（上面 fetch() 调用的第一个参数）- 即开发（如上所述），分期、制作等？

Answer 1

我正在寻找类似的东西，我找到了这篇文章。 https://www.thecodebuzz.com/set-appsettings-json-dynamically-dev-and-release-environments-asp-net-core/

您可以拥有多种类型的 appsettings.json 文件，其中包含特定于 DEV、TEST 或 STAGING 和 PROD 的配置详细信息。然后在设置文件中定义你的 url 例如

appsettings.Development.json

{    
  "ApiUrls": {
    "CustomerApi": "https://localhost:44325/api/Customer/12",
  }
}

appsettings.prod.json

  {    
      "ApiUrls": {
        "CustomerApi": "https://productionurlblablabla/api/Customer/12",
      }
    }

等那里的所有描述都对我有用，但我不是它的作者，所以请随意阅读并祝你好运。

Answer 2

How do I configure the url (the first parameter to the fetch() call above) depending on the environment that the Web App is running please

i.e. development (as above), staging, production etc?

首先根据环境添加多个appsettings.Environment.json：例如appsettings.Production.json和appsettings.Development.json文件：

appsettings.Production.json:

{
  "API": {
    "URL": "https://localhost:44325/api/Customer/12", //store the url
    "Environment": "Production"
  },
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft": "Warning",
      "Microsoft.Hosting.Lifetime": "Information"
    }
  }
}

然后，在视图页面中，使用@inject指令添加IConfiguration，然后您可以从视图页面访问配置值。然后你可以使用隐藏字段存储 Api URL，在使用 Tetch Api 之前，使用 Jquery 找到隐藏字段并获得 URL.

@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment hostingEnv

@inject Microsoft.Extensions.Configuration.IConfiguration configuration
 
<p> ASPNETCORE_ENVIRONMENT = @hostingEnv.EnvironmentName</p>
 
<p> ASPNETCORE_ENVIRONMENT = @configuration["API:Environment"]</p>
<p> API URl : <span>@configuration["API:URL"]</span></p>

<input type="hidden" id="hid_apiurl" value="@configuration["API:URL"]" />

结果如下：

如何根据 ASP.NET Core 中的环境配置 fetch() URL？

How to configure the fetch() URL depending on the environment in ASP.NET Core?

javascript

fetch-api

asp.net-core