Question

我正在尝试设置Auth0身份验证。当我尝试将HTTP请求发送到Django后端API（也受Auth0保护）时，我收到401（未经授权的错误）消息。我设法将问题缩小到提交访问令牌的范围。

当我尝试通过控制台从我的响应前端使用axios发送HTTP请求时，如果我控制台记录了访问令牌，它说未定义。并且该请求无效。同时，如果我只是呈现访问令牌变量，则可以在View上显示它，如果从那里复制它并使用Postman发送请求，则一切正常。知道为什么会这样吗？非常感谢。

-编辑-

我发现登录后重新加载后会发生错误。第一次登录GET请求时，按预期方式工作。因此，我假设App.js类的componentDidMount（）中存在错误，但无法弄清楚原因。

async componentDidMount() {
   const token = auth0Client.getAccesstoken();
   const header = {
     headers: { Authorization: `Bearer ${token}` }
   };
   console.log(token);
   const questions = (await axios.get(
     "http://localhost:8000/api/question",
     header
   )).data;
   this.setState({
     questions
   });
 }

class App extends Component {
  async componentDidMount() {
    if (this.props.location.pathname === "/callback") return;
    try {
      await auth0Client.silentAuth();
      this.forceUpdate();
    } catch (err) {
      if (err.error !== "login_required") console.log(err.error);
    }
  }

  render() {
    return ( ...

//If I render it like this on JSX I can display it copy it and use it over Postman
<p>{auth0Client.getAccesstoken()}</p>

Answer 1

我认为这是一个异步问题，请尝试：

const token = await auth0Client.getAccesstoken();

访问令牌未定义Auth0 ReactJS

1 个答案: