title: How do I handle external redirects to a client side react app?
body: <p>I'm building a web app that uses the True Layer open banking API. The app has a React front end using react router and an Express and Nodejs backend. Currently I am using the react <code>build</code> script to serve the static files:</p>
  
  <pre><code>const app = express();
  
  app.use(cors());
  app.use(express.json());
  
  app.use(express.static('../client/build'));
  app.get('*', (req, res) =&gt; {
      res.sendFile('index.html', {root: path.join(__dirname, '../client/build/')});
  });
  
  const PORT = process.env.PORT || 3001;
  app.listen(PORT, () =&gt; {
      console.log("Server listening on port: ", PORT);
  });
  
  // The API routes are imported below
  </code></pre>
  
  <p>This solution works well but when the user is redirected to True Layer's authentication page an OAuth code is generated and passed back to a route on the client as a url query. The issue is that when True Layer redirect the user back to my app the url is interpreted by the server and not the react router/browser so it returns <code>cannot GET /myAccounts</code>. I've looked into using server side rendering for the React client with a library like Next.js but I wanted to know if there was a way to do it without having to significantly refactor my code.</p>
  
  <p>My React Router setup:</p>
  
  <pre><code>class App extends Component {
      render() {
          return (
              &lt;Router&gt;
                  &lt;Route name="Landing" path="/" exact component={Login} /&gt;
                  &lt;Route name="Login" path="/login" exact component={Login} /&gt;
                  &lt;Route name="MyAccounts" path="/myAccounts" exact component={Home} /&gt;
              &lt;/Router&gt;
          );
      }
  }
  </code></pre>
  
  <p>The <code>/myAccounts</code> route renders the <code>Home</code> component/page where the <code>code</code> parameter is extracted: <code>qs.parse(props.location.search)['?code']</code>, and sent to my server to complete the OAuth process.</p>
  
  <p>Any help would be greatly appreciated.</p>