reactjs - process.env.REACT_APP_KEY 不适用于 api 调用

Question

到目前为止，在 2 个项目中，我在项目的根目录中创建了一个 .env 文件。我安装 npm install dotenv。我将（例如）REACT_APP_KEY='123456'放在 env 文件中。在我的app.js文件中，我添加require("dotenv").config() 了我console.log(process.env.REACT_APP_KEY)在控制台中进行 api 调用的组件，我得到 123456。到目前为止，它看起来像是在工作。但是当我将process.env.REACT_APP_KEYapi 调用放入时，我得到 404 错误？我错过了什么？如果我删除process.env.REACT_APP_KEY并添加 123456，我不会收到任何错误，并且调用正常。是因为我axios用来获取数据，我应该使用fetch吗？我似乎找不到任何可以帮助我的东西。我在下面包含了我的错误。谢谢你。

xhr.js:177 GET https://api.unsplash.com/search/photos?query=bali 401
dispatchXhrRequest @ xhr.js:177
xhrAdapter @ xhr.js:13
dispatchRequest @ dispatchRequest.js:52
Promise.then (async)
request @ Axios.js:61
Axios.<computed> @ Axios.js:76
wrap @ bind.js:9
getImages @ App.js:12
onSearchSubmit @ App.js:20
App @ App.js:22
renderWithHooks @ react-dom.development.js:14985
mountIndeterminateComponent @ react-dom.development.js:17811
beginWork @ react-dom.development.js:19049
beginWork$1 @ react-dom.development.js:23940
performUnitOfWork @ react-dom.development.js:22776
workLoopSync @ react-dom.development.js:22707
renderRootSync @ react-dom.development.js:22670
performSyncWorkOnRoot @ react-dom.development.js:22293
scheduleUpdateOnFiber @ react-dom.development.js:21881
updateContainer @ react-dom.development.js:25482
(anonymous) @ react-dom.development.js:26021
unbatchedUpdates @ react-dom.development.js:22431
legacyRenderSubtreeIntoContainer @ react-dom.development.js:26020
render @ react-dom.development.js:26103
(anonymous) @ index.js:7
./src/index.js @ index.js:18
__webpack_require__ @ bootstrap:856
fn @ bootstrap:150
1 @ reportWebVitals.js:14
__webpack_require__ @ bootstrap:856
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.chunk.js:1
createError.js:16 Uncaught (in promise) Error: Request failed with status code 401
    at createError (createError.js:16)
    at settle (settle.js:17)
    at XMLHttpRequest.handleLoad (xhr.js:62)

标签： reactjsrestaxiosenvironment-variables