Stripe::AuthenticationError No API key provided. Set your API key using "Stripe.api_key = <API-KEY>"

UPDATE: I set the publishable key directly inline like so: Stripe.setPublishableKey("pk_live_*****"); and it works!! The problem is it is not properly configuring with ENV['stripe_publishable_key'].

ORIGINAL POST:

I am using the koudoku gem for Stripe. Everything works fine locally, but when I push to heroku, I am getting the error:

Stripe::AuthenticationError (No API key provided. Set your API key using "Stripe.api_key = <API-KEY>".

Even though it sets the publishable key in development. Also, if I run heroku config, I see the keys there.

What is happening here? Why is it not setting the key??

application.yml

development:
  stripe_api_key: 'sk_test_***'
  stripe_publishable_key: 'pk_test_***'

production:
  stripe_api_key: 'sk_live_***'
  stripe_publishable_key: 'pk_live_***'

config/initializers/koudoku.rb

Koudoku.setup do |config|
  config.subscriptions_owned_by = :user
  config.stripe_publishable_key = ENV['stripe_publishable_key']
  config.stripe_secret_key = ENV['stripe_api_key']

  Stripe.api_version = '2015-01-11' #Making sure the API version used is compatible.
  # config.prorate = false # Default is true, set to false to disable prorating subscriptions
  # config.free_trial_length = 30

  # Specify layout you want to use for the subscription pages, default is application
  config.layout = 'application'

  # you can subscribe to additional webhooks here
  # we use stripe_event under the hood and you can subscribe using the 
  # stripe_event syntax on the config object: 
  # config.subscribe 'charge.failed', Koudoku::ChargeFailed

end

_card.html.erb

<div class="padding_page">
  <div class="wrapper_form_dark wrapper_form_sign_on">

<%# content_for :koudoku do %>

<%# end %>

<%= form_for @subscription, url: url, html: {id: 'payment-form', class: 'form-horizontal'} do |f| %>

  <fieldset>
<div class="form_section">
    <legend class="page_title">Update Payment Info</legend>



      <label class="label_standard">Card Number</label>
      <div class="controls">
        <input type="text" size="20" autocomplete="off" class="card-number input_standard"/>
      </div>
    </div>


    <div class="form_section">
      <label class="label_standard">Expiration (MM/YYYY)</label>
      <div class="controls">
        <input type="text" size="2" class="card-expiry-month input_mini"/>
        <span> / </span>
        <input type="text" size="4" class="card-expiry-year input_mini"/>
      </div>
    </div>

    <div class="form_section">
      <label class="label_standard">CVC</label>
      <div class="controls">
        <input type="text" size="4" autocomplete="off" class="card-cvc input_mini"/>
      </div>
    </div>

    <div class="alert alert-error payment-errors red"></div>
    <%= f.hidden_field :plan_id %>

  </fieldset>

  <div class="form_section">
    <div class="actions">
      <% if Koudoku.free_trial? %>
        <button type="submit" class="btn_primary submit-button">Save Billing Information</button>
      <% else %>
        <button type="submit" class="btn_primary_large submit-button">Update Card Information</button>
      <% end %>
      <%= link_to "Cancel", owner_subscriptions_path(@owner), class: 'btn red' %>
    </div>
  </div>

<% end %>
</div>
</div>
<script type="text/javascript">

  // All this code taken from Stripe's own examples at:
  // https://stripe.com/docs/tutorials/forms .

  function stripeResponseHandler(status, response) {

      if (response.error) {
          // show the errors on the form
          $(".payment-errors").text(response.error.message).show();
          $(".submit-button").removeAttr("disabled");
      } else {
          var form$ = $("#payment-form");
          // token contains id, last4, and card type
          // insert the token into the form so it gets submitted to the server
          form$.append("<input type='hidden' name='subscription[credit_card_token]' value='" + response['id'] + "'/>");
          form$.append("<input type='hidden' name='subscription[last_four]' value='" + response['last4'] + "'/>");
          form$.append("<input type='hidden' name='subscription[card_type]' value='" + response['card_type'] + "'/>");
          // and submit
          form$.get(0).submit();
      }
  }

  $(document).ready(function() {



    Stripe.setPublishableKey("<%= Koudoku.stripe_publishable_key %>");

    // By default, don't show errors.
    $(".payment-errors").hide()

    $("#payment-form").submit(function(event) {

      // disable the submit button to prevent repeated clicks
      $('.submit-button').attr("disabled", "disabled");

      Stripe.createToken({
          number: $('.card-number').val(),
          cvc: $('.card-cvc').val(),
          exp_month: $('.card-expiry-month').val(),
          exp_year: $('.card-expiry-year').val()
      }, stripeResponseHandler);

      // prevent the form from submitting with the default action
      return false;
    });
  });

</script>

UPDATE: I see the log of the post in stripe's logs, and it has a response of 200...

{
  "card": {
    "number": "************5458",
    "cvc": "***",
    "exp_month": "11",
    "exp_year": "2019"
  },
  "key": "pk_live_***",
  "payment_user_agent": "stripe.js/81eca10",
  "callback": "sjsonp1484600040115",
  "_method": "POST",
  "_accept_language": "en-US"
}

but the app is still throwing the same error of no key. Hopefully this helps?

Upvotes: 0