Как получить доступ к переменной среды $ PORT в приложении React на Heroku - PullRequest
Новая
       3

Как получить доступ к переменной среды $ PORT в приложении React на Heroku

0 голосов
/ 29 мая 2020

Я использую сервер и сайт React в одном приложении Heroku. Мой сервер. js может нормально получить доступ к переменной среды $ PORT, но мое приложение React ничего от нее не получает (переменная пуста).

Мне нужно иметь доступ к среде PORT переменная, потому что это то, на чем работает мой сервер (Radiks). Из того, что я прочитал, переменные среды React разрешены только в том случае, если они имеют префикс REACT_APP_, поэтому в сценарии build в package.json я добавил новую переменную среды, которая принимает те же значения, что и $PORT. .

Мой файл Procfile: 

web: REACT_APP_PORT=$PORT node src/server.js

В package.json: 

...
"scripts": {
    "start": "node server.js",
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install && npm run build",
    "build": "REACT_APP_PORT=$PORT react-scripts build",
    "test": "react-scripts build",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
...

В моем приложении React (Приложение js): 

...
console.log("Connected to server:" + process.env.REACT_APP_PORT);
configure({ apiServer: process.env.REACT_APP_PORT || "http://localhost:1260", userSession})
...

(Это заканчивается только печатью Connected to server:)

Любая помощь будет принята с благодарностью, заранее спасибо!

1 Ответ

0 голосов
/ 29 мая 2020

Из того, что я прочитал, переменные среды React разрешены только в том случае, если они имеют префикс REACT_APP_, поэтому в сценарии build в package.json я добавил новую переменную среды, которая принимает те же значения, что и $PORT.

Это ново для меня. Я просмотрел его и также увидел отрывок, в котором это сказано, так что я верю вам на слово.

web: REACT_APP_PORT=$PORT node src/server.js

Кажется правдоподобным.

"build": "REACT_APP_PORT=$PORT react-scripts build",

Здесь вы создаете свои файлы html, js, css. Порт никогда не используется. Значение $PORT Heroku - динамическое c. Время от времени он меняется. Поэтому, когда вы создаете свои файлы stati c, он по-прежнему ссылается на переменную вместо жестко заданного значения.

configure({ apiServer: process.env.REACT_APP_PORT || "http://localhost:1260", userSession}

Должно быть: 

configure({ apiServer: "http://localhost:" + process.env.PORT || process.env.REACT_APP_PORT || 1260, userSession}

На всякий случай $PORT сработает кладу туда. Если он не существует, он выберет $REACT_APP_PORT.
В вашем предыдущем коде отсутствовал протокол и хост.

...