Как обработать истечение токена в reactjs, используя firebase и передав idToken в перехватчик ax ios?

Question

Я пытаюсь интегрировать вход в систему firebase в моем реактивном проекте при передаче idtoken в перехватчик Ax ios для использования API.

Но я заметил, что срок действия моего idtoken истек и тот же старый токен передается в мой API.

Как я могу повторно sh токен и передать токен fre sh в мой перехватчик Ax ios?

Ниже приведен мой код:

import React, { Component } from "react";
import Navigation from "./Navigation";
import firebase from "./firebaseApp";
import axios from "axios";

import "./index.css";
class App extends Component {
  state = {
    authenticated: undefined,
  };
  componentDidMount() {
    firebase.auth().onAuthStateChanged((authenticated) => {
      if (authenticated) {
        let idTokenfinal;
        firebase
          .auth()
          .currentUser.getIdToken()
          .then((idToken) => {
            idTokenfinal = idToken;

            this.setState({
              authenticated: true,
            });
          })
          .catch((e) => {
            alert(e);
          });
        firebase.auth().onIdTokenChanged(function (user) {
          if (user) {
            // User is signed in or token was refreshed.
            user.getIdToken().then((idToken) => {

              idTokenfinal = idToken;

            });
          }
        });
        axios.interceptors.request.use(
          (config) => {
            if (config.data && config.data.authToken) {
              config.data.authToken = idTokenfinal;
            }
            return Promise.resolve(config);
          },
          function (error) {
            // Do something with request error
            return Promise.reject(error);
          }
        );
      } else {
        this.setState({
          authenticated: false,
        });
      }
    });
  }
  render() {
   return this.state.authenticated !== undefined &&
      this.state.authenticated !== null ? (
      <Navigation authenticated={this.state.authenticated} />
    ) : (
      <div className="loader"></div>
    );
  }
}
export default App;

Answer 1

Подобно onAuthStateChanged, есть onIdTokenChanged , который дает вам новый идентификационный токен всякий раз, когда он обновляется sh. Этот refre sh происходит автоматически каждый час. Если у вас есть прослушиватель, нет необходимости каждый раз вызывать getIdToken - просто используйте последнее значение, предоставленное слушателю идентификатора токена.

Если вы не хотите использовать прослушиватель по какой-либо причине, Вы можете позвонить getIdToken(true), чтобы обновить sh токен каждый раз, но это добавит накладные расходы к каждому вызову. Лучше использовать значение, предоставленное слушателем.