Deployed React App: Unable to issue redirect for OAuth 2.0 transaction

Get Help
,
1

Hi, I have a React app deployed on render.com. I have a /login URL which has a button that calls the Auth0 loginWithRedirect() function. After entering my details, I get the “Unable to issue redirect for OAuth 2.0 transaction” error. This error also happens when hosting the app locally on localhost:24423. The callback, origin and logout URL’s are set on the Application Details page in Auth0’s website. How can I fix this? Here is my code:

index.js

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <Auth0Provider domain="MY-DOMAIN.auth0.com" clientId="MY CLIENT ID" redirectUri={window.location.origin}>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </Auth0Provider>
);

App.js route setup

<div id="wrapper">
{!isAuthenticated ? (
  <>
  <div>
      <Routes>
          <Route path="/login" element={<Login/>} />
      </Routes>
  </div>
  
  <NavLink to="/login">Login</NavLink>
  </>
):(
  <>
  <Header />
  <div>
      <Routes>
          <Route path="/" element={<Landing/>} />
          <Route path="/login" element={<Login/>} />
          <Route path="/properties" element={<Properties/>} />
          <Route path="/properties/:id" element={<Property/>} />
      </Routes>
  </div>
  </>
)}
2

Hello @n1ghtrider welcome to the community!

Please see the following post to start:

I’d also be curious to know if our react sample functions properly in your environment?

Keep us posted!