メインコンテンツまでスキップ

シークレット

設定 > シークレットには、サイトのコードが読み取る API キーや設定を保存します。AI は構築中にシークレットを追加できます。コネクタも、必要なシークレットを自動で追加します。値は暗号化され、表示するまで非表示のままです。公開すると、公開サイトに反映されます。

未入力の値、シークレット、コネクタからのセクションがあるシークレットページ

このページには、未入力の値、シークレット、コネクタからの最大3つのセクションがあります。

未入力の値​

まだ渡していないキーを使うコードを AI が書くと、その名前と仮の値でシークレットが追加されます。これらのシークレットはここに表示され、「これらを設定するまで、サイト内で使用している部分は動作しません」という案内が付きます。

行には2つの種類があります。

  • 接続する行：Stripe、Supabase、Resend、OpenAI のキーなど、サービスが自動で入力するシークレットです。行にはサービス名と接続ボタンが表示されます。たとえば、Stripe を接続です。サービスを接続すると値が入力され、最新の状態に保たれます。データベースはデータパネルで、それ以外はコネクタで接続します。
  • 貼り付ける行：それ以外のシークレットです。フィールドに値を貼り付けて保存をクリックするか、Enter を押します。サイトに不要な場合は削除をクリックします。よく使われるサービスでは、OpenAI から取得など、キーを取得する場所へのリンクが行に表示されます。

保存済みの値を読み取れなくなった場合も、ここに行が表示されます。値を再設定すると解決できます。

AI がチャットでキーへのリンクを示した場合、そのリンクを開くとこのページの該当する行が表示され、強調されます。

シークレット​

すべてのシークレットを2種類の表示で確認できます。.env をインポートの横にあるボタンで切り替えます。

  • テキスト：1つのエディターで、1行に1つの NAME=value を表示します。複数の値をまとめて貼り付けたり編集したりするのに適しています。
  • リスト：シークレットごとに1行で表示し、追加日や更新日、設定したサービスを確認できます。公開用の名前にはブラウザから見えると表示されます。各行で値の表示、コピー、編集、削除ができます。追加するにはシークレットを追加をクリックします。

値は最初は非表示です。シークレットを表示をクリックすると、値を表示して編集できます。変更を保存または破棄した後、シークレットを非表示をクリックすると再び非表示になります。まだシークレットがない場合は、そのまま追加できます。

値を表示したシークレットエディターと、行のエラー、保存バー

サービスが接続されている場合、エディターでは行がグループ化されます。追加したシークレットは # Your secrets の下に、各サービスのシークレットは # Stripe などのサービス名の下に表示されます。WebTwizz Cloud のシークレットや、ジョブが使う CRON_SECRET など、WebTwizz が管理するシークレットはエディターに表示されず、ここから削除することもできません。

編集​

  • OPENROUTER_API_KEY=sk-or-... のような行を入力するか貼り付けます。各行には行番号が表示されます。
  • 名前には英字、数字、_ を使用できます。数字で始めることはできません。
  • # で始まる行や空行も入力できますが、保存時には保持されません。
  • = の後に値がない名前には値が必要ですと表示され、保存すると未入力の値に表示されます。
  • シークレットを削除するには、その行を削除します。接続済みサービスのシークレットは、プロジェクトからそのサービスを削除するまで残ります。
  • サービスが設定した値も変更できますが、サービスが再接続すると元の値に戻されることがあります。

行のエラー​

問題がある行には印が付き、エディターの下に一覧が表示されます。たとえば、次のようなエラーです。

  • NAME の後に =value を追加してください。 行に = がありません。
  • 名前を数字で始めることはできません
  • NAME は WebTwizz が設定します。 NODE_ENV、PORT、WEBTWIZZ_ で始まる名前など、一部の名前は予約されています。
  • NAME は4行目にもあります。 同じ名前は1回しか使用できません。

NEXT_PUBLIC_ で始まる名前に秘密キーと思われる値が入っていると、警告が表示されます。サイトを開いた人なら誰でも読み取れるためです。警告が表示されても保存はできます。

.env ファイルのインポート​

.env をインポートをクリックしてファイルを選ぶか、.env ファイルをエディターにドラッグします。ファイルの内容全体をエディターに貼り付けることもできます。既存の名前には新しい値が設定され、新しい名前は末尾に追加されます。新規追加と置き換えの件数がメッセージで表示されます。内容を確認して保存するまでは、何も保存されません。

保存​

変更すると、画面下部のバーに2件追加、1件変更のような概要が表示されます。変更を保存をクリックするか、エディターで ⌘S / Ctrl+S を押すと保存できます。元に戻すには破棄をクリックします。いずれかの行にエラーがある間は、代わりに保存するには1行を修正してくださいと表示されます。

値を表示した後に、別のタブなどでシークレットが変更されると、バーに開いた後に、これらは別の場所で変更されましたと表示されます。最新を読み込むをクリックして現在の値を読み込み、もう一度変更してください。

コネクタから​

コネクタやデータベース接続によって設定されたシークレットは、Stripeなどのサービスごとに、設定するシークレットの件数とともに表示されます。各サービスがシークレットを最新の状態に保ちます。

変更するには、行にあるボタンを使います。キーを変更（キーで接続するサービスの場合）とコネクタを開く（それ以外の場合）をクリックすると、設定 > コネクタでそのサービスが開きます。そこでキーを置き換えを使うと、キーを差し替えられます。接続を変更をクリックすると、データパネルでデータベース接続が開きます。サービスのシークレットを削除するには、このプロジェクトから削除でサービスをプロジェクトから削除します。

公開される値​

NEXT_PUBLIC_ で始まる名前の値はブラウザにも渡されるため、サイトを開いた人なら誰でも読み取れます。サイトの URL や公開可能なキーなど、共有しても問題のない値に使ってください。API キーなどの非公開の値には、この接頭辞のない名前を使ってください。

プレビューと公開サイト​

変更はすぐにプレビューに反映されます。公開サイトでは、最後に公開したときの値が使われ続けます。値が異なる場合、ページ上部に「プレビューではすでに新しい値が使われています。公開サイトでは、最後に公開したときの値が使われています。」と表示されます。そこにある公開をクリックすると、公開サイトを更新できます。

コードでのシークレットの読み取り​

process.env.NAME でシークレットを読み取ります。

// Server code: API routes, server components and server actions can read every secret
const apiKey = process.env.OPENROUTER_API_KEY;

// Browser code can only read NEXT_PUBLIC_ names
const siteUrl = process.env.NEXT_PUBLIC_SITE_URL;