Managed Runtime 環境変数を使用すると、コードを変更することなく、環境で実行されているアプリケーションプロセスに変数を追加できます。環境変数は安全に保存され、次のようなユースケースに最適です。
詳細については、環境変数を参照してください。
環境変数を使用して、安全な外部リソースにアクセスするために使用される API キーを保存しましょう。このチュートリアルでは、架空のサードパーティコンテンツ管理システム (CMS) をリソースとして使用します。ssr.js で、CMS にリクエストを行い、保護されたデータで応答するハンドラーを Express.js サーバーに追加します。次に、このハンドラーを呼び出してデータにアクセスします。
セキュリティ上の理由から、API キーはクライアント側のコードではなく、サーバー側のコードから CMS を呼び出します。
このチュートリアルを完了するには、まず次の要件を満たす必要があります。
このチュートリアルのコマンドを実行する前に、プレースホルダーを実際の値に置き換えてください。プレースホルダーは $PLACEHOLDER の形式になっています。
現在のセッションで環境変数を設定するには、ターミナルを開き、次のコマンドを実行します。
set CMS_API_KEY='my-cms-api-key'export CMS_API_KEY='my-cms-api-key'次のコマンドを実行して、環境変数が正しく設定されているかどうかを確認します。
echo %CMS_API_KEY%echo $CMS_API_KEYこのコマンドで返される出力は my-cms-api-key です。
ssr.js で CMS を呼び出すために、次の JavaScript コードを追加します。
1async function fetchCMSData() {
2 const key = process.env.CMS_API_KEY;
3 if (!key) {
4 throw new Error("Environment variable CMS_API_KEY isn't set.");
5 }
6
7 return await fetch("https://api.example.com/", {
8 headers: {
9 Authorization: "Bearer " + key,
10 },
11 }).json();
12}
13
14async function handlerCMS(req, res) {
15 try {
16 const data = await fetchCMSData();
17 return res.json(data);
18 } catch (err) {
19 return res.status(500).json({ error: err.message });
20 }
21}npm start を使用して開発サーバーを起動します。最後に、ハンドラーにローカルで移動して、CMS データが返されることを確認します。変更を本番環境にデプロイする前に、これらの手順を非本番環境でテストすることをお勧めします。
このチュートリアルのコマンドを実行する前に、プレースホルダーを実際の値に置き換えてください。プレースホルダーは $PLACEHOLDER の形式になっています。
1curl "https://cloud.mobify.com/api/projects/$PROJECT_ID/target/$ENVIRONMENT_ID/env-var/" \
2 --request 'PATCH' \
3 --header 'Content-Type: application/json' \
4 --header 'Accept: application/json' \
5 --header "Authorization: Bearer $MOBIFY_API_KEY" \
6 --data '{"CMS_API_KEY": {"value": "'$YOUR_API_KEY_VALUE'"}}'
j