I am not sure how to place my Publishable key into my JavaScript code. When I place the publishable key's value directly into the JavaScript it works fine. When I try to use Environment variables It does not work.

config/initializers/stripe.rb

Rails.configuration.stripe = {
  :publishable_key => ENV['PUBLISHABLE_KEY'],
  :secret_key      => ENV['SECRET_KEY']
}

Stripe.api_key = Rails.configuration.stripe[:secret_key]

javascripts/charges.js.erb

Stripe.setPublishableKey(<%= Rails.configuration.stripe[:publishable_key] %>);

var stripeResponseHandler = function(status, response) {
  var $form = $('#payment-form');

  if (response.error) {

        $form.find('.payment-errors').text(response.error.message);
        $form.find('button').prop('disabled', false);
    } else {

        var token = response.id;

        $form.append($('<input type="hidden" name="stripeToken" />').val(token));

        $form.get(0).submit();
    }
};

jQuery(function($) {
    $('#payment-form').submit(function(e) {
      var $form = $(this);


      $form.find('button').prop('disabled', true);

      Stripe.createToken($form, stripeResponseHandler);

      return false;
    });
});

Although I don't think storing Stripe details in Javascript is wise, you can use a gem called gon to load variables into JS:

#app/controllers/your_controller.rb
gon.push({
  :user_id => 1,
  :user_role => "admin"
})

#app/assets/javascripts/your_javascript.js
gon.variable_name

You must add this to your layout file:

<head>
  <title>some title</title>
  <%= include_gon %>
  <!-- include your action js code -->
  ...

To load ENV variables even in development, I would then use a gem called Figaro which basically allows you load ENV variables in any state:

#app/config/application.yml
YOUR_ENV_VAR: 'information'

What you have looks like it should work. When you start your server are you entering in the proper keys?

PUBLISHABLE_KEY=pk_####_################ SECRET_KEY=sk_####_################# rails s

Not exactly a solution but I like the Railscast way (http://railscasts.com/episodes/288-billing-with-stripe) of setting the meta tag with an Environment variable and then using Javascript to call upon the value in the meta tag. The bit you want starts at about 4m10s

<%= tag :meta, :name => "stripe-key", :content => STRIPE_PUBLIC_KEY %>

Then the JS code is:

Stripe.setPublishableKey($('meta[name="stripe-key"]').attr('content'))

I'm not a fan of inserting environment variables into JS directly.

  • Thank you so much guys! – TonyTau Nov 13 '13 at 0:21
  • Why do you not like inserting environment variables in JS directly? I am still new, would be nice to know the reason for doing so. – TonyTau Nov 15 '13 at 23:45
  • One reason why it's better not to store keys etc. in the javascript source is that you have to recompile the asset when an ENV variable changes. If you store it in a meta tag you just need to restart the server. – Jeriko Dec 29 '15 at 13:57

Your Answer

 

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.