Rails條紋來源付款只出現，如果我重新加載我的自定義表格

Question

我嘗試在Rails應用程序中使用自定義窗體來實現條紋。我有一個「計劃」頁面，允許用戶選擇他想要的計劃。它在get參數中重定向到帶有計劃名稱的收費自定義表單。

當我提交我得到以下錯誤的形式：

This customer has no attached payment source

不過，如果我重新加載表格並重新提交它，它工作得很好......

任何想法，是問題？

自定義形式：

<%= form_tag charges_path, method: 'post', id: 'payment-form' do %> <span class="payment-errors"></span> 

    <label class="amount"> 
     <span>Amount: <%= pretty_amount(@amount) %></span> 
    </label> 

    <div class="form-row"> 
    <label> 
     <span>Card Number</span> 
     <input type="text" size="20" data-stripe="number"/> 
    </label> </div> 

    <div class="form-row"> 
    <label> 
     <span>CVC</span> 
     <input type="text" size="4" data-stripe="cvc"/> 
    </label> </div> 

    <div class="form-row"> 
    <label> 
     <span>Expiration (MM/YYYY)</span> 
     <input type="text" size="2" data-stripe="exp-month"/> 
    </label> 
    <span>/</span> 
    <input type="text" size="4" data-stripe="exp-year"/> </div> 

    <input type="hidden" name="plan" value="<%= params['plan'] %>" /> 

    <button type="submit">Submit Payment</button> <% end %> 

資產/ Java腳本/ charges.coffee

jQuery ($) -> 
    $('#payment-form').submit (event) -> 
    $form = $(this) 
    # Disable the submit button to prevent repeated clicks 
    $form.find('button').prop 'disabled', true 
    Stripe.card.createToken $form, stripeResponseHandler 
    # Prevent the form from submitting with the default action 
    false 
    return 

stripeResponseHandler = (status, response) -> 
    $form = $('#payment-form') 
    if response.error 
    # Show the errors on the form 
    $form.find('.payment-errors').text response.error.message 
    $form.find('button').prop 'disabled', false 
    else 
    # response contains id and card, which contains additional card details 
    token = response.id 
    # Insert the token into the form so it gets submitted to the server 
    $form.append $('<input type="hidden" name="stripeToken" />').val(token) 
    # and submit 
    $form.get(0).submit() 
    return 

費用控制：

class ChargesController < ApplicationController 
    before_action :set_plan 
    before_action :amount_to_be_charged 
    before_action :set_description 
    before_action :authenticate_user! 

    def new 
    end 

    def create 
    if @plan == "plan1-yearly" 
     StripeTool.create_membership(email: current_user.email, 
            stripe_token: params[:stripeToken], 
            plan: @plan, 
            description: current_user.id) 
    elsif @plan == "plan1-monthly" 
     StripeTool.create_membership(email: current_user.email, 
            stripe_token: params[:stripeToken], 
            plan: @plan, 
            description: current_user.id) 
    end 

    redirect_to charge_thanks_path 

    rescue Stripe::CardError => e 
    flash[:alert] = e.message 
    redirect_to new_charge_path 
    end 

    def thanks 
    end 

    def plan 
    end 

    private 

    def set_plan 
     if params['plan'].present? == false 
     @plan = @plan 
     else 
     @plan = params['plan'] 
     end 
    end 

    def set_description 
     if @plan == "plan1-yearly" 
     @description = "Startup Yearly Plan" 
     elsif @plan == "plan1-monthly" 
     @description = "Startup Monthly Plan" 
     end 
    end 

    def amount_to_be_charged 
     if @plan == "plan1-yearly" 
     @amount = 22680 
     elsif @plan == "plan1-monthly" 
     @amount = 2350 
     end 
    end 
end 

在我的應用程序佈局：

<script type="text/javascript" src="https://js.stripe.com/v2/"></script> 
    <script type="text/javascript"> 
     Stripe.setPublishableKey('<%= ENV['STRIPE_PUBLISHABLE_KEY'] %>'); 
    </script> 

謝謝。

Answer 1

我想看看這個從這裏的條紋文檔：

https://stripe.com/docs/stripe.js/v2#card-createToken

我覺得缺少了什麼這裏是JS調用與StripeResponseHandler交互。我會嘗試更換此： Stripe.card.createToken $form, stripeResponseHandler

與此：

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

Answer 2

好了，所以我說劇本在我看來結束，現在它的工作原理。