React Native 中的 Auth0 刷新令牌因 401 而失败

Question

在我的 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 在“授权类型”下选中，但未启用刷新令牌轮换或过期。

Answer 1

您可能需要使用 access_token:

添加授权 header

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
   })

Answer 2

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

首先，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
   })

React Native 中的 Auth0 刷新令牌因 401 而失败

Auth0 refresh token in React Native fails with 401

authentication

auth0

react-native

refresh-token