Search code examples
reactjsoauth-2.0react-routerokta

OKTA Redirect Not working - React routing


I have written an OKTA enabled React application (OIDC with PKCE). The application is working fine when I run it locally from node server (npm start).

The moment I put the dist files in Apache, the same code with exactly the same hosted path is not working.

Details below

The REDIRECT URI which is working with node server (npm start) is the below.

http://localhost:3000/tmbo/login/callback

Now when I host this in Apache (locally); the same redirect URI fail with Page Not found (there is some routing issues, which I can't figure out).

http://localhost:8080/tmbo/login/callback

Please note that the configuration on the OKTA side is proper. Need some guidance thanks.

References

https://developer.okta.com/docs/guides/implement-grant-type/authcodepkce/main/#next-steps


Solution

  • The below was done to fix the issue.

    1. In the httpd.conf the rewrite module was commented. It was un-commented (remove the # in front)

    LoadModule rewrite_module lib/httpd/modules/mod_rewrite.so

    1. In the httpd.conf, under the DirectoryRoot

      AllowOverride None

      was changed to

      AllowOverride All

    2. The .htaccess file was placed under the virtual directory, contents below.

    .htaccess file contents

    Options -MultiViews
    
    RewriteEngine On
    
    RewriteCond %{REQUEST_FILENAME} !-f
    
    RewriteRule ^ index.html [QSA,L]
    

    Note: You can use the below to find the DocumentRoot and ServerRoot.

    apachectl -t -D DUMP_RUN_CFG