2

私は、braintree.js を介して新しいユーザー (デバイス) と支払いトークンをすべて 1 つのフォームで作成するフォームを送信しようとしています。私のhtmlフォームは次のようになります。

<div class="container">
  <h2 class='registration'>Sign up</h2>
  <%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: {:class => 'col-sm-12'}) do |f| %>
    <%= devise_error_messages! %>

    <div class="form-horizontal">
      <%= f.label :email, class: "col-sm-3 control-label" %>
      <div class="col-sm-7">
        <%= f.email_field :email, class: "form-control" %>
      </div>
    </div><br /><br />

    <div class="form-horizontal">
      <%= f.label :full_name, class: "col-sm-3 control-label" %>
      <div class="col-sm-7">
        <%= f.text_field :full_name, class: "form-control",autofocus: true %>
      </div>
    </div><br /><br />

    <div class="form-horizontal">
      <%= f.label :password, class: "col-sm-3 control-label" %>
      <div class="col-sm-7">
        <%= f.password_field :password, autocomplete: "off", class: "form-control" %>
      </div>
    </div><br /><br />

    <div class="form-horizontal">
      <%= f.label :password_confirmation, class: "col-sm-3 control-label" %>
      <div class="col-sm-7">
        <%= f.password_field :password_confirmation, autocomplete: "off", class: "form-control" %>
      </div>
    </div><br /><br />

      <input data-braintree-name="number" value="4111111111111111">
      <input data-braintree-name="cvv" value="100">

      <input data-braintree-name="expiration_month" value="10">
      <input data-braintree-name="expiration_year" value="2020">

      <div id="braintree-container"></div>

      <script src="https://js.braintreegateway.com/v2/braintree.js"></script>
      <script>
        braintree.setup("MY BRAINTREE TOKEN",
                        "custom",
                          {
                          container: "braintree-container",
                          paymentMethodNonceInputField: "payment-method-nonce"}
        );
        var client = new braintree.api.Client({clientToken: <%= @client_token %>});
        client.tokenizeCard({number: "4111111111111111", expirationDate: "10/20"}, function (err, nonce) {

      </script>

    <div class="form-group">
      <div class="col-sm-offset-2 col-sm-6">
        <%= f.submit "Sign up", class: "btn btn-primary form-registration", id: "user-form-submit" %>
      </div>
    </div><br /><br />
  <% end %>
</div>

これを提出したときに起こるべきだと思うことは次のとおりです。Rails は新しいユーザーを作成します。次に、Braintree.js は CC 情報を使用してサービスにリクエストを送信し、値を含む params[:payment method_nonce] を返します。ただし、ユーザーが作成されますが、payment_method_nonce に関する情報は返されません。

1 つのページからこのすべての情報を追加しようとしているのはなぜですか? ユーザーがサインアップしたら、バックグラウンド ワーカーを作成してサブスクリプションを作成する予定です。

コントローラー (私のユーザーコントローラー)

class Users::RegistrationsController < Devise::RegistrationsController
  def new
    @client_token = Braintree::ClientToken.generate()
    super
  end


  def create
    super
  end

 def configure_sign_up_params
    devise_parameter_sanitizer.for(:sign_up) << [:full_name, :credit_card, :cvc,
    :expiration_month, :expiration_year, :token, :client_token]
  end

私のスキーマは次のようになります

 create_table "users", force: true do |t|
    t.string   "email",                  default: "", null: false
    t.string   "encrypted_password",     default: "", null: false
    t.datetime "created_at"
    t.datetime "updated_at"
    t.string   "full_name",                           null: false
    t.string   "token"
  end

追加情報

-Rails 4 -Ruby 2.0 -Braintree.js v2

4

1 に答える 1

2

私はブレインツリーで働いています。Braintree のカスタム統合は、BT サーバーへのクレジット カード情報の安全な転送を自動的に処理し、フォームに支払い方法の nonce を追加しながら、フォームの外観を制御できるように設計されています。braintree.api.Clientおよびカードのトークン化と組み合わせて使用​​されることはありません。これは、カード データのトークン化を自分で処理する場合、または送信前にフォームでより複雑なことを行う場合にのみ使用されます。

ノンスを取得していない理由については、braintree.setup(クライアントの作成時と同様に) への呼び出しでクライアント トークンを補間していますか? また、paymentMethodNonceInputFieldsetup 呼び出しに を指定しているため、これは BT JavaScript が nonce を送信するために使用する隠し入力の名前です。これはオプションのフィールドであるため、このパラメーターにアンダースコアではなくダッシュを使用する理由がない限り、削除することをお勧めします。これらの両方を行う場合、ノンスはコントローラー内で としてアクセスできる必要がありますparams[:payment_method_nonce]

最後に、支払い方法と同じフォームでユーザーを作成することはお勧めしません。ユーザーが間違ったフィールドにクレジット カード データを入力することが時折あります。

目標を達成するには、おそらく物事が起こる順序を逆にして、2 つの別々のフォームを用意する必要があります。最初に送信をクリックしてBraintree.jsにそのことをさせてから、それに渡すコールバックで結果を取得し、それをレールに送信して送信する別のフォームに入れてから、情報を使用してユーザー作成などを行いますそのフォームが送信されます。

さらに質問がある場合は、Braintree サポートにお問い合わせください。

于 2015-02-13T20:11:04.827 に答える