How to proxy network calls for SPA (static site)?

#1

I have deploy a SPA with frontend and backend separate.

In dev mode, I am using devServer proxy.

On prod, if we use nginx, it can be done something like this

    location /api/* {
      proxy_pass http://YOUR_API_ENDPOINT;
    }

but how to do proxy network calls to backend in render?

(a side question: what if use render private service how will it work with above question)

#2

You could deploy an Nginx service on Render if that’s your preferred method. As you mentioned, one way you can do this is to deploy your API as a private service if you don’t need an external URL for it. You can then use the service’s internal host/port to connect to it from another Render service in your account.

#3

If you don’t want to create an nginx service, you can use a static site rewrite rule to proxy all /api/* requests to your backend. This requires you to use a web service. If using a private service is a requirement, you’ll need to setup something like nginx.

2 Likes
#4

I’ve used rewrites for this to map /graphql to my API server (also on render). It works well, but I can map to the external address only. In nginx, I am used to setting up a proxy to an internal network connection. Is there a way to setup proxies/rewrites that stick to an “internal” connection? Or, is this not an applicable question due to the nature of render.com hosting?

#5

I’ve been trying this with a private service running NodeJS/Hapi and render tells me the internal host:port, but when I enter http://host:port on the SPA rewrite, I get a 502. Tried searching, but not having much luck. If I open the shell on private service, I’ve verified NodeJS is running and responding at 0.0.0.0:port, so it should be accessible from the SPA.

#7

Hi @WesleyJohnson ,

This is not possible with private services, since we intentionally prevent them from being accessible publicly. If you want to rewrite to your service, you’ll need to create it as a public service and rewrite to its public address.

#8

Hi @david_frqncy ,

Render doesn’t currently support sticky sessions—an individual connection may be routed to any of your service instances.

#9

Thanks, Dan. I thought since the SPA was hosted on render as well that it could connect internally. I guess that doesn’t really add up, though, when the SPA is all client side. :slight_smile:

I’ll look at changing the backend to a Web Service.
Thanks again.

1 Like