How to pass API keys in environment variables to Ember CLI using process.env?

Question

How do I pass environment variables from bashrc to Ember CLI. I imagine a situation where you need stripe api keys or pusher api-keys and you have them in your environment v

Answer 1

The key is to define the ENV variables in config/environment.js and when you need to access them somewhere (i.e. adapter, controller, etc), you import config/environment.js first.

For an Ember CLI app, https://ember-cli.com/user-guide/#Environments documents this, for your reference.

Sample logic:

# app/controllers/foobar.js
import DS from 'ember-data';
import ENV from 'nameOfApp/config/environment';

export default Ember.Controller.extend({
  actions: {
    click: function() {
      console.log(ENV.SOME_ENVIRONMENT_KEY);
    }
  }
});

# config/environment.js
module.exports = function(environment) {
  ....

  if (environment === 'development') {
    ENV.SOME_ENVIRONMENT_KEY = 'asdf1234';
  }

  ...
};

Answer 2

I finally resolved this issue. I was faced with two options. Option 1 was to use XHR to fetch the api-keys from an end-point on the server. Option 2 is get the api-key directly from environment variables using Nodejs process.env. I prefer option 2 because it saves me from doing XHR request.

You can get option 2 by using this ember-cli-addOn which depends on Nodejs Dotenv project

• https://github.com/fivetanley/ember-cli-dotenv
• https://github.com/motdotla/dotenv

In my case I choose to do it without any addOn.

1. First add the api-key to your .bashrc if you are Ubuntu or the approapriate place for your own linux distro.

export API_KEY=NwPyhL5

2. Reload the .bashrc file, so your setting are picked up:

source ~/.bashrc

3. In Ember CLI add a property to the ENV object in config/environment.js. The default looks like this

module.exports = function(environment) {
  var ENV = {
     modulePrefix: 'rails-em-cli',
     environment: environment,
     baseURL: '/',
     locationType: 'auto',
     EmberENV: {

      }
   }

Now to that ENV object, we can add a new property myApiKey like this:

module.exports = function(environment) {
  var ENV = {
    modulePrefix: 'rails-em-cli',
    environment: environment,
    baseURL: '/',
    locationType: 'auto',
    myApikey: null,
    EmberENV: {

     }

   //assign a value to the myApiKey

     if (environment === 'development') {
        // ENV.APP.LOG_RESOLVER = true;

        ENV.myApiKey = process.env.API_KEY;
      }              

   }

Note that process.env.API_KEY is fetching the setting we added to .bashrc and assigning it to myApiKey. You will need to have Nodejs installed on your server for process.env to work.

Finally to access that variable in your controller you do

import config from '../config/environment';
import Ember from 'ember';

export default Ember.Controller.extend({

  yourKey: config.myApikey,

});

That's it.

Answer 3

You can also set the variables on the ENV.APP object: they will be carried by the application instance.

You can then reuse them inside initializer & so on.

This way, you won't have to import config/environment into application's code, which seems a little weird to me.

Answer 4

I want to make sure that my API keys are not checked in. As part of the build process, I copy a local config file to the config directory and load it into environment.js

In environment.js

try {
  var local = require('./local_environment');
  Object.keys(local.config).forEach(function(key) {
    ENV[key] = local.config[key];
  });
} catch(err) {
  console.log("config/local_environment.js not found");
}

In local_environment.js (not checked in, copied by build process)

exports.config = {
  SOME_API_KEY: 'key_here'
};