supabaseでtwitter authする［備忘録］

supabaseの認証をtwitterを用いて行いたかった。

本番で動かすには、DOC通りに行えばすんなり動くのだが、開発環境で認証を通そうとするとリダイレクトに404してしまう。

色々試行錯誤した結果、ローカル環境でのconfig.tomlに記載する設定値が違ったという落ち。

具体的には、config.tomlのclient_idとsecretに渡すIDはdevelopper portalで確認できるclient_idとsecretではなく、Access Token and Secretであった。

設定file内での項目名がclient_idとsecretであったために、惑わされていただけ。

[auth.external.twitter]
enabled = true
client_id = "env(DEV_TWITTER_CLIENT_ID)" # これがclient_idではなくAPIキー
secret = "env(DEV_TWITTER_SECRET)" # secretでなくAPI Secret Key

一応その他設定も晒しておく

.env.local

# next.js用
NEXT_PUBLIC_SUPABASE_ANON=....
NEXT_PUBLIC_SUPABASE_URL=http://localhost:54321/
NEXT_PUBLIC_SUPABASE_REDIRECT_URL=http://localhost:54321/auth/v1/callback

.env.local

# supabase用(supabase/.env.local)
export DEV_TWITTER_CLIENT_ID=...
export DEV_TWITTER_SECRET=...