Okta authentication with Expo

Expo SDK
1

Please provide the following:

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

Hi there, I’m very new to expo so I apologize in advanced for asking very dumb questions. I’m currently following the instructions within Authentication - Expo Documentation to implement Okta authentication within my react-native app. However, when I hit on the login button and it takes me to okta it ends up giving me this error: “400 Bad Request; The ‘redirect_uri’ parameter must be an absolute URI”

Here’s my code.

import React, { useEffect } from "react";
import { Button, StyleSheet, Text, View, Platform } from "react-native";
import * as WebBrowser from 'expo-web-browser';
import { makeRedirectUri, useAuthRequest, useAutoDiscovery } from 'expo-auth-session';

WebBrowser.maybeCompleteAuthSession();

const useProxy = Platform.select({ web: false, default: true });

const LoginScreen = ({ navigation }) => {

  const discovery = useAutoDiscovery('https://myoktainstance.okta.com/oauth2/default');

  const [request, response, promptAsync] = useAuthRequest(
    {
      clientId: 'myoktaclientid',
      scopes: ['openid', 'profile'],
      // For usage in managed apps using the proxy
      redirectUri: makeRedirectUri({
        // For usage in bare and standalone
        native: 'com.okta.myoktainstance:/callback',
        useProxy,
      }),
    },
    discovery
  );

  useEffect(() => {
    if (response?.type === 'success') {
      const { code } = response.params;
      }
  }, [response]);

  return (
    <View style={styles.container}>
      <Text style={styles.text}>This is the log in page</Text>
      <Button
      disabled={!request}
      title="Login"
      onPress={() => {
        promptAsync({ useProxy });
        }}
    />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#2F3F48",
    alignItems: "center",
    justifyContent: "center",
  },
  text: {
    color: "#fff",
  },
});

export default LoginScreen;

I’m also confused as to what this means: if (response?.type === ‘success’) - I’m not sure what the “?” does?

Again, really dumb questions but I would really appreciate any guidance!!

Thank you all

2

I believe the ? is basically equivalent to:

if (response !== null && response.type === "success")

I am not very familiar with the authentication stuff in general and Okta in particular, but maybe it wants an https URL instead of a mobile app URL :man_shrugging:
Does using the proxy option make any difference?

3

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