如何在已部署的Heroku节点应用程序上获取基本url变量

Question

I tried the following but it doesn't work:

console.log(process.env.BASE_URL);   #output: undefined

Say my heroku app's host name is: https://RyanCameron-app.herokuapp.com

How should I go about getting that base_url on heroku?

I am looking for a solution to avoid to respectively uncomment/comment out the following lines:

const url = 'https://RyanCameron-app.herokuapp.com/projects/eovendo' //production 
//const url = 'http://localhost:3000'                                //development

It has become quite annoying ..

Answer 1

Backend

This checks if you are in production or development mode and assigns the according url depending on the mode.

const production  = 'https://examplePage.com';
const development = 'http://localhost:3000/';
const url = (process.env.NODE_ENV ? production : development);

Explanation: process.env.NODE_ENV will resolve to undefined if you are running on localhost production mode . And return production if you have deployed the app production mode .

Note : just because you have deployed the app doesn't necessarily mean you have changed the NODE_ENV

---

Frontend

Make use of the javascript window to extract the url

const url = window.location.origin;

---

Answer 2

You can use Base URL in JavaScript

// This article: // https://stackoverflow.com/questions/21246818/how-to-get-the-base-url-in-javascript

var base_url = window.location.origin; // "http://stackoverflow.com"

var host = window.location.host; // stackoverflow.com

var pathArray = window.location.pathname.split( '/' ); // ["", "questions", "21246818", "how-to-get-the-base-url-in-javascript"]

Answer 3

Set a config variable, HEROKU_APP_NAME or HOST - something obvious. You can access that in the backend but then you can also write it out into the DOM and have your front end access it from there.