Auth0 Home Blog Docs

Where/how to store refresh token for React Native mobile app?

The documentation mentions that refresh tokens must be stored securely by an application. How should we store the refresh token for a React Native mobile app?

Hi @jrp-23,

This doc dives into the specifics of the utility classes for storing tokens with auth0 and with iOS and Android.

Hope this helps!

Thanks,
Dan

Thanks for the info @dan.woda. I was hoping to do this directly in React Native and not have to code iOS/Android specific solutions. Is there a way to do this with just React Native? I see some articles out there saying to use AsyncStorage, but I also see some articles explaing that AsyncStorage is not secure.

Is there an example of how to interact with the native iOS/Android code from React native? It looks like React Native’s Native Modules are one way to do it?

https://github.com/pradeep1991singh/react-native-secure-key-store is what i use to store my tokens react native sensitive info doesn’t work and is not being updated

//Here is my somewhat broken code for refresh tokens

componentDidMount () {
    RNSecureKeyStore.get("accessToken").then(accessToken => {
            auth0.auth.userInfo({token: accessToken}).then(data => {this.gotoAccount(data);}).catch(err => {
                RNSecureKeyStore.get("refreshToken").then(refreshToken => { // get the refresh token from the secure storage
                    // request for a new access token using the refresh token
                    auth0.auth
                      .refreshToken({ refreshToken: refreshToken })
                      .then(newAccessToken => {
                        //SInfo.setItem("accessToken", newAccessToken);
                        RNSecureKeyStore.set("accessToken", newAccessToken, {accessible: ACCESSIBLE.ALWAYS_THIS_DEVICE_ONLY})
                        RNRestart.Restart();
                      })
                      .catch(accessTokenErr => {
                        console.log("error getting new access token: ", accessTokenErr);
                      });
                  }).catch(err => {
                    console.log("no refresh token");
                  });
            })
      }).catch(err => {
        console.log("No access token")
        //this.gotoLogin();
      })
  }

//and my login code

login = () => {
  auth0.webAuth.authorize({
    scope: Config.AUTHO_SCOPE,
    audience: Config.AUTH0_AUDIENCE,
    device: DeviceInfo.getDeviceId(),
    prompt: 'login'
  }).then(res => {
    //console.log(res.accessToken);

      //SInfo.setItem("accessToken", res.accessToken, {});
      //SInfo.setItem("refreshToken", res.refreshToken, {});
      RNSecureKeyStore.set("accessToken", res.accessToken, {accessible: ACCESSIBLE.ALWAYS_THIS_DEVICE_ONLY})
      	.then((res) => {
      		console.log(res);
      	}, (err) => {
      		console.log(err);
      	});
        RNSecureKeyStore.set("refreshToken", res.refreshToken, {accessible: ACCESSIBLE.ALWAYS_THIS_DEVICE_ONLY})
          .then((res) => {
            console.log(res);
          }, (err) => {
            console.log(err);
          });

      console.log();

      auth0.auth.userInfo({token: res.accessToken}).then(data => {
        this.gotoAccount(data);
      }).catch(err => {
        console.log("error occurred while trying to get user details: ", err);
      })
  }).catch(err => {
    console.log("error occurred while trying to authenticate: ", err);
  })
}

Thanks @digitaluniverse! I will give it a try.

react-native-secure-key-store seems like a suitable option. Although I’m curious if Auth0 has plans to release their own NPM module to provide this functionality?

Hey folks,

Our content team is working on a new react native blog and I have raised the topic of token storage with them. Thanks for giving us input on the topic. I have heard a lot about react native in the recent weeks!

Thanks all,
Dan

Thanks @dan.woda i look forward to the blog. If it is decided to not currently provide token storage functionality, is there a formal feature request process that I can submit this for? I’m also just curious in general about feature requests from the community?

@jrp-23,

I mentioned token storage to the writer, and it is known that is a desired topic.

Yes, for formal feature requests please use our feedback page. Every request is read by our product team.

Thanks for asking!

1 Like

(post withdrawn by author, will be automatically deleted in 24 hours unless flagged)