ユーザーアイコン

mizuko

3か月前

0
0

Next.js + Go でGoogle SSOを実現する(フロントエンド編)

Next.js
Google

ボタン押下時のhandler

'use client'; export const handleGoogleSignIn = (): void => { const clientId = process.env.NEXT_PUBLIC_GOOGLE_CLIENT_ID; const redirectUri = process.env.NEXT_PUBLIC_GOOGLE_REDIRECT_URI; // Google OAuth 2.0 URLの構築 const scope = 'email profile openid'; const responseType = 'code'; const authUrl = `https://accounts.google.com/o/oauth2/v2/auth?client_id=${clientId}&redirect_uri=${redirectUri}&scope=${scope}&response_type=${responseType}&access_type=offline&prompt=consent`; // ユーザーをGoogleの認証ページへリダイレクト window.location.href = authUrl; };

ボタンのデザイン(ボタンはGoogleのデザイン規約に準拠)

<GoogleSingInButton handler={handleGoogleSignIn} />

ボタンを押下すると、Google側のログイン画面へ遷移する