Comment utiliser des variables d'environnement pour implémenter des fonctions dans les projets React ?

Question

J'essaie de sauvegarder ma clé API en tant que variable d'environnement mais je ne sais pas comment y accéder... J'ai installé dotenv en utilisant npm, créé le fichier dans le répertoire racine et y ai mis la clé. J'ai essayé d'y accéder dans le fichier js en utilisant process.env.API_KEY mais cela montre que la variable n'est pas définie.

J'ai essayé de mettre require('dotenv').config() en haut du fichier là où j'ai besoin de la clé, mais cela me donne une erreur...

ERROR in ./node_modules/dotenv/lib/main.js 2:13-28
Module not found: Error: Can't resolve 'path' in ...

Je pense que je l'ai peut-être mis dans le mauvais fichier ou qu'il me manque quelque chose

P粉014293738 · Answer

En résumé :

Pour lire la variable API_KEY dans votre couche React, vous devez exporter la variable REACT_APP_API_KEY avant de construire, puis dans n'importe quelle partie React, vous pouvez obtenir la valeur via :

process.env.REACT_APP_API_KEY

Voir le lien pour voir pourquoi le préfixe REACT_APP_ est nécessaire.

De plus, si votre token est un token à longue durée de vie ou non expirable, il ne doit pas être exposé au frontend (React). Seuls les jetons expirables (Code d'authentification oauth2 autorisation ) doivent être exposés à la couche frontend.