練習 - 將 Azure 儲存體設定新增至您的應用程式

10 分鐘

讓我們新增 .NET Core 應用程式的支援，以從設定檔擷取連接字串。我們首先會新增必要的管道，以在 JSON 檔案中管理設定。

建立 JSON 設定檔

如果您不在 PhotoSharingApp 目錄中，請將目錄變更至該目錄:
```
cd PhotoSharingApp
```
輸入下列命令，以使用 touch 工具來建立名為 appsettings.json 的檔案:
```
touch appsettings.json
```
在編輯器中開啟專案。如果您在本機執行，您可以使用您選擇的編輯器。我們建議使用 Visual Studio Code，這是一個可延伸的跨平台 IDE。若您是在 Azure Cloud Shell (右側) 中執行，則建議使用 Cloud Shell 編輯器。使用下列命令在任一環境中開啟編輯器:
```
code .
```

在編輯器中選取 appsettings.json 檔案，然後新增下列文字:

{
    "ConnectionStrings": {
        "StorageAccount": "<value>"
    }
}

使用鍵盤快速鍵 (Ctrl+S) 儲存檔案，或從內容選單中選取 [儲存] (選取編輯器標題列中的省略符號 ... 圖示)。
現在，我們需要使用 Azure 命令來取得實際的儲存體帳戶連接字串。在 Cloud Shell 工作階段中，貼上下列命令，並將 <name> 取代為您在上一個練習中建立的唯一儲存體帳戶名稱，然後按 Enter 來執行命令:
```
az storage account show-connection-string \
  --resource-group <rgn>[sandbox resource group name]</rgn> \
  --query connectionString \
  --name <name>
```

回應包含以引號繫結的連接字串，其看起來類似下列範例：

"DefaultEndpointsProtocol=https;EndpointSuffix=core.windows.net;AccountName=storage1ab;AccountKey=QtSCGB...7AeoW0Hw=="

複製連接字串，然後在編輯器的 appsettings.json 檔案中，以這個連接字串取代 <value> 預留位置。
按 Ctrl+S 以儲存檔案。
在編輯器中開啟專案檔 PhotoSharingApp.csproj。

複製並貼上現有 <ItemGroup> 區塊底下的下列設定區塊。

<ItemGroup>
    <None Update="appsettings.json">
        <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </None>
</ItemGroup>

按 Ctrl+S 以儲存檔案。 (您必需儲存此檔案，否則，當您新增下列套件時，將會遺失變更！)

新增 JSON 設定檔讀取支援

在 Cloud Shell 主控台中，複製並執行下列程式碼，以新增Microsoft.Extensions.Configuration.Json NuGet 套件的參考:

dotnet add package Microsoft.Extensions.Configuration.Json

新增程式碼來讀取設定檔

因為現在我們已經新增必要程式庫來啟用讀取設定，所以需要在主控台應用程式內啟用該功能。

在編輯器中選取 Program.cs。
在檔案頂端，有一行已註解的程式碼。刪除該行，並將下列幾行程式碼新增至檔案頂端：
```
using System;    
using Microsoft.Extensions.Configuration;
using System.IO;
```

使用下列程式碼取代 Main 方法的內容 (包含 "Hello World!" 的行)：

namespace PhotoSharingApp
{
    class Program
    {
        static void Main(string[] args)
        {
            var builder = new ConfigurationBuilder()
                .SetBasePath(Directory.GetCurrentDirectory())
                .AddJsonFile("appsettings.json");

            var configuration = builder.Build();
        }
    }
}

此程式碼會初始化設定系統，以便從 appsettings.json 檔案進行讀取。

您的 Program.cs 檔案現在應該看起來如下：

using System;
using Microsoft.Extensions.Configuration;
using System.IO;

namespace PhotoSharingApp
{
    class Program
    {
        static void Main(string[] args)
        {
            var builder = new ConfigurationBuilder()
                .SetBasePath(Directory.GetCurrentDirectory())
                .AddJsonFile("appsettings.json");

            var configuration = builder.Build();
        }
    }
}

儲存檔案。

讓我們新增 Node.js 應用程式的支援，以從設定檔擷取連接字串。我們首先會新增必要的管道，以從 JavaScript 檔案管理設定。

建立 .env 組態檔

在 Azure Cloud Shell 工作階段中，輸入下列命令，以確定您位於專案的正確工作目錄中。
```
cd PhotoSharingApp 
```
輸入下列命令，建立名為 .env 的檔案:
```
touch .env
```
在 Cloud Shell 編輯器中開啟專案:
```
code .
```
在編輯器中選取 .env 檔案，然後新增下列文字。

注意

您可能需要在程式碼中選取 [重新整理] 按鈕，才能看見新檔案。
```
AZURE_STORAGE_CONNECTION_STRING=<value>
```
提示

AZURE_STORAGE_CONNECTION_STRING 是用於儲存體 API 的硬式編碼環境變數，可查看存取金鑰。
使用鍵盤快速鍵 (Ctrl+S) 儲存檔案，或選取編輯器標題列中的省略符號圖示 (...)，然後從內容選單選取 [儲存]。
現在，我們需要使用 Azure 命令來取得實際的儲存體帳戶連接字串。在 Cloud Shell 工作階段中，執行下列命令，並將 <name> 取代為您在上一個練習中建立的儲存體帳戶名稱。
```
az storage account show-connection-string \
  --resource-group <rgn>[sandbox resource group name]</rgn> \
  --query connectionString \
  --name <name>
```

回應為以引號繫結的連接字串，其看起來類似下列範例：

"DefaultEndpointsProtocol=https;EndpointSuffix=core.windows.net;AccountName=storage1ab;AccountKey=QtSCGB...7AeoW0Hw=="

複製連接字串，然後在 .env 檔案中，以此連接字串取代 <value>。
按 Ctrl+S 以儲存檔案。

新增環境組態檔的讀取支援

Node.js 應用程式可透過新增 dotenv 套件，包含從 .env 檔案讀取的支援。

在 Cloud Shell 工作階段中，執行下列命令，以使用 npm 將相依性新增至 dotenv 套件:
```
npm install dotenv --save
```

新增程式碼來讀取設定檔

因為現在我們已經新增必要程式庫來啟用讀取設定，所以需要在應用程式中啟用該功能。

在編輯器中，開啟 index.js 檔案。
在檔案頂端，有一行 #!/usr/bin/env node 程式碼。請在該行下方，新增下列程式碼行：
```
require('dotenv').config();
```
按 Ctrl+S 以儲存檔案。

我們現在已備妥 JSON 設定檔，即可開始新增程式碼來使用儲存體帳戶。

繼續

練習 - 將 Azure 儲存體設定新增至您的應用程式

建立 JSON 設定檔

新增 JSON 設定檔讀取支援

新增程式碼來讀取設定檔

建立 .env 組態檔

新增環境組態檔的讀取支援

新增程式碼來讀取設定檔

意見反應