• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

1.2K
Vistas
How to configure fetch base url on deployment in docker for react app?

I have a React app with fetches from an API in it. I have a dockerfile that works.

How do I configure the base url for all fetches in production?

In the end I will deploy my React app on Azure App Services. I used the tag proxy in package.json, but this is only for development. An Example fetch looks like this: (before "/evaluations" the base url has to be placed)

    fetch(`/evaluations?onlyactiveones=true`, this.credentials)
        .then(response => response.text())
        .then(data => {
            this.setState({ evaluations: data });
            console.log(data);
        });
about 3 years ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

Looks like you are making fetch calls to relative url. So by default it will make call to your domain as base url. For example in this case, http://yourdomain.com/evluations, but most likely you want to make call to http://someotherdomain.com/api/evaluations. In order to do that you need to configure reverse proxy in your azure web site (or any other hosting server)

In azure website you can configure reverse proxy as suggested in the following link: https://ppolyzos.com/2015/10/26/reverse-proxy-functionality-in-azure-web-sites/

about 3 years ago · Santiago Trujillo Denunciar

0

I have now solved this problem. The things that I have done:

  1. Define a env variable for the base url, like: process.env.REACT_APP_API_PROXY
  2. Replace all fetches with this env variable. For the example above:

        fetch(`${process.env.REACT_APP_API_PROXY}/evaluations?onlyactiveones=true`, this.credentials)
        .then(response => response.text())
        .then(data => {
            this.setState({ evaluations: data });
            console.log(data);
        });
    
  3. Define the env variable as you like. The env variable has to be placed before building the react app, it can not be replaced at runtime.

about 3 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda