heroku 带有React的Laravel环境变量：这是一个好的做法吗？

4dc9hkyq 于 2022-11-13 发布在 React

关注(0)|答案(1)|浏览(105)

我有一个React应用程序，它向Laravel后端发出API请求。
我的应用程序托管在Heroku上（我不知道它是否为我的问题改变了一些东西）。
我想为这些请求区分生产环境和本地环境。
在我的“welcome.blade.php”中，我添加了以下 meta标记：

<meta name="app_env" content="<?php echo env("APP_ENV") ?>" />

APP_ENV包含“生产”或“本地”。
在我的React应用程序中，我有以下脚本：

export let urlApi = (document.querySelector("[name=app_env]").content === "production" ) ?
"https://laravel-react.herokuapp.com/api"
:
"http://localhost/laravel_react/public/api"
;

我在每个需要它的组件中导入这个函数：

import { urlApi } from './../findUrlApi';
// .....
return fetch(`${urlApi}/products`,{
        headers: {
          "Content-Type": "application/json",
          "Authorization": "Bearer "+localStorage.getItem("token")
        }
      })

它工作正常。
但我的问题是，这是一个好的实践吗？（我是React的初学者）。

heroku

来源：https://stackoverflow.com/questions/49347091/laravel-environment-variable-with-react-is-this-a-good-practice

1条答案

按热度按时间

mctunoxg1#

我不认为这是一个好的做法。环境变量（如APP_ENV和API URL）不应该驻留在源代码中。
但是，您可以像往常一样将它们存储在Laravel .env文件中，但要在密钥前加上前缀MIX_。例如：MIX_API_URL=http://localhost。.env文件中的每个MIX_*变量都将向React应用程序公开。然后，您可以通过调用process.env.MIX_API_URL从React应用程序获取MIX_API_URL值。
更新的Laravel .env文件

...
MIX_APP_ENV=production (or local)   # Should be same as APP_ENV
MIX_API_LOCAL_URL=http://localhost/laravel_react/public/api
MIX_API_PRODUCTION_URL=https://laravel-react.herokuapp.com/api

在需要它的React组件中

const { MIX_APP_ENV, MIX_API_LOCAL_URL, MIX_API_PRODUCTION_URL } = process.env;
const apiUrl = MIX_APP_ENV === 'local'? MIX_API_LOCAL_URL: MIX_API_PRODUCTION_URL;

return fetch(apiUrl + '/products', { ... });

如果调用process.env.MIX_API_URL不起作用，并且您正在运行npm run watch，请尝试重新启动npm run watch并硬重新加载浏览器。
参考文献

Laravel文档-编译资源（混合）-环境变量

赞(0）回复(0）举报 2022-11-13

我来回答

heroku 带有React的Laravel环境变量：这是一个好的做法吗？

1条答案

相关问题

热门标签

最新问答