Stripe Payment Gateway 问题 ruby​​ on rails (TypeError: window.media (...) is null)

Posted 2023-05-09

【中文标题】Stripe Payment Gateway 问题 ruby​​ on rails (TypeError: window.media (...) is null)

【英文标题】：Stripe Payment Gateway issue ruby on rails (TypeError: window. multimedia (...) is null)

【发布时间】：2017-12-29 14:41:48

【问题描述】：

在 firebug 控制台上遇到此错误 => (TypeError: window.matchMedia(...) is null)

---

当我点击 paywithcard 按钮时，我会在 firebug 控制台上看到 (TypeError: window.media (...) is null)。

button.html.erb

<%= form_tag front_charges_path do %>
  <article>
    <% if flash[:error].present? %>
      <div id="error_explanation">
        <p><%= flash[:error] %></p>
      </div>
    <% end %>
    <label class="amount">
      <span>Amount: <%=@cart_totals%></span>
    </label>
  </article>
<script src="https://js.stripe.com/v3/"></script>

  <script src="https://checkout.stripe.com/checkout.js" class="stripe-button"
          data-key="<%= Stripe.api_key = "pk_test_******************" %>"
          data-description="A month's subscription"
          data-amount="<%=@cart_totals%>"
          data-locale="auto"></script>

<% end %>
<script type="text/javascript">

  var widthQuery = window.matchMedia("(min-width: 600px)");

</script>

Stripe.rb

Rails.configuration.stripe = 
  :publishable_key => ENV['pk_test_****************'],
  :secret_key      => ENV['sk_test_************']



Stripe.api_key = "sk_test_****************"

Charges_controller.rb

class Front::ChargesController < ApplicationController
layout 'product'
def new
end

def create  
  # Amount in cents
  @amount = 500

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

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

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



end

【问题讨论】：

您似乎在使用var widthQuery = window.matchMedia("(min-width: 600px)"); 这行代码时遇到了问题。删除它以进行检查。

仍然有同样的错误

尝试在创建你的 widthQuery 变量var window.matchMedia = 之前定义它

【参考方案1】：

这似乎是 FF 中的顽固错误。

检查matchMedia returns null when the FireBug is enabled 以了解解决方法