0

I've been tasked with transitioning a development CRA build to work in production. Currently we use an api proxy in development with a setupProxy.js file as such:

const BACKEND_URL = process.env.BACKEND_URL
const { createProxyMiddleware } = require('http-proxy-middleware')

module.exports = function setupProxy(app) {
  app.use(
    '/api',
    createProxyMiddleware({
      target: BACKEND_URL,
      changeOrigin: true,
    })
  )
}

This works as expected in development but this feature isn't meant for production, so I've changed all the API endpoints to make proper use of the backend url (basically going from axios.get(/api/endpoint) to something like axios.get(`${process.env.BACKEND_URL}/api/endpoint`)

From what I can tell now, the calls are pointed at the right place now (before it was erroring out the whole app), but I immediately get a 401/unauthorized error for every call and even my websockets as soon as I log into the app, no data being returned.

Is there a critical part of the transition to prod - and specifically the replacement of the api proxy - that I am missing? It seems like there some sort of token missing that is causing all my calls to fail but there was no such token as part of the setupProxy file? Any direction or help would be appreciated

heroesrule99
  • 43
  • 1
  • 6
  • This entirely depends on the authentication model of your API. Also, does it support CORS access, in particular pre-flight `OPTIONS` requests? – Phil Feb 07 '22 at 04:33
  • The only place we use cors on the back end is app.use(cors()) so I believe it is supported I checked the networking tab for both the production and dev environment and noticed that the development env (with the proxy) had a token/cookie being passed that prod is missing but I don't know where that is coming from – heroesrule99 Feb 07 '22 at 15:11

0 Answers0