DEVDEV

Supabase stoargeでOGP表示

作成日
2022-06-20
更新日
2022-06-20

publicURLを取得する関数を作る

storage.ts
import { supabase } from "@/libs/supabaseClient"; interface Props { bucketName: string; fileName: string; defaultURL: string; } export async function fetchPublicURL({ bucketName, fileName, defaultURL, }: Props): Promise<string> { if (!fileName) { return defaultURL; } const { data, error } = supabase.storage .from(bucketName) .getPublicUrl(fileName); if (error) { return defaultURL; } return data?.publicURL ?? defaultURL; }

呼び出し

tsx
const ogpImage = await fetchPublicURL({ bucketName: "gears", fileName: gear?.image || "", defaultURL: "/images/ogp.png", });

確認

image

Related