条纹卡元素未在生产红宝石中显示

时间:2018-07-30 00:23:07

标签: ruby-on-rails ruby elastic-beanstalk stripe-payments stripe-connect

当我使用Elastic Beanstalk部署到生产中时,我正在使用条带化付款方式,这种方式在开发环境中效果很好,但是用户输入的信用卡卡形式却没有显示。

它看起来像这样 enter image description here

但是在生产中看起来像这样 enter image description here

stripe.rb

ConversationVC

这是Payment.html.erb的html

Rails.configuration.stripe = {
:stripe_publishable_key => ENV['STRIPE_PUBLISHABLE_KEY'],
:secret_key      => ENV['STRIPE_SECRET_KEY']
}
Stripe.api_key = Rails.configuration.stripe[:secret_key]

 

这是Payment.html.erb的js

 <div class="row">
  <div class="col-md-9">
   <div class="panel panel-default">
     <div class="panel-heading">Payment Method</div>
      <div class="panel-body">
       <div class="container">
        <%= form_tag("/add_card", method: "post", id: "add-card") do %>
            <label>
              <span>Name</span>
              <input name="cardholder-name" class="field" placeholder="Jane Doe" />
            </label>
            <label>
              <span>Card</span>
              <div id="card-element" class="field"></div>
            </label>
            <div class="outcome">
              <div class="error" role="alert"></div>
            </div>
            <% if current_user.stripe_id %>
              <button type="submit" class="btn btn-normal btn-block">Update Card</button>
            <% else %>
              <button type="submit" class="btn btn-normal btn-block">Add Card</button>
            <% end %>
        <% end %>
    </div>
  </div>
</div>

这是GemFile

 <script src="https://js.stripe.com/v3/"></script>
 <script>
 $(function() {
 var stripe = Stripe('<%= Rails.configuration.stripe[:publishable_key] %>');
var elements = stripe.elements();
var card = elements.create('card', {
  hidePostalCode: true,
  style: {
    base: {
      iconColor: '#F99A52',
      color: '#32315E',
      lineHeight: '48px',
      fontWeight: 400,
      fontFamily: '"Helvetica Neue", "Helvetica", sans-serif',
      fontSize: '15px',
      '::placeholder': {
        color: '#CFD7DF',
      }
    },
  }
});
card.mount('#card-element');
function setOutcome(result) {
  var errorElement = document.querySelector('.error');
  errorElement.classList.remove('visible');
  if (result.token) {
    var form = $('#add-card');
    form.append($('<input type="hidden" name="stripeToken">').val(result.token.id));
    form.get(0).submit();
  } else if (result.error) {
    errorElement.textContent = result.error.message;
    errorElement.classList.add('visible');
  }
}
card.on('change', function(event) {
  setOutcome(event);
});
$('#add-card').on('submit', function(e) {
  e.preventDefault();
  var extraDetails = {
    name: $('input[name=cardholder-name]').value
  };
  stripe.createToken(card, extraDetails).then(setOutcome);
});
});

这是secrets.yml

gem 'stripe', '~> 3.0.0'
gem 'rails-assets-card', source: 'https://rails- 
assets.org'
gem 'omniauth-stripe-connect', '~> 2.10.0'

这是devise.rb

STRIPE_PUBLISHABLE_KEY: publish key
secret_key_base: password key

这是users_controller.rb

  config.omniauth :stripe_connect, 'ca key', 'sk key', scope: 'read_write', stripe_landing: 'login'

这是console.log enter image description here

1 个答案:

答案 0 :(得分:0)

您的生产环境缺少必需的变量。我不熟悉EC2或EB,但是https://docs.aws.amazon.com/elasticbeanstalk/latest/dg/create_deploy_Ruby.container.html似乎有更多有关如何在您的环境中设置它们的信息。