首页 > 解决方案 > Firebase 一小时后自动注销用户

问题描述

因此,我对此进行了一些研究,并且我了解 firebase 每隔一小时更新一次刷新令牌,因为 firebase id 令牌在一小时后过期。我读到一个小时后的firebase刷新令牌是一件自动的事情,用户不必对此做任何事情。

但是我的用户在一个小时后自动注销。只要用户不自愿注销,我希望用户会话持续存在。我也不知道如何调试它。

这是我的 package.json -

{
    "name": "with-firebase-authentication",
    "version": "1.0.0",
    "scripts": {
        "dev": "next dev",
        "build": "next build",
        "start": "next start",
        "export": "next export"
    },
    "dependencies": {
        "firebase": "^8.2.1",
        "firebase-admin": "^9.4.2",
        "firebase-functions": "^3.13.1",
        "handlebars": "^4.7.6",
        "js-cookie": "2.2.1",
        "luxon": "^1.25.0",
        "next": "latest",
        "nookies": "^2.5.0",
        "react": "^16.13.1",
        "react-dom": "^16.13.1",
        "react-firebaseui": "^4.1.0",
        "swr": "0.2.3",
        "uuid": "^8.3.2"
    },
    "license": "MIT"
}

我将此示例用作我的应用程序的基础 - https://github.com/vercel/next.js/tree/canary/examples/with-firebase-authentication

编辑 - 这是一些额外的代码;

userCookies.js

import cookies from 'js-cookie';

export const getUserFromCookie = () => {
    const cookie = cookies.get('auth');
    if (!cookie) {
        return;
    }
    return JSON.parse(cookie);
};

export const setUserCookie = user => {
    cookies.set('auth', user, {
        // firebase id tokens expire in one hour
        // set cookie expiry to match
        // expires: 1 / 24,
        expires: 1 / 24,
    });
};

export const removeUserCookie = () => cookies.remove('auth');

使用User.js

import { useEffect, useState } from 'react';
import { useRouter } from 'next/router';
import firebase from 'firebase/app';
import 'firebase/auth';
import initFirebase from '../auth/initFirebase';
import { removeUserCookie, setUserCookie, getUserFromCookie } from './userCookies';
import { mapUserData } from './mapUserData';

initFirebase();

const useUser = () => {
    const [user, setUser] = useState();
    const router = useRouter();

    useEffect(() => {
        // Firebase updates the id token every hour, this
        // makes sure the react state and the cookie are
        // both kept up to date
        const cancelAuthListener = firebase.auth().onIdTokenChanged(async user => {
            if (user) {
                const userData = await mapUserData(user);
                setUserCookie(userData);
                setUser(userData);
            } else {
                removeUserCookie();
                setUser();
            }
        });

        const userFromCookie = getUserFromCookie();
        if (!userFromCookie) {
            router.push('/');
            return;
        }
        setUser(userFromCookie);

        return () => {
            cancelAuthListener();
        };
    }, []);

    return { user, logout };
};

export { useUser };

地图用户数据.js

export const mapUserData = (user) => {
  let token
  const { uid, email } = user
  user.getIdToken(true).then(id => token = id)
  return {
    id: uid,
    email,
    token,
  }
}

我认为cookies而不是firebase身份验证存在一些问题。

标签: javascriptfirebaseauthenticationfirebase-authenticationnext.js

解决方案


设置 firebase.auth.Auth.Persistence.SESSION 或 NONE。

阅读更多内容:https ://firebase.google.com/docs/auth/web/auth-state-persistence#modifying_the_auth_state_persistence


推荐阅读