Question

我是第一次在Braintree工作，并在第一步就遇到了问题。我无法访问dropin功能和其他功能.. 我需要帮助来解决它。

我按照此处给出的步骤进行了操作：https://developers.braintreepayments.com/javascript+php/start/overview

第一步是Javascript客户端！ - 我按照提到的方式，添加了脚本

 <script src="https://js.braintreegateway.com/v2/braintree.js"></script>

然后添加了HTML部分

<form id="checkout" method="post" action="/checkout">
  <div id="dropin"></div>
  <input type="submit" value="Pay $10">
</form>

最后我在脚本标签中添加了以下脚本。

braintree.setup("CLIENT_TOKEN_KEY", 'dropin', {
   container: 'checkout'
})

我查看了从我们的服务器获得的客户端令牌密钥。

下一步，我添加了上述配置

Braintree_Configuration::environment('sandbox');
Braintree_Configuration::merchantId('use_your_merchant_id'); //updated with our merchant id
Braintree_Configuration::publicKey('use_your_public_key'); // updated with our public key
Braintree_Configuration::privateKey('use_your_private_key'); //updated with our private key

然后添加

$clientToken = Braintree_ClientToken::generate(array(
   "customerId" => $aCustomerId 
));

现在，我遇到的问题 -

当我用我们的客户ID更新$ aCustomerId时，我得到了一个致命错误＆＃34; customer_id＆＃34;字段在Braintree_ClientToken中未定义。删除数组（＆＃34;客户＆＃34; =＆gt; $ aCustomerId）并获得客户端令牌..

该客户端令牌在brantree.setup('TOKEN_KEY','dropin',{container:'checkout'})中使用并获得

Error: Unable to find valid container. -braintree.js(line 18)

我在var braintree = Braintree.create("CLIENT_TOKEN_KEY");上面提到过brantree.setup('TOKEN_KEY','dropin',{container:'checkout'})当时我TypeError: braintree.setup is not a function

我试图在最近两天对其进行排序，但仍然没有像演示中所示那样获得dropin屏幕。

希望得到很好的帮助..

Answer 1

将所有脚本放在html / footer部分之后，这样可行：

<?php
require_once 'braintree-php-2.30.0/lib/Braintree.php';

Braintree_Configuration::environment('sandbox');
Braintree_Configuration::merchantId('-----------');
Braintree_Configuration::publicKey('-----------');
Braintree_Configuration::privateKey('-----------');
if(isset($_POST['submit'])){
    /* process transaction */
    $result = Braintree_Transaction::sale(array(
     'amount' => '234.00',
     'creditCard' => array(
     'number' => '30569309025904',
     'expirationDate' => '05/14'
    )
  ));

if ($result->success) {
  print_r("success!: " . $result->transaction->id);
  } else if ($result->transaction) {
    print_r("Error processing transaction:");
    print_r("\n  code: " . $result->transaction->processorResponseCode);
    print_r("\n  text: " . $result->transaction->processorResponseText);
    } else {
      print_r("Validation errors: \n");
      print_r($result->errors->deepAll());
    }
}

$clientToken = Braintree_ClientToken::generate();

?>

<html>
  <head>
  </head>
  <body>
    <div id="checkout" method="post" action="/checkout">
      <div id="dropin"></div>
      <input data-braintree-name="number" value="4111111111111111">
      <input data-braintree-name="expiration_date" value="10/20">
      <input type="submit" id="submit" value="Pay">
      <div id="paypal-button"></div>
    </div>  

  <!-- Scripts -->
  <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
  <script src="https://js.braintreegateway.com/v2/braintree.js"></script>
  <script>
    braintree.setup("<?php print $clientToken; ?>",  "dropin", { container:
    jQuery("#dropin") ,  form: jQuery("#checkout") , 

    paymentMethodNonceReceived: function (event, nonce) {
      // do something
      }
    });
  </script>

  </body>
</html>

Answer 2

我遇到了这个问题并通过将javascript放在页面末尾解决了这个问题。另一种方法是将其封装在文件准备测试中。

出现此问题是因为braintree代码在加载脚本后立即尝试查找容器。但是如果您的代码位于文档的头部，则容器将无法加载，因此无法找到容器，您将收到错误。

关于base64_encoding的评论不正确。如果在加载容器之后触发代码而不重新编码已编码的字符串，则它可以正常工作。

Answer 3

_{我在Braintree工作。如果您有更多问题，请随意reach out to our support team。}

如果JavaScript无法找到您提供的容器，则会抛出您看到的第一个错误Unable to find valid container.。 container的可接受值是ID字符串，DOM节点或jQuery对象。您的示例代码应该可以使用，但如果它没有，您可以尝试传递不同的格式，例如{container: $('#dropin')}。

一旦您确定要传入正确的容器，我们还建议您确保正确插入客户端令牌。如果您在页面上查看源代码，则客户端令牌应为base64编码的字符串。

Answer 4

您希望确保您的 <script src="https://js.braintreegateway.com/js/braintree-2.32.1.min.js"></script> 尽可能靠近页面底部。如果可能，就在您的标签上方。这使您的浏览器有时间加载 DOM，然后然后加载 Braintree SDK。

接下来您要通过将 container 属性传递给 setup() 方法来指定“容器”。像这样：

    let checkout;
    braintree.setup('CLIENT_TOKEN_KEY', 'dropin', {
        container: document.getElementById('dropin'),  // <- This line here.
        onReady: function (integration) {
            checkout = integration;
            console.log(checkout)
        }
    });

整合braintree导致问题

4 个答案: