Okta integration issue with react native app created using expo

Please provide the following:

  1. SDK Version:38.0.0
  2. Platforms(Android/iOS/web/all): ios

Hi everyone, i am very new to react native world and I have been trying to integrate okta with my react native application created using expo. But i keep getting one or the other issues. I have also checked the react sample by okta but it does not use expo. All the issues ultimately boil down to the events module being used by okta i believe. I have spent lots of hours trying to figure but couldnt find the fix. I really appreciate if someone could please help me with it.

sample by okta: samples-js-react/custom-login at master · okta/samples-js-react · GitHub

import 'react-native-gesture-handler';
import { StatusBar } from 'expo-status-bar';
import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, SafeAreaView } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import LoginScreen from './screens/LoginScreen';
import ProfileScreen from './screens/ProfileScreen';
import tokenClient from './auth/TokenClient';

const Stack = createStackNavigator();
const App = () => {
  const [progress, setProgress] = useState(false);
  const [authenticated, setAuthenticated] = useState(false);

  useEffect(() => {
    const checkAuthStatus = async () => {
      const { authenticated } = await tokenClient.isAuthenticated();
  }, []);

  if (progress) {
    return (

  return (
      <Stack.Navigator initialRouteName={authenticated ? 'Profile' : 'Login'}>
          options={{ title: 'Login', headerLeft: null }}
          options={{ title: 'User Profile'}}

export default App;


import TokenClient from '@okta/okta-react-native'

export default tokenClient = new TokenClient({
  issuer: 'https://{yourOktaDomain}.com/oauth2/default',
  client_id: '{clientId}',
  scope: 'openid profile',
  redirect_uri: __DEV__ ?
    'exp://localhost:19000/+expo-auth-session' :


  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  "dependencies": {
    "@okta/okta-react-native": "^1.4.0",
    "@react-native-community/masked-view": "0.1.10",
    "@react-navigation/native": "^5.7.0",
    "@react-navigation/stack": "^5.2.12",
     "events": "^3.1.0",
    "expo": "~38.0.0",
    "expo-status-bar": "^1.0.2",
    "react": "~16.8.",
    "react-dom": "~16.11.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz",
    "react-native-gesture-handler": "~1.6.0",
    "react-native-reanimated": "~1.9.0",
    "react-native-safe-area-context": "~3.0.7",
    "react-native-screens": "~2.9.0",
    "react-native-web": "~0.11.7",
    "react-navigation": "^4.4.0"
  "devDependencies": {
    "@babel/core": "^7.8.6",
    "babel-preset-expo": "~8.1.0"
  "private": true


Hey @dhaivat2810,

The okta/react-native library requires linking native code which means it will not work with a Managed project. In order to use it, you would have to create a Bare project that would give you access to the native directories.

With that said, it might be a simpler solution to use the WebBrowser module and follow our Okta guide to set up authentication which you can read about here: Authentication - Expo Documentation


Thanks a lot @adamjnav for the information. I would check the webBrowser module.

My pleasure! I hope the docs and WebBrowser module were able to satisfy your use case. If you’ve run into any obstacles, please let me know.

Thanks @adamjnav. Actually i followed the docs but wasnt able to get the desired result. here is a link to my question How to send user credentials to useAuthRequest to get id and accessToken. I appreciate your help.

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.