How to access the URL of another service in a Preview Environment?

1

I’d like to use Preview Environments to spin up a full application cluster for each PR.

I’d like my frontend service to know the host name of the backend service, so they can send API requests to the correct service.

I have a render.yaml like this (abbreviated):

previewsEnabled: true
services:
- name: frontend
  type: web
  env: static
  pullRequestPreviewsEnabled: true
  envVars: 
    - key: BACKEND_HOST
      fromService:
        name: backend
        type: web
        property: host
- name: backend
  type: web
  env: node
  pullRequestPreviewsEnabled: true

However, the BACKEND_HOST env variable shows up as my normal staging one, not the one with -pr-123 at the end.

Am I doing something wrong? Is this possible?

Thanks

2

Ah, in this example I see no reference to pullRequestPreviewsEnabled: true – maybe I need to remove that? If so, that should probably be mentioned explicitly in the docs for Preview Environments (and/or throw an error).

EDIT: That did not seem to work either…

3

I’m trying to work around this like so in my webpack config file (craco in this case):

if (process.env.IS_PULL_REQUEST) {
  process.env.BACKEND_URL = process.env.RENDER_EXTERNAL_URL.replace(
    "-frontend-",
    "-backend-"
  );
}

so that I can get this URL: https://staging-mycompany-backend-pr-123.onrender.com/
from this URL: https://staging-mycompany-frontend-pr-123.onrender.com/

EDIT: this approach is working for us.

4

You don’t need the pullRequestPreviewsEnabled: true to be set, previewsEnabled: true is all you need.

In our docs at YAML Specification | Render · Cloud Hosting for Developers we have an example which I think is what you need, you’re very close, you just need to add fromService: in your render.yaml

eg:

 envVars:
      - key: BACKEND_HOST
        fromService:
          name: backend
          type: web
          property: host

`

5

Yeah, sorry, that’s what we had – edited to reflect. The BACKEND_HOST env var did appear, but it pointed to the general staging environment, not the one specific to the PR (ie, the env var was missing -pr-123)

6

I wouldn’t expect you to to see -pr-123 in the env vars. From this page Render · The Easiest Cloud For All Your Apps, you should see the environment created for your PR listed - going into one of the PR’s will show the services that were created and I would expect that the BACKEND_HOST env var on your webservice be set to the set to the host name of your backend service that we created. If you open a support ticket and detail the service names we can dig further, support@render.com

7

Sorry, I’m not sure I understand. Isn’t the purpose of a Preview Environment to be built for each PR?

How am I supposed to connect my backend and frontend services to each other within a Preview Environment for a given PR?

8

It’s a point of confusion and one I had myself when I first found Render - between Pull Request Previews and Preview Environments. Our Pull request preview feature creates an instance of the service in question whereas Preview Environments enabled with previewsEnabled will create an entire environment for the PR which typically include web/db etc etc

9

Right, that’s what I thought. It sounds like exactly what I want. But how am I supposed to connect these preview services to each other? How does service A know the hostname of service B?

10

That’s exactly what this part of the render.yaml is doing:

envVars:
      - key: BACKEND_HOST
        fromService:
          name: backend
          type: web
          property: host

it’s setting a variable named BACKEND_HOST and it’s value is coming from the service named backend and it’s using the ‘host’ property that is available.

11

Right, but that’s not the backend for my PR – it’s the backend for the main branch.

12

Let’s move to DM, will message you.

13

Leaving an answer here for future.

Environment variables set in other services can be accessed in the render.yaml like so:

 envVars:
      - key: WEB_HOST
        fromService:
          name: the_other_service
          type: web
          envVarKey: RENDER_EXTERNAL_URL

This specifically access the RENDER_EXTERNAL_URL config var that we set on web services.

14

RENDER_EXTERNAL_URL no longer seems to be accepted - I can only seem to get ahold of the internal addresses via the vars listed in the docs.

I am trying to build a static site with the external hostname of a web service injected at build time - instead my browser ends up trying to connect via the internal hostnames.

The error prevents the blueprint from syncing:

Screenshot 2022-06-28 at 15.49.28
Screenshot 2022-06-28 at 15.49.281542×490 77.7 KB

15

Hey there, external host name should work fine, syntax should follow this pattern (as from example at https://render.com/docs/blueprint-spec)

  - key: SOMEKEY fromService: type: web name: some-service-name envVarKey: RENDER_EXTERNAL_URL

John B