◉RORK LABEN
●GPT-6.1 SOL — Rork のモデルメニューに追加(09-29)。Low/Medium/High を選べ、Pro・Max に含まれます●SONNET 5.5 — UI づくりが得意で、Sonnet 5 より出力が速いモデルが選べます(09-28)●SDK 58 — Expo SDK 58 が 10/15 に正式リリースされました(Beta は 09/15 から)。上げる前に依存の対応状況を確認しましょう●SDK 58 ISSUE — Android ウィジェットが定期更新されない、Stripe が静的リンクになるなど初期報告が出ています●OBSERVE — EAS Observe がネイティブクラッシュも記録します(SDK 57.0.21 以降・10/07)●NEW — 起動広告が、背面から戻った回にしか出ていませんでした。「前面に戻った」合図が、…●GPT-6.1 SOL — Rork のモデルメニューに追加(09-29)。Low/Medium/High を選べ、Pro・Max に含まれます●SONNET 5.5 — UI づくりが得意で、Sonnet 5 より出力が速いモデルが選べます(09-28)●SDK 58 — Expo SDK 58 が 10/15 に正式リリースされました(Beta は 09/15 から)。上げる前に依存の対応状況を確認しましょう●SDK 58 ISSUE — Android ウィジェットが定期更新されない、Stripe が静的リンクになるなど初期報告が出ています●OBSERVE — EAS Observe がネイティブクラッシュも記録します(SDK 57.0.21 以降・10/07)●NEW — 起動広告が、背面から戻った回にしか出ていませんでした。「前面に戻った」合図が、…
記事一覧/AIモデル
◉ AIモデル/2026-10-20初級

「Connect Supabase」と打つ前に、画面から写す2つの値と、写してはいけない1つ

Rork のチャットに「Connect Supabase」と貼る前に用意するのは、Publishable key とプロジェクトのリンクの2つだけです。Supabase のどこから写すか、同じ画面に並ぶ secret key を間違えて貼らないための確かめ方を、手元で動くチェック用スクリプトと一緒にお伝えします。

Rork593Supabase39Publishable keyはじめの一歩バックエンド12

壁紙アプリの個人開発で Supabase を触り始めたころ、公式ダッシュボードを開いたまま、Rork のチャット欄に「Connect Supabase」と打ちかけて、手が止まったことがあります。画面にはキーが何本も並んでいて、どれを写せばいいのかが分からなかったのです。

私自身、キーの扱いで焦った経験が何度かありますので、取り違えの起きやすい場所は先に押さえておきたいのです。Rork の公式ドキュメントに書かれている手順は短いものです。Supabase で新しいプロジェクトを作って、Publishable key とプロジェクトのリンクをコピーし、チャットに「Connect Supabase」の言葉と一緒に貼ります。それだけです。ただ、その「コピーして」の部分は画面のスクリーンショットに任されていて、どの文字列を指すのかは文章では書かれておりません。

ここでは、貼る前に済ませておきたい準備を順番にお伝えします。貼ってよい値は2つで、貼ってはいけない値は1つです。 これを先に覚えておけば、チャットに貼る一瞬で迷わずに済みます。

用意する値は2つだけです

Rork のドキュメントが求めているのは、次の2つです。

値見た目貼ってよいか
Project URL(ドキュメントでは「プロジェクトのリンク」)(英数字).supabase.co の形のアドレス貼ってよい
Publishable keysb_publishable_ で始まる文字列貼ってよい
Secret keysb_secret_ で始まる文字列貼ってはいけない

Supabase の公式ドキュメントによると、Publishable key は「ウェブページ、モバイルアプリ、ソースコードの中に置いても安全」な低権限のキーです。データの読み書きは Row Level Security(行ごとの権限設定)が守る前提で作られています。

一方の Secret key は、同じドキュメントに「あなたが作った Row Level Security のポリシーをすべて素通りする」と書かれています。サーバーや Edge Function のような、自分が管理する場所にだけ置くキーです。出荷するアプリの中や、ソース管理に入れてはいけません。

Rork のページは Secret key について何も触れておりません。だから「書いていないから大丈夫」ではなく、書いていないからこそ、こちらが先に線を引いておく必要があるのだと思います。

どこから写すか

場所は2か所に分かれています。

Project URL とキーを同時に見たいときは、Supabase ダッシュボードの Connect ダイアログが早いです。選んだフレームワークに合わせて、URL と Publishable key を並べて見せてくれます。

キーだけを探し直すなら、Settings > API Keys です。ここには旧形式を含めてすべてのキーが並びます。名前が「Publishable key」の行を探してください。隣に「Secret key」が並んでいるのが普通ですので、行の名前を指でなぞって確かめる癖をつけておくと安全です。

旧形式のキーも、まだ画面に残っている場合があります。anon(Publishable key の旧形式)と service_role(Secret key の旧形式)です。どちらも eyJ で始まる長い文字列で、見た目では区別がつきません。Supabase は 2026 年末までにこの2つを廃止する予定と案内しており、新しいキーを作っても旧キーは自動では無効にならず、Settings > API Keys で止めるまで有効なままです。

貼る前に、手元で形を確かめます

見た目で区別できない旧形式の eyJ があるので、私は貼る前に3秒だけ機械に見てもらうことにしています。次のスクリプトは、URL の形と、キーの種類を判定します。旧形式なら、中身(JWT の payload)の role を読んで anon か service_role かを見分けます。

解決したいのは「貼る直前の取り違え」だけです。スクリプトはネットワークに一切つながず、渡した文字列を手元で調べるだけです。

// check-supabase-values.mjs
// 貼る前に、手元の2つの値が「貼ってよいもの」かを判定します。
// 使い方: node check-supabase-values.mjs "<Project URL>" "<キー>"
const [url = "", key = ""] = process.argv.slice(2);
 
const problems = [];
 
// 1) Project URL: https://<project-ref>.supabase.co の形か
if (!/^https:\/\/[a-z0-9]+\.supabase\.co\/?$/.test(url.trim())) {
  problems.push("URL が https://xxxx.supabase.co の形ではありません(末尾に /rest/v1 などが付いていないかを確認)");
}
 
// 2) キーの種類を見分ける
const k = key.trim();
if (k.startsWith("sb_publishable_")) {
  // 貼ってよい
} else if (k.startsWith("sb_secret_")) {
  problems.push("sb_secret_ で始まるキーです。アプリには入れてはいけません");
} else if (k.startsWith("eyJ")) {
  // 旧形式(JWT)。中身の role で anon / service_role を判定する
  try {
    const payload = JSON.parse(Buffer.from(k.split(".")[1], "base64url").toString());
    if (payload.role === "service_role") {
      problems.push("旧形式の service_role キーです。アプリには入れてはいけません");
    } else if (payload.role !== "anon") {
      problems.push(`role=${payload.role} は想定外です。Publishable key を探し直してください`);
    }
  } catch {
    problems.push("eyJ で始まりますが、キーとして読めません。コピーの途中で切れていないか確認してください");
  }
} else {
  problems.push("キーの形式が分かりません。Settings > API Keys の Publishable key を写し直してください");
}
 
if (problems.length) {
  console.log("貼らずに止まってください:\n- " + problems.join("\n- "));
  process.exit(1);
}
console.log("OK: Project URL と Publishable key の形です。貼ってかまいません。");

動作は Node 22 で確かめました。ダミーの文字列で試したところ、sb_publishable_ のキーは通り、sb_secret_ のキーと role が service_role の旧形式キーは終了コード 1 で止まります。URL の末尾に /rest/v1 を付けた形も、同じく止まります。

なぜ URL の形まで見ているのかというと、API の呼び出し先として表示される長いアドレスを、そのまま写してしまう取り違えが起こりうるからです。貼るのは https:// から .supabase.co までの短い形です。

貼る手順

準備ができたら、Rork のプロジェクトのチャットに次のように貼ります。ドキュメントの文言どおり、2つの値と「Connect Supabase」を同じメッセージに入れます。

Connect Supabase
Project URL: https://(あなたのプロジェクト).supabase.co
Publishable key: sb_publishable_(ここに写した文字列)

そのあとは、Rork がチャットに出す設定の案内に従います。ここから先は Rork の返答が主役ですので、私から足すことはほとんどありません。

もう一つだけ。バックエンドを自分の Supabase アカウントで動かす場合、請求は Supabase から直接届きます。Rork 側がホストする方法もドキュメントに案内がありますので、料金の出どころは先に決めておいたほうが、あとで慌てません。

つながらないとき、最初に疑うこと

貼ったのにデータが読めない場合は、キーの取り違えより先に、Row Level Security の設定を疑います。Publishable key は低権限として作られているので、ポリシーがなければ何も返らないのが正しい挙動です。切り分けは Rork アプリで Supabase のデータが表示されないときの確認手順 に書いております。

また、外部 API のキーをどこに置くかは、Supabase のキーとは別の問題です。環境変数と Supabase Edge Function の使い分け と、キーを取り違えたときの失効と差し替えの手順 を合わせてご覧ください。

仮に Secret key を貼ってしまったと気づいたら、Supabase の Settings > API Keys で、そのキーを作り直してください。チャットや生成コードに一度でも入った値は、消しても「入っていなかった」ことにはならないからです。

貼るのは公開してよい2つだけです。迷ったら、貼らずに止まります。 私はこの一文を、キーを扱う作業のたびに自分に言い聞かせております。

次にやることは一つです。Supabase の画面で Publishable key の行を探し、上のスクリプトに通してから、チャットに貼ってみてください。

シェア

お読みいただきありがとうございます

Rork Lab は広告なしで運営しており、サーバー費用などの運営コストはメンバーシップのご支援で賄っています。実装コード・ベンチマーク・本番設計パターンなど、実務でお役立ていただける記事を毎日更新しています。もし読んでよかったと感じていただけましたら、ぜひご覧ください。

  • ✦コピー&ペーストで使える実装コード付き
  • ✦毎日新しい上級ガイドを追加
  • ✦¥580/月 または ¥1,480 の永久アクセス
メンバーシップを見る →

もしこの記事がお役に立ちましたら、チップ(¥150)で応援いただけると大変励みになります。広告なしでの運営を続けるため、皆さまのご支援が大きな力になっています。

関連記事

◉ AI モデル2026-10-14
プロンプトをアプリから外して Edge Function に置く。守りは入力側でなく、出力側に作りました
アプリに入れた AI の指示文は、配信した日から読める側に回ります。プロンプトを Supabase Edge Function に寄せ、クライアントにはタスク名だけを言わせ、守りを出力の許可リストに置く構成を、テスト付きのコードで整理しました。
◉ AI モデル2026-09-13
そのAPIキー、アプリの中に入っていませんか — Rork の環境変数と Supabase Edge Function の使い分け
Rork で外部 API をつなぐとき、キーの置き場所には環境変数と Supabase Edge Function の二つがあります。どちらに寄せるかを「あとから取り消せるか」「誰に請求が来るか」で決める基準と、置いたあとに自分の目で確かめる手順をまとめます。
◉ AI モデル2026-04-30
Rork で『AI が自動でアルバム化する写真整理アプリ』を作る実装ガイド — Vision × CLIP × pgvector で本番品質のパイプラインを設計する
Rork で写真ライブラリを AI が自動分類するアプリを本気で作るための完全実装ガイドです。Vision で顔・物体・テキストを抽出し、CLIP 埋め込みで意味検索を実現し、Supabase pgvector で類似画像検索を可能にする本番運用パイプラインを、コード付きで一から設計します。