React Native 中的 Auth0 刷新令牌失败并显示 401

Posted 2023-03-08

【中文标题】React Native 中的 Auth0 刷新令牌失败并显示 401

【英文标题】：Auth0 refresh token in React Native fails with 401

【发布时间】：2021-06-11 12:21:52

【问题描述】：

在我的 React Native 应用程序中——初始化应用程序不是 Expo——我正在尝试刷新 access_token，但我的 POST 调用失败并显示 401。我正在测试这个功能，所以我在登录后大约 30 秒拨打POST，所以不确定这是否起作用。

在我的初始登录中，我确实得到了一个refresh_token 以及一个有效的access_token。然后我告诉我的应用等待 30 秒，然后拨打 POST 电话，如下所示：

const url = 'https://mydomain.auth0.com/oauth/token';
const postOptions = 
   method: 'POST',
   url: url,
   headers: 
      "content-type": 'application/x-www-form-urlencoded'
   ,
   form: 
      grant_type: 'refresh_token',
      client_id: 'MY_CLIENT_ID',
      refresh_token: 'REFRESH_TOKEN_RECEIVED_DURING_LOG_IN'
   
;

fetch(url, postOptions)
   .then((response) => 
       debugger;
       // this is where I get response.status 401
   )

知道这里有什么问题吗？

还想提一下，在我的应用程序设置下，Refresh Token 在“授予类型”下被选中，但未启用刷新令牌轮换或过期。

【参考方案1】：

我想出了这个并分享它以防其他人将来需要它。

首先，Auth0 文档充其量是具有误导性的。他们不断提到一个不起作用的常规POST 电话。

在我的 React Native 应用程序中，我使用了他们的 react-native-auth0 库。这个库确实提供了一个refreshToken() 方法，这是我最终使用的。

在我分享代码之前，这里有几点非常重要：

确保在用户初始身份验证调用的scope 中包含offline_access。如果在您的scope 中不包含offline_access，您将不会得到refresh_token。一旦您收到它以及您的access_token 和id_token，请将其存放起来，因为您会多次使用它。这就引出了第二点。 除非您另行设置，否则您的refresh_token 不会过期。因此，请将其存储在某个安全的地方，而不仅仅是AsyncStorage。如上所述，除非您以其他方式设置它或它被撤销，否则您的 refresh_token 不会过期，您可以一次又一次地使用它。

话虽如此，代码如下。请记住，在启动时，我将 auth0 初始化为一个全局变量，以便我可以在我的应用程序的不同部分访问它。

这是我在index.js 中的初始化：

import Auth0 from 'react-native-auth0';

global.auth0 = new Auth0(
   domain: "MY_DOMAIN.auth0.com",
   clientId: "MY_CLIENT_ID",
);

下面是我如何使用refreshToken() 方法：

// First, retrieve the refresh_token you stored somewhere secure after your initial authentication call for the user
global.auth0.auth.refreshToken( refreshToken: 'MY_REFRESH_TOKEN' )
   .then(result => 
      // If you're doing it right, the result will include a new access_token
   )

【参考方案2】：

您可能需要在 access_token 中添加授权标头：

const url = 'https://mydomain.auth0.com/oauth/token';
const postOptions = 
   method: 'POST',
   url: url,
   headers: 
      "content-type": 'application/x-www-form-urlencoded',
      "Authorization" 'bearer '+access_token,
   ,
   body: JSON.stringify(
      grant_type: 'refresh_token',
      client_id: 'MY_CLIENT_ID',
      refresh_token: 'REFRESH_TOKEN_RECEIVED_DURING_LOG_IN'
   );
;

fetch(url, postOptions)
   .then((response) => 
       debugger;
       // this is where I get response.status 401
   )

【讨论】：

我也考虑过并尝试过，但仍然得到401 响应。