Tengo una aplicación React con búsquedas de una API. Tengo un dockerfile
que funciona.
¿Cómo configuro la URL base para todas las recuperaciones en producción?
Al final, implementaré mi aplicación React en Azure App Services . Usé el proxy
de etiquetas en package.json
, pero esto es solo para desarrollo. Un ejemplo de recuperación se ve así: (antes de "/evaluaciones" se debe colocar la URL base)
fetch(`/evaluations?onlyactiveones=true`, this.credentials) .then(response => response.text()) .then(data => { this.setState({ evaluations: data }); console.log(data); });
Parece que está haciendo llamadas de búsqueda a una URL relativa. Entonces, de forma predeterminada, llamará a su dominio como URL base. Por ejemplo, en este caso, http://yourdomain.com/evluations , pero lo más probable es que desee llamar a http://someotherdomain.com/api/evalues . Para hacerlo, debe configurar el proxy inverso en su sitio web azul (o en cualquier otro servidor de alojamiento)
En el sitio web de Azure, puede configurar el proxy inverso como se sugiere en el siguiente enlace: https://ppolyzos.com/2015/10/26/reverse-proxy-functionity-in-azure-web-sites/
Ahora he resuelto este problema. Las cosas que he hecho:
Reemplace todas las búsquedas con esta variable env. Para el ejemplo anterior:
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); });
Defina la variable env como desee. La variable env debe colocarse antes de compilar la aplicación de reacción, no se puede reemplazar en tiempo de ejecución.