如何在 reactjs 中发送 firebase getIdToken 和 axios？

Question

我正在使用以下代码获取用户 idtoken，并且可以使用 console.log 成功地将其记录到控制台：

firebase.auth().onAuthStateChanged(function(user) {
    if (user) {
        user.getIdToken().then(function(idToken) {  
           console.log("IDTOKEN:",idToken); 

          });
    }
});

我现在尝试使用 axios 在请求中将令牌作为 header 发送，如下所示：

async updatebalance() {
  let id = this.props.id;
  if (id === null || id === undefined) {
    id = "test";
  }
  var res = await axios.post(backUrl + "account/user_load_balance", {
    uid: localStorage.getItem("account-info"),
    id: id,
    idToken
  });
  if (res.data !== null && res.data.status && res.data.balance !== null && res.data.balance !== []) {
    this.props.dispatch(etherBalanceLoaded(res.data.balance[0]));
    this.props.dispatch(tokenBalanceLoaded(res.data.balance[1]));
  }
  this.setState({
    showbuttonFlag: true
  });
  this.reset_values();
}

但是我收到以下错误：

'idToken' 未定义

我想我可能需要将其设置为全局变量，以便它可以在不同的 function 中使用，但我不知道如何。 我怎样才能做到这一点？

解决方案1：

async updatebalance() {
        let id = this.props.id;
        if (id === null || id === undefined) {
            id = "test";
        }
const user = firebase.auth().currentUser
if (user) {
  const idToken = await user.getIdToken();
  var res = await axios.post(backUrl + "account/user_load_balance", {
    uid: localStorage.getItem("account-info"),
    id: id,
    idToken
  });

} else {
  console.log("User not logged in")
}
        if (res.data !== null && res.data.status && res.data.balance !== null && res.data.balance !== []) {
            this.props.dispatch(etherBalanceLoaded(res.data.balance[0]));
            this.props.dispatch(tokenBalanceLoaded(res.data.balance[1]));
        }
        this.setState({ showbuttonFlag: true });
        this.reset_values();
    }

    reset_values() {
        this.setState({ ethAmount: "" });
        this.setState({ sellethAmount: "" });
        this.setState({ ethPrice: "" });
        this.setState({ sellethPrice: "" });
        this.setState({ methAmount: "" });
        this.setState({ methPrice: "" });
        this.setState({ msellethAmount: "" });
        this.setState({ msellethPrice: "" });
    }

Answer 1

您可以在 Axios 请求之前使用getIdToken()并传递它，如下所示：

const user = firebase.auth().currentUser

if (user) {
  // user logged in
  const idToken = await user.getIdToken()

  var res = await axios.post(backUrl + "account/user_load_balance", {
    uid: localStorage.getItem("account-info"),
    id: id,
    idToken
  });

  if (res.data !== null && res.data.status && res.data.balance !== null && res.data.balance !== []) {
    this.props.dispatch(etherBalanceLoaded(res.data.balance[0]));
    this.props.dispatch(tokenBalanceLoaded(res.data.balance[1]));
  }
  this.setState({
    showbuttonFlag: true
  });
  this.reset_values();

} else {
  console.log("User not logged in")
}