9

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 ..

Ryan Cameron
  • 371
  • 1
  • 4
  • 14

3 Answers3

13

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;
Sebastian Nielsen
  • 3,835
  • 5
  • 27
  • 43
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"]
Marat Badykov
  • 824
  • 4
  • 8
  • 3
    "ReferenceError: window is not defined". Unfortunately the solution does not work backend - I know I didn't specify whether it should work back- or frontend but I was actually looking for a backend way. Anyway upvoted for an answer that works for frontend. – Ryan Cameron Sep 01 '18 at 19:20
0

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.

John Beynon
  • 37,398
  • 8
  • 88
  • 97
  • The config variable sounds like I would have to uncomment/comment whenever I deploy the app. And to write it out in the frontend just to send it to the backend sounds like a pain - basically Marat Badykov's solution. – Ryan Cameron Sep 02 '18 at 12:39