freks blog

about

Vercelのデプロイ後のURLを取得する

created: 2020-11-26
おすすめ記事: 出会ってよかったプログラマー本

Next.jsで開発してて、/pages/api にAPIを立てたときに、フルのURLを取りたかったら、 Vercelの環境変数を設定することで、取れました

Vercelでプロジェクトを開いて、Project Settings > Environment Variables

Vercel environment variables settings

Reference to System Environment Variable を選んで
VERCEL_URLを選ぶと、好きな環境変数名で取れるようになります

ローカル環境で使うときは

vercel env pull

でVercelで設定した環境変数が、.env にダウンロードされますが、VERCEL_URLは空になります

const url = process.env.NEXT_PUBLIC_VERCEL_URL || 'localhost:3000'

として使いました
Vercelにデプロイしたら、そのURLが入ってきます

参考) Environment Variables - Vercel Documentation


Amazonのアソシエイトとして、blog.freks.jp は適格販売により収入を得ています。
This site is managed by freks