Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

114
Vistas
Establecer encabezados personalizados basados en diferentes envs

Quiero establecer encabezados personalizados de "id", "env" y "name" basados en envs en mi aplicación, todos tienen valores diferentes para diferentes envs. Tengo problemas para encontrar la forma más efectiva de hacer que funcione según la lógica de mi código.

Así es como defino el env:

 let host = "xxxxxxxx"; function getHost() { var env = getEnv(); env = env ? env : process.env.REACT_APP_ENV; switch (env) { case "stage": host = "xxxxxxxxxxxxxxxxxxx"; break; case "prod": host = "xxxxxxxxxxxxxxxxx"; break; case "local": host = "xxxxxxxxxxxxxx"; break; case "dev": default: host = "xxxxxxxxxxxxxxxxxxx"; break; } return host; } export const HOST = getHost();

Así es como se configuran todos los "encabezados" en mi aplicación, como puede ver, hasta ahora solo hay algunos valores:

 export function fetchRefresh(token) { return (dispatch) => { return fetch(API_ROOT + "/xxxxxxx/xxx/xxxxxx", { method: "POST", headers: { authorization: `Bearer ${token}`, "Content-Type": "application/json", Accept: "application/json", }, body: token, }) .then() // the rest } }

Pensé en hacer algo como esto y agregar ENCABEZADOS a los encabezados: {} en mi código, pero solo hará que los 3 encabezados personalizados que quiero agregar sean un solo objeto, todos deberían ser valores separados, no objeto:

 function getHeaders() { var env = getEnv(); env = env ? env : process.env.REACT_APP_ENV; switch (env) { case "stage": return { "ID": "xxxxxxxxxxxxxx", "ENV": "xxxxxxxxxxxx", "NAME": "xxxxxxxx", } case "prod": return { "ID": "xxxxxxxxxxxxxx", "ENV": "xxxxxxxxxxxx", "NAME": "xxxxxxxx", } case "local": return { "ID": "xxxxxxxxxxxxxx", "ENV": "xxxxxxxxxxxx", "NAME": "xxxxxxxx", } case "dev": return { "ID": "xxxxxxxxxxxxxx", "ENV": "xxxxxxxxxxxx", "NAME": "xxxxxxxx", } } } export const HEADERS = getHeaders();

¿Puedes ayudarme? Gracias

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

¿Te refieres a recuperar variables ambientales? Puede configurar el suyo propio trabajando con el paquete 'dotenv', que se usa con mucha frecuencia.

https://www.npmjs.com/package/dotenv

Puede configurar sus variables de entorno en un archivo .env de esta manera:

 MY_SECRET="new-secret-string" KEY=VALUE

que puede ser procesado por

 // This will read variables from .env file require('dotenv').config(); console.log(process.env.MY_SECRET)
about 4 years ago · Juan Pablo Isaza Denunciar

0

Querrás hacer lo siguiente. Primero, instale https://www.npmjs.com/package/env-cmd

A continuación, puede especificar el .env que se usará según su entorno. El siguiente código le permite especificar la configuración de forma declarativa en lugar de imperativamente (que es lo que intentó hacer). Aunque está agregando una dependencia más, está obteniendo una forma más resistente de hacer las cosas. Ahora, cuando diga process.env.REACT_APP_ID process.env.REACT_APP_ENV process.env.REACT_APP_NAME , entonces, dependiendo de env, los valores correctos se recogerán de forma transparente.

 "scripts": { "start": "env-cmd -f env_anotherenv.env react-scripts start", "start_vscode": "env-cmd -f env_vscode.env react-scripts start", "build_staging": "env-cmd -f env_staging.env react-scripts build --profile", "build_production": "env-cmd -f env_production.env react-scripts build --profile" }

Ejemplo de env_production.env será

 REACT_APP_ID = someid REACT_APP_ENV = someenv REACT_APP_NAME = somename
about 4 years ago · Juan Pablo Isaza 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 Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda