React.js:为什么使用它时从 .env 文件访问我的 API 密钥需要 REACT_APP 前缀? IE。 (process.env.REACT_APP_API_KEY)
<p>根据我的理解,.env 文件应该保存带有 REACT_APP 前缀的 API 密钥,后跟其名称,并且要使用该变量,我们必须省略 REACT_APP 前缀,但我注意到在某些情况下有不同的行为。</p>
<p>我在 .env 文件中设置环境变量,如下所示:<code>REACT_APP_YOUR_KEY_NAME=9999999999999</code>。并假设它是通过 process.env.YOUR_KEY_NAME 访问的。但我注意到在某些情况下(不是唯一的)需要前缀,否则键看起来是<code>未定义</code>。因此,它仅在我使用 <code>process.env.REACT_APP_YOUR_KEY_NAME</code> 时才有效。</p>
<pre class="brush:php;toolbar:false;">const FetchData= async () => {
try {
const cache = localStorage.getItem('apiData');
if (cache) {
return JSON.parse(cache);
} else {
const response = await fetch(`${url}?key=${process.env.REACT_APP_API_KEY}`);
const jsonData = await response.json();
localStorage.setItem('gameData', JSON.stringify(jsonData));
return jsonData;
}
} catch (error) {
console.error('Error occurred:', error);
return null;
}
};
export default FetchData;</pre></p>