给项目接入谷歌登录

Google 那边怎么操作

1、打开 Google Cloud Console。
2、选择或新建一个项目，比如 Knowledge Pack。
3、进入 Google Auth Platform。
4、配置 Branding / OAuth consent screen：
App name：知识包裹 或英文 Knowledge Pack
User support email：你的邮箱
Developer contact email：你的邮箱
App domain 以后填你的正式域名
Privacy Policy URL / Terms URL：等你上线后最好有独立 URL。
5、配置 Data Access / Scopes：
openid
…/auth/userinfo.email
…/auth/userinfo.profile
6、进入 Clients，创建 OAuth Client：
Application type：Web application
Name：Knowledge Pack Web
7、填 Authorized JavaScript origins：
本地开发：
http://localhost:5173
http://127.0.0.1:5173
上线后再加你的正式域名，比如：
https://你的域名.com
https://你的netlify域名.netlify.app
8、填 Authorized redirect URIs：
你的 Supabase 项目 callback 应该是：
https://**************.supabase.co/auth/v1/callback
如果本地跑 Supabase CLI 才需要：
http://127.0.0.1:54321/auth/v1/callback
9、创建后，Google 会给你：
Client ID
Client Secret

Supabase 那边怎么填

1、打开 Supabase Dashboard。
2、进入你的项目
3、进入：

Authentication → Sign In / Providers → Google

4、Enable Google provider。
填入 Google 给你的：Client ID、Client Secret
保存。

5、去 Supabase 的 URL Configuration 检查
Authentication → URL Configuration

Site URL 建议填正式站点，比如：
https://你的正式域名.com
Redirect URLs 加：
http://localhost:5173/**
http://127.0.0.1:5173/**
https://你的正式域名.com/**
https://你的netlify域名.netlify.app/**

前端代码怎么加

const signInWithGoogle = async () => {
  const { error } = await supabase.auth.signInWithOAuth({
    provider: 'google',
    options: {
      redirectTo: window.location.origin,
    },
  });

  if (error) {
    // show toast
  }
};

登录页放一个按钮

<button onClick={signInWithGoogle}>
  Continue with Google
</button>