Проверка полосы с пользовательской интеграцией в Rails

Я пытаюсь реализовать Stripe Checkout, используя пользовательскую интеграцию в приложении rails - в моей форме проверки отображается зеленая галочка с сообщением, которую она подала, но платеж не обрабатывается, Простая интеграция работает хорошо, как и платежи по подписке на другие части моего сайта.

Как и простая интеграция, я пытаюсь поместить пользовательскую интеграцию script внутри form_tag - я выполнил руководство Rails Checkout, которое, к сожалению, написано только для простого интегрирования. Как и в руководстве, у меня есть контроллер зарядов, с новыми и создающими действия, чтобы показать форму и создать обвинения.

Контроллер платежей:

class ChargesController < ApplicationController

def new
end

def create
  # Amount in cents
  @amount = 500

  customer = Stripe::Customer.create(
    :email => params[:stripeEmail],
    :card  => params[:stripeToken]
  )

  charge = Stripe::Charge.create(
    :customer    => customer.id,
    :amount      => @amount,
    :description => 'Rails Stripe customer',
    :currency    => 'usd'
  )

rescue Stripe::CardError => e
  flash[:error] = e.message
  redirect_to charges_path
end

end

И в моем новом представлении форма настраивается следующим образом:

<%= form_tag charges_path do %>
  <script src="https://checkout.stripe.com/checkout.js"></script>

    <button id="customButton" class="btn btn-large btn-primary">Buy Now</button>

    <script>
      var handler = StripeCheckout.configure({
        key: '<%= ENV["STRIPE_PUBLIC_KEY"] %>',
        image: '/assets/my_logo.png',
        token: function(token, args) {
          // Use the token to create the charge with a server-side script.
        }
      });

      document.getElementById('customButton').addEventListener('click', function(e) {
        // Open Checkout with further options
        handler.open({
          name: 'My Company',
          description: 'Product ($60.00)',
          amount: 60*100,
          shippingAddress: true
        });
        e.preventDefault();
      });
    </script>
<% end %>

Я пробовал все, о чем я могу думать, но форма не будет отправлена для запуска действия create. Я вижу примечание, чтобы использовать серверную сторону script, но может ли кто-нибудь указать мне в правильном направлении на то, что мне может не хватать?

Любая помощь очень ценится!! Спасибо!

Ответы

Ответ 1

Вам нужно закончить функцию обратного вызова маркера.

Сначала передайте ответ от обработчика Stripe в качестве аргумента, а затем добавьте идентификатор и адрес маркера в качестве входов в форму перед отправкой: (untested)

token: function(response) {
  var tokenInput = $("<input type=hidden name=stripeToken />").val(response.id);
  var emailInput = $("<input type=hidden name=stripeEmail />").val(response.email);
  $("form").append(tokenInput).append(emailInput).submit();
}

Ответ 2

Вот рабочее решение. Добавьте идентификатор в свой тег формы. Добавьте скрытое поле stripeToken и stripeEmail в свой тег формы. Затем, когда мы получим токен из Stripe, мы будем использовать JavaScript для установки значений скрытых полей и отправки формы, ссылаясь на их идентификаторы:

<%= form_tag charges_path, id: 'chargeForm' do %>
  <script src="https://checkout.stripe.com/checkout.js"></script>
  <%= hidden_field_tag 'stripeToken' %>
  <%= hidden_field_tag 'stripeEmail' %>
  <button id="customButton" class="btn btn-large btn-primary">Buy Now</button>

  <script>
    var handler = StripeCheckout.configure({
      key: '<%= ENV["STRIPE_PUBLIC_KEY"] %>',
      image: '/assets/my_logo.png',
      token: function(token, args) { 
        document.getElementById("stripeToken").value = token.id;
        document.getElementById("stripeEmail").value = token.email;
        document.getElementById("chargeForm").submit();
      }
    });

    document.getElementById('customButton').addEventListener('click', function(e) { 
      // Open Checkout with further options
      handler.open({
        name: 'My Company',
        description: 'Product ($60.00)',
        amount: 60*100,
        shippingAddress: true
      });
      e.preventDefault();
    });
  </script>
<% end %>

Это можно решить многими способами, но в виду, что это проблема JavaScript, которая не имеет ничего общего с Rails или Stripe. Stripe просто дают нам токен, мы можем делать все, что захотим, с помощью JavaScript.

Ответ 3

Я думаю, что вы не хотите запрещать использование этого параметра, поскольку это предотвращает отправку вашей формы на сервер. Предоставляет ли она форму для действия create при выводе e.preventDefault();?

Ответ 4

С помощью "простой интеграции" вы по-прежнему можете изменить текст в синей кнопке по умолчанию с атрибутом метки данных (например, data-label = "Купить сейчас" ) с помощью параметры конфигурации. Но вы должны использовать "пользовательскую интеграцию" для полного стиля кнопки