使用Google Signin及angularx-social-login如何判断用户是新用户还是已登录老用户

angularx-social-login返回的Google登录响应本身不会直接携带用户是否首次登录你的应用的标识，该状态需要你配合自有存储逻辑判断，常用两种实现方案：

方案1：后端存储判断（推荐，数据可靠性高） #

• 登录成功后拿到Google返回的用户唯一固定标识id（不要用邮箱作为判断依据，Google账号支持修改绑定邮箱，id是永久不变的唯一值），将该id传给你的后端接口
• 后端在自有用户表中查询是否存在对应该id的用户记录：
  • 无匹配记录：判定为首次登录的新用户，在用户表中新增该用户的信息，返回前端「新用户」标识
  • 有匹配记录：判定为老用户，直接返回已有用户数据和「老用户」标识即可

该方案不受用户换设备、清缓存的影响，适合所有需要持久化用户数据的场景

方案2：前端本地存储判断（适合无后端的纯前端应用） #

• 登录成功拿到用户id后，读取浏览器localStorage/sessionStorage中是否存储过对应id的登录标记：
  • 无对应标记：判定为当前设备的首次登录，写入一条标记如google_user_${id}: true，执行新用户逻辑
  • 有对应标记：判定为老用户，执行老用户逻辑

该方案局限性较强，用户清理缓存、更换设备后判断会失效，仅适合简单的轻量场景使用

前端判断示例代码 #

import { SocialAuthService, GoogleLoginProvider, SocialUser } from '@angularx-social-login';

constructor(private authService: SocialAuthService) {}

signInWithGoogle(): void {
  this.authService.signIn(GoogleLoginProvider.PROVIDER_ID).then((user: SocialUser) => {
    const userId = user.id;
    // 本地存储判断示例
    const isOldUser = localStorage.getItem(`google_login_record_${userId}`) !== null;
    if (!isOldUser) {
      console.log('检测到新用户首次登录');
      localStorage.setItem(`google_login_record_${userId}`, '1');
      // 此处可插入新用户引导、初始化配置等逻辑
    } else {
      console.log('老用户登录成功');
      // 此处可插入老用户个性化配置加载等逻辑
    }

    // 后端判断逻辑示例
    // this.userApi.checkUserExist(userId).subscribe(res => {
    //   if (res.isNew) {
    //     // 新用户逻辑
    //   } else {
    //     // 老用户逻辑
    //   }
    // })
  });
}

内容的提问来源于stack exchange，提问作者ing ab