title: Next.js redirect from an API route
body: <p>I am building a back-office app that requires users to sign in.
  I have 2 external APIs:</p>
  <ul>
  <li>API A : to manage user accounts and sessions</li>
  <li>API B : to perform CRUD actions on another database (unrelated to users database)</li>
  </ul>
  <p>The problem is that I don't want users to be able to perform calls to API B if their session is not valid. So I added some API endpoints in Next (under <code>pages/api</code>) that do the following actions:</p>
  <ol>
  <li>verifying the validity of the session against API A</li>
  <li>if session is valid: continue to step 3, if not: redirect to page <code>/login</code></li>
  <li>make the call to API B</li>
  </ol>
  <p>Everything works fine if the session is valid but it fails if the session is not valid.</p>
  <p>I have tried</p>
  <pre><code>res.redirect(307, '/login').end()
  </code></pre>
  <p>and</p>
  <pre><code>res.writeHead(307, { Location: '/login' }).end()
  </code></pre>
  <p>but it didn't work. It fails even by specifying the whole path (<code>http://localhost:3000/login</code>). What I don't understand is that I am successfully redirected to my <code>/login</code> page if I make the request directly from the browser (GET <code>http://localhost:3000/api/data</code>). It doesn't work when I make the request with Axios inside a React component.</p>
  <p>Any idea how I can fix this?</p>