Create-react-app: Proxy works with 'npm start' but not with the build version

[aaronplanell]

Hi!

I have made a _Data Fetching_ to a GraphQL server using the new "proxy" configuration of create-react-app 0.3.0 and... It works perfectly! Except in the build version :/

What I mean is, if I execute npm start the browser opens a tab with all the data. That's OK.

But, if I run:

$ npm run build
$ npm install -g pushstate-server
$ pushstate-server build

And I open the URL http://localhost:9000 I don't have data. And, in the console of the browser appears an error (_/graphql?query={crtEstacioNodes(orderBy..._ etc.). It seems that the build version is ignoring the configuration of the proxy and is making the call without the host/port.

Maybe (probably!) I'm doing something wrong, but,... What?

Thanks a lot!!!

[gaearon]

It is only intended for development. (I wanted to call it devProxy, cc @vjeux :wink: )

This feature was added for people who serve their frontend apps from / in production and serve the backend APIs from the same host. Like here: https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/.

In this scenario it's inconvenient to separate them in development because they're going to end up on the same host in production.

However there is no possible way CRA could proxy anything in production because it produces a static bundle. At this point it is assumed that if you use proxy, you host the app at the root of the same host. If it's not your situation, you need to actually embed the server URL into your production bundle, and request from it directly. You can use NODE_ENV to determine whether you are running in production, or been pass a custom environment variable. This is documented in the usage guide.

[aaronplanell]

Ohhhh! It's true. I'd read the article a week ago and I didn't remember this issue. The problem is that the GraphQL Server works in another host. Or in the same host, but in a different port. I use nodejs with express, for this reason I suppose that this solution Enable Cors will works. What do you thing?

[gaearon]

Yep, if you serve from another host or port in production, you need to enable CORS.

[aaronplanell]

Thanks a lot @gaearon !!! :+1: