Different SALEOR_API_URL on server and client side

[lionel-van-bemten]

Hi, I am new to Saleor. I am trying to run it behind an nginx proxy. For this I would like the react-storefront to use a different API url on the server side (something like http://localhost:8000/graphql/) and browser side (something like https://shop.mynet.com/graphql/). I tried:

docker run ... -e SALEOR_API_URL=http://localhost:8000/graphql/ -e NEXT_PUBLIC_API_URI=https://shop.mynet.com/graphql/ saleor-platform_react-storefront

But I get an error where I can see that the server is using the public url.

Server Error

Error: request to https://shop.mynet.com/graphql/ failed, reason: unable to verify the first certificate
This error happened while generating the page. Any console logs will be displayed in the terminal window.

It is not clear for me whether the SALEOR_API_URL and NEXT_PUBLIC_API_URI variables are supposed to do what I am looking for. Hence my question: is it possible to use a different url on the server and client side ?

Note I am in parallel looking into getting the certificate chain in the container but that is a separate issue.

[slamer59]

Hello,
Nextjs is an isomorphic framework which expose variable in server or client. I guess NEXT_PUBLIC_API_URI will override the SALEOR_API_URL I guess.

Also do you expose both URL in the Dockerfile with ARG/ENV ?
https://nextjs.org/docs/basic-features/environment-variables#exposing-environment-variables-to-the-browser

[lionel-van-bemten]

I didn't expose them in the Dockerfile but I defined them on the docker run command and they were exposed inside the container.

[typeofweb]

Why don't you use https://shop.mynet.com/graphql/ on both the server and client side? What's the reasoning behind this?

[lionel-van-bemten]

Because on the server side the public TLS CA is not available. This is an operational issue to be solved but ideally on the server side I'd like to be independent of this.

[typeofweb]

I think you should open an issue in vercel/next.js repo and ask. I'm not sure if it's possible to change the value of an env variable between rendering contexts (server/client) in Next.js but I guess it's not.

[lionel-van-bemten]

Ok clear thanks for clarification.