如何使用Firebase身份验证在用户注册过程中保存其他信息 [英] How to save extra info during user signup process using firebase authentication

查看:128
本文介绍了如何使用Firebase身份验证在用户注册过程中保存其他信息的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在建立一个网站,该网站集成了 firebase身份验证,用于登录/注册网站用户.

用户可以通过电子邮件密码或移动OTP方法登录/注册. 我正在使用官方的Firebase JS身份验证UI窗口小部件: firebaseui-web 进行此身份验证过程./p>

注册时,我还想捕获其他用户详细信息,例如全名,性别,年龄等.

我在网上发现了两种方法:

  1. 成功注册后,将额外的信息存储在firestore中.

    这种方法的问题是我想成为原子交易.意味着,所有额外信息都应该在注册过程期间存储,或者在注册过程中不会成功.我不确定如何实现此流程,甚至根本不可能.

  2. 在firebase的 auth对象字段中存储其他信息例如在displayName中,使用JSON.stringify/JSON.parse方法的photoURL.我正在使用他们的auth UI小部件,不确定在电子邮件或移动OTP注册过程中如何嵌入此信息.

那么,如何在注册过程中保存用户的额外信息? 也许有其他不同的方法吗?

网站托管在Firebase托管上.网站使用Firestore来存储用户的任何其他数据,因为Firebase身份验证不提供此功能.我还为一些基本的CRUD操作实现了Firebase云功能(Typescript,node.js).因此,简而言之,是一个完整的Firebase环境.

解决方案

这是每个Firebase用户都必须处理的事情.一般如何解决?正如其他用户指出的那样,可以通过将其他用户信息添加到Firestore中来解决此问题.你能保证原子性吗?不,您不能,auth和db是两个不同的系统,您可以将用户添加到auth,并且在回调中发现您无法将用户添加到db,因为例如您没有Internet连接.人做什么?通常与它同住.

如果您的应用程序必须保证原子性,那么您可以加倍努力,并在firebase函数中实现身份验证.例如,这是两步登录的示例:

import { Request, Response } from "express";
import * as admin from 'firebase-admin'

export async function create(req: Request, res: Response) {
   try {
       const { displayName, password, email, role } = req.body

       if (!displayName || !password || !email || !role) {
           return res.status(400).send({ message: 'Missing fields' })
       }

       const { uid } = await admin.auth().createUser({
           displayName,
           password,
           email
       })
       await admin.auth().setCustomUserClaims(uid, { role })

       return res.status(201).send({ uid })
   } catch (err) {
       return handleError(res, err)
   }
}

function handleError(res: Response, err: any) {
   return res.status(500).send({ message: `${err.code} - ${err.message}` });
}

如果出现问题,您可以从auth添加用户删除.这样至少可以保证您的回滚代码将在Google服务器中执行.

此代码示例摘自 https://www.toptal.com/firebase/role-based-firebase-authentication

I'm building a website where I've integrated firebase authentication for login/signup of site users.

Users can login/signup via either email-password or mobile OTP method. I'm using official firebase js Auth UI Widget: firebaseui-web for this authentication process.

While signup, I also want to capture additional user details like full name, gender, age etc.

I found 2 approaches on the web for this:

  1. Store extra info in firestore after successful signup.

    Issue with this approach is I want to be it an atomic transaction. Means, either all the extra info should be stored during signup process or signup process shouldn't succeed. I'm not sure how to implement this flow or is it even possible at all.

  2. Store extra info in firebase auth object field like in displayName, photoURL using JSON.stringify/JSON.parse method. I'm using their auth UI widget and not sure how to embed this info during email or mobile OTP signup.

So, how to save extra info of user during signup process? Any different approach maybe?

Website is hosted on firebase hosting. Site uses firestore for storing any additional data of users because firebase auth doesn't provide this functionality. I've also implemented firebase cloud functions (Typescript, node.js) for some basic CRUD operations. So in nutshell, a full firebase environment.

解决方案

This is something that every firebase user has to deal with. How is generally solved? As other users point out, it is solved by adding the extra user information into Firestore. Can you guarantee that atomiticy? No, you can't, auth and db are two different systems, you can add the user to auth and in the callback find out you cannot add the user to db because you dont have internet connection for instance. What people do? Generally live with it.

If it is fundamental for your application to guarantee atomiticy you can go an extra mile and implement your authentication in a firebase function. For instance, this is an example of a two step sign in:

import { Request, Response } from "express";
import * as admin from 'firebase-admin'

export async function create(req: Request, res: Response) {
   try {
       const { displayName, password, email, role } = req.body

       if (!displayName || !password || !email || !role) {
           return res.status(400).send({ message: 'Missing fields' })
       }

       const { uid } = await admin.auth().createUser({
           displayName,
           password,
           email
       })
       await admin.auth().setCustomUserClaims(uid, { role })

       return res.status(201).send({ uid })
   } catch (err) {
       return handleError(res, err)
   }
}

function handleError(res: Response, err: any) {
   return res.status(500).send({ message: `${err.code} - ${err.message}` });
}

You could add the user removal from auth if something goes wrong. This guarantees at least that your rollback code will be executed in the Google servers.

This code example was extracted from https://www.toptal.com/firebase/role-based-firebase-authentication

这篇关于如何使用Firebase身份验证在用户注册过程中保存其他信息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆