Estoy tratando de ocultar mi clave API para cuando me comprometo con github, y he buscado orientación en el foro, especialmente la siguiente publicación:
¿Cómo oculto la clave API en create-react-app?
Hice los cambios y reinicié el hilo. No estoy seguro de qué estoy haciendo mal - agregué un .env
archivo a la raíz de mi proyecto (lo nombré process.env
) y en el archivo que acabo de poner REACT_APP_API_KEY = 'my-secret-api-key'
.
Estoy pensando que podría ser la forma en que agrego la clave a mi fetch
en App.js, y probé varios formatos, incluso sin usar la plantilla literal, pero mi proyecto aún no se compilará.
Cualquier ayuda es muy apreciada.
performSearch = (query = 'germany') => {
fetch(`https://api.unsplash.com/search/photos?query=${query}&client_id=${REACT_APP_API_KEY}`)
.then(response => response.json())
.then(responseData => {
this.setState({
results: responseData.results,
loading: false
});
})
.catch(error => {
console.log('Error fetching and parsing data', error);
});
}
process.env
nombrarlo.env.local or .env.process
y mantenerlo fuera del directorio src