代码之家 › 专栏 › 技术社区 › Peter

如何修复最新版本中的braintree javascript错误“t.getVersion不是函数”

braintree-javascript braintree-sandbox braintree javascript

Peter · 技术社区 · 6 年前

我出错了 TypeError: t.getVersion is not a function ,我只搜索了我找到的关于使用braintree web升级版的解决方案 here .就我而言,我使用 3.60.0 ,但当我添加 braintree.dataCollector.create .

https://js.braintreegateway.com/web/3.60.0/js/client.min.js

https://js.braintreegateway.com/web/3.60.0/js/data-collector.min.js

https://js.braintreegateway.com/web/dropin/1.22.1/js/dropin.min.js

    var form = document.querySelector('#payment-form');
    var client_token = "<?php echo $clientToken;?>";

    braintree.dropin.create({
      authorization: client_token,
      container: '#dropin-container',
      paypal: {
        flow: 'vault'
      }
    }, function (createErr, instance) {
      if (createErr) {
        console.log('Create Error', createErr);
        return;
      }

          form.addEventListener('submit', function (event) {
            event.preventDefault();
            
              braintree.dataCollector.create({
                client: instance,
                paypal: true
              }, function (err, dataCollectorInstance) {
                if (err) {
                  return;
                }
                 document.querySelector('#device').value =  dataCollectorInstance.deviceData;
              });

            instance.requestPaymentMethod(function (err, payload) {
              if (err) {
                console.log('Request Payment Method Error', err);
                return;
              }

              // Add the nonce to the form and submit
              document.querySelector('#nonce').value = payload.nonce;
              form.submit();
            });
          });
      
    });

0 回复 | 直到 6 年前

phuzi 5 年前

我刚开始尝试实现这个简单的Drop-In示例,遇到了同样的问题!我知道你不久前发布了这个问题,但这可能会帮助其他遇到这个问题的人,就像我一样。

线索是 @Simon_Weaver's answer 回答这个问题 Braintree PayPal checkout component throwing âe.client.getVersion is not a functionâ 这两条小线。。。

事实证明,实例不是客户机对象。它是一个Dropin对象;-)它创建自己的客户机存储在_clientprivate property上。

我需要做的是braintree。客户创建(…)获取真正的客户端对象。

不幸的是@Simon_Weaver没有提供一个合适的例子,并且“被欺骗”。

本质上,你需要创建一个单独的 clientInstance 在创建 dataCollector 而不是 instance

var form = document.querySelector('#payment-form');
var client_token = "<?php echo $clientToken;?>";

braintree.client.create({
    authorization: client_token
}, function(err, clientInstance) { // this is the client instance we need when creating a `dataCollector`

    braintree.dataCollector.create({
        client: clientInstance, // `clientInstance` not dropIn `instance`
        paypal: true
    }, function (err, dataCollectorInstance) {
        if (err) {
          return;
        }
        document.querySelector('#device').value =  dataCollectorInstance.deviceData;
    });

    /* ... rest of the `braintree.dropin.create` 
       just without the above `braintree.dataCollector.create` stuff in the submit handler...
    */
          
    braintree.dropin.create({
        authorization: client_token,
        container: '#dropin-container',
        paypal: {
            flow: 'vault'
        }
    }, function (createErr, instance) {
        if (createErr) {
            console.log('Create Error', createErr);
            return;
        }
    
        form.addEventListener('submit', function (event) {
            event.preventDefault();
          
            instance.requestPaymentMethod(function (err, payload) {
                if (err) {
                  console.log('Request Payment Method Error', err);
                  return;
                }
    
                // Add the nonce to the form and submit
                document.querySelector('#nonce').value = payload.nonce;
                form.submit();
            });
        });
    });
});

我还提出了初始化 数据采集器 表外提交处理程序-无需全部完成。

***这还没有经过测试,但应该会让你朝着正确的方向前进***