条纹 iFrame 被阻止 - rails 和条纹

Question

我正在制作带有条纹和 rails 的结帐表格。我有一个 shop_controller 服务于 shop#index 中的产品列表。然后就到条纹形式所在的shop#show，用户就可以购买商品了。

现在当点击按钮进行购买时（使用假卡片条纹给你），所有发生的事情就是按钮不停地旋转，我在控制台中得到以下错误：

GET https://checkout.stripe.com/api/account/lookup?email=MYEMAILADDRESS&key=&locale=en-US 400 (Bad Request)

和

Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "http://localhost:3000" from accessing a frame with origin "https://checkout.stripe.com". The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "https". Protocols must match.

当我将我的电子邮件添加到表单时，我也收到此错误：

The specified value "MYEMAILADDRESS" is not a valid email address.

这是我的设置

routes.rb

resources :shop

shop_controller

class ShopController < ApplicationController

      def index
        @products = Product.all
      end

      def show
        @product = Product.find(params[:id])
      end

      def new
      end

      # the create happens in the show action
      def create
        @product = Product.find(params[:id])
        customer = Stripe::Customer.create(
          :email => params[:stripeEmail],
          :source  => params[:stripeToken]
        )

        charge = Stripe::Charge.create(
          :customer    => customer.id,
          :amount      => @product.price * 100,
          :description => @product.description,
          :currency    => 'usd'
        )

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

    end

show.html.erb（这里的表单是用来支付的）

<div class='shop-show'>
  <div class="container">
    <div class="row text-center">
      <div class="col-lg-12 col-xs-12">
        <h2><%= @product.name %></h2>
        <hr class="generic">
      </div>
    </div>

    <div class="row">
      <div class="col-md-6 col-md-offset-3">
        <div class="white_panel">
          <%= form_for @product, url: url_for(controller: 'shop', action: 'create' ) do %>
            <% if flash[:error].present? %>
              <div id="error_explanation">
                <p><%= flash[:error] %></p>
              </div>
            <% end %>
            <script src="http://checkout.stripe.com/checkout.js" class="stripe-button"
                data-key="<%= Rails.configuration.stripe[:publishable_key] %>"
                data-description="<%= @product.description %>"
                data-amount="<%= @product.price * 100 %>"
                data-locale="auto"
                data-shipping-address=true>
            </script>
          <% end %>
          <img class="img-responsive" width='400' height='250' src="<%= @product.pictures.first.image.url %>">
          <h2><%= @product.description %></h2>
        </div>
      </div>
    </div>
  </div>
</div>

有没有人设置过这种功能？紧随其后的是使用 stripe 提供的 link：https://stripe.com/docs/checkout/rails。对此设置的任何帮助将不胜感激。谢谢。

Answer 1

Checkout ctript 标签的 URL 需要通过 HTTPS 检索。尝试交换这个：

<script src="http://checkout.stripe.com/checkout.js"

为此：

<script src="https://checkout.stripe.com/checkout.js"

条纹 iFrame 被阻止 - rails 和条纹

Stripe iFrame being blocked - rails and stripe

ruby-on-rails

stripe-payments