0Pricing
Sveltejs Academy · レッスン

環境変数:$env/staticと$env/dynamic

SvelteKitでサーバーとクライアントから環境変数に安全にアクセスします。

「環境変数:$env/staticと$env/dynamic」はCoddyKit上の無料Sveltejs Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはSveltejs Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Sveltejs Academyコースには全4レッスンが含まれています。

SvelteKit env API

SvelteKitは、4つのモジュールを通じて環境変数を公開します:static/private、static/public、dynamic/private、dynamic/publicです。

静的・プライベート

ビルド時に読み込まれ、サーバーでのみ使用されます。クライアントバンドルからは除外されます。

import { DB_URL } from "$env/static/private";

静的・パブリック

ビルド時に読み込まれ、PUBLIC_で始める必要があります。クライアントバンドルに含まれます。

import { PUBLIC_API_URL } from "$env/static/public";

動的・プライベート

サーバー上で実行時に読み込まれます。再ビルドせずに設定を変更できるため便利です。

import { env } from "$env/dynamic/private";
console.log(env.SECRET);

動的・パブリック

実行時に読み込まれ、クライアントとサーバーの両方で利用できます。PUBLIC_で始める必要があります。

適切なものを選ぶ

実行時に値が変わらない場合はstaticを、変わる場合(例:機能フラグ)はdynamicを使用します。

シークレットを公開しない

シークレットにPUBLIC_という接頭辞を付けないでください。クライアントバンドルに漏洩します。

Envファイル

値は.env(gitignore対象)と.env.example(コミット対象)に保存します。

型安全性

static変数には自動的に型が付きます。dynamic変数はRecordで型付けします。

VercelとCloudflare

各プラットフォームには独自の環境変数UIがあります。環境間の同期は意図的に行ってください。

テスト

環境変数モジュールに依存する場合は、テストでモック化します。

確認

パブリックな環境変数に必要な接頭辞は何ですか?

まとめ

シークレットには$env/static/privateを、クライアントで安全に扱える値にはPUBLIC_接頭辞付きの変数を使用します。必要に応じてstaticとdynamicを選びます。

よくある質問

「環境変数:$env/staticと$env/dynamic」レッスンは無料ですか?

はい。「環境変数:$env/staticと$env/dynamic」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Sveltejs Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Sveltejs Academyコースには全4レッスンが含まれています。

「環境変数:$env/staticと$env/dynamic」で何を学びますか?

SvelteKitでサーバーとクライアントから環境変数に安全にアクセスします。 ブラウザで直接実行するハンズオンコードでSveltejs Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Sveltejs Academyを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのSveltejs Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。

「環境変数:$env/staticと$env/dynamic」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このSveltejs Academyレッスンでコードを書いて実行できますか?

はい。すべてのSveltejs Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. Form ActionsでのCSRF対策
  2. {#html}でのXSS対策
  3. 環境変数:$env/staticと$env/dynamic
  4. Hooksによるレート制限
← Sveltejs Academyに戻る