React Native中Firebase实时数据库存Token数据报错求助
解决方案:React Native中通过Firebase API将用户数据存入实时数据库
一、核心实现逻辑
要完成用户数据与token的存储,需借助Firebase实时数据库REST API,通过PUT请求写入指定路径,并携带用户idToken完成身份验证,确保只有认证用户能写入自己的数据。
二、修改后的完整注册代码
在你现有注册流程的用户信息设置完成后,添加写入数据库的逻辑,代码如下:
const handleRegister = () => { if (password !== confirmPassword) { alert("密码不一致!"); return; } setIsLoading(true); axios({ method: 'POST', url: 'https://identitytoolkit.googleapis.com/v1/accounts:signUp', params: { key: '你的Firebase Web API Key', // 替换为实际项目的API Key }, data: { email, password, }, }).then((res) => { return axios({ method: 'POST', url: 'https://identitytoolkit.googleapis.com/v1/accounts:update', params: { key: '你的Firebase Web API Key', // 替换为实际项目的API Key }, data: { idToken: res.data.idToken, displayName: name + ' ' + surname } }); }).then((r) => { const userData = {...r.data, idToken: r.config.data.idToken}; setUser(userData); // 新增:写入Firebase实时数据库 const projectId = '你的Firebase项目ID'; // 替换为实际项目ID // 用用户localId作为节点ID,保证每个用户数据独立存储 const dbUrl = `https://${projectId}-default-rtdb.firebaseio.com/users/${userData.localId}.json`; return axios({ method: 'PUT', url: dbUrl, params: { auth: userData.idToken // 携带token完成身份验证 }, data: { email: userData.email, displayName: userData.displayName, // 可添加更多需要存储的字段,比如注册时间、头像地址等 } }); }).then(() => { alert("注册成功,数据已存入数据库"); }).catch(e => { console.log(e, '请求错误'); alert(e.response?.data?.error?.message || '操作失败'); }).finally(() => { setIsLoading(false); }); }
三、关键注意事项
- 路径设计:示例中使用
users/${localId}.json作为存储路径,localId是Firebase Auth返回的用户唯一标识,能避免不同用户数据冲突,也方便后续查询用户专属数据。 - 数据库规则配置:必须配置数据库规则,限制仅认证用户可读写自己的数据,示例规则如下:
{ "rules": { "users": { "$userId": { ".read": "$userId === auth.uid", ".write": "$userId === auth.uid" } } } } - PUT与POST的区别:PUT会覆盖指定路径的现有数据(路径不存在则创建),适合自定义节点ID的场景;POST会自动生成随机ID作为节点,适合批量无规则数据存储,这里用PUT更贴合用户数据的存储需求。
内容的提问来源于stack exchange,提问作者Proger228
相关产品推荐
相关产品推荐

