壁紙アプリの個人開発で Supabase を触り始めたころ、公式ダッシュボードを開いたまま、Rork のチャット欄に「Connect Supabase」と打ちかけて、手が止まったことがあります。画面にはキーが何本も並んでいて、どれを写せばいいのかが分からなかったのです。
私自身、キーの扱いで焦った経験が何度かありますので、取り違えの起きやすい場所は先に押さえておきたいのです。Rork の公式ドキュメントに書かれている手順は短いものです。Supabase で新しいプロジェクトを作って、Publishable key とプロジェクトのリンクをコピーし、チャットに「Connect Supabase」の言葉と一緒に貼ります。それだけです。ただ、その「コピーして」の部分は画面のスクリーンショットに任されていて、どの文字列を指すのかは文章では書かれておりません。
ここでは、貼る前に済ませておきたい準備を順番にお伝えします。貼ってよい値は2つで、貼ってはいけない値は1つです。 これを先に覚えておけば、チャットに貼る一瞬で迷わずに済みます。
用意する値は2つだけです
Rork のドキュメントが求めているのは、次の2つです。
| 値 | 見た目 | 貼ってよいか |
|---|---|---|
| Project URL(ドキュメントでは「プロジェクトのリンク」) | (英数字).supabase.co の形のアドレス | 貼ってよい |
| Publishable key | sb_publishable_ で始まる文字列 | 貼ってよい |
| Secret key | sb_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 の行を探し、上のスクリプトに通してから、チャットに貼ってみてください。