Braintree托管字段集成

我想在我的注册表单上设置Braintree托管字段。但是这些领域之间存在巨大的差距，而且看起来并不正确。我尝试过使用braintree文档和指南，但它们非常含糊。Braintree托管字段集成

我会认为自己是一个中级网站开发人员，并会说我对php，html和css有很好的了解。我对JavaScript有一点理解，但可以稍微使用它，但不能像PHP那样理解。

请问您是否正确地指出我的付款页面正确？我需要的元素看起来像注册页面的前2个部分..

请注意表格尚未提交，我仍在工作的外观和感觉。但一旦braintree被集成，它只是捕获表单数据并将其提交给数据库。

这里是链接到窗体：下面http://www.mcr-qr-time.com/registration-form/register.html?plan=1

，看代码：（我已经编辑了API密钥）

<?php 
$plan = $_GET['plan']; 
if($plan == "1"){ 
$amount = "4.99"; 
} 
if($plan == "2"){ 
$amount = "14.99"; 
} 
if($plan == "3"){ 
$amount = "34.99"; 
} 
require_once 'braintree-php-3.9.0/lib/Braintree.php'; 

Braintree_Configuration::environment('production'); 
Braintree_Configuration::merchantId('#'); 
Braintree_Configuration::publicKey('#'); 
Braintree_Configuration::privateKey('#'); 
if(isset($_POST['submit'])){ 
    /* process transaction */ 
    $result = Braintree_Transaction::sale(array(
    'amount' => $amount, 
    'creditCard' => array(
    'number' => '(dont know what to do here)', 
    'expirationDate' => '(dont know what to do here)' 
    ) 
)); 

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(); 

?> 
<!DOCTYPE html> 
<html lang="en"> 

    <head> 

     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>Registration form</title> 

     <!-- CSS --> 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:400,100,300,500"> 
     <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="assets/font-awesome/css/font-awesome.min.css"> 
     <link rel="stylesheet" href="assets/css/form-elements.css"> 
     <link rel="stylesheet" href="assets/css/style.css"> 

     <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> 
     <!-- WARNING: Respond.js doesnt work if you view the page via file:// --> 
     <!--[if lt IE 9]> 
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> 
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> 
     <![endif]--> 

     <!-- Favicon and touch icons --> 
     <link rel="shortcut icon" href="//www.mcr-qr-time.com/img/member-1.png"> 
     <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png"> 
     <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png"> 
     <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png"> 
     <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png"> 

     <style> 
.img-circle { 
    border-radius: 50%; 
} 
</style> 

    </head> 

    <body> 
<div class="contain"> 
     <!-- Top menu --> 
     <nav class="navbar navbar-inverse navbar-no-bg" role="navigation"> 
      <div class="container"> 
       <div class="navbar-header"> 
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#top-navbar-1"> 
         <span class="sr-only">Toggle navigation</span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
        </button> 
        <a class="navbar-brand" href="../index.html"><h1 class="navbar-brand">MCR Qr Time</h1></a> 
       </div> 
       <!-- Collect the nav links, forms, and other content for toggling --> 
       <div class="collapse navbar-collapse" id="top-navbar-1"> 
        <ul class="nav navbar-nav navbar-right"> 
         <li> 

          <span class="li-text"> 
           Return to homepage: 
          </span> 
          <span class="li-social"> 
           <a href="//mcr-qr-time.com"><i class="fa fa-home"></i></a> 
          </span> 
         </li> 
        </ul> 
       </div> 
      </div> 
     </nav> 

     <!-- Top content --> 
     <div class="top-content"> 

      <div class="inner-bg"> 
       <div class="container"> 
        <div class="row"> 
        <br><br> 
         <div class="col-sm-8 col-sm-offset-2 text"> 

          <div class="description"> 
           <p> 

           </p> 
          </div> 
         </div> 
        </div> 
        <div class="row"> 
         <div class="col-sm-6 col-sm-offset-3 form-box"> 

          <form role="form" action="register.php(not set up yet)" method="post" class="registration-form" id="form"> 

           <fieldset> 
            <div class="form-top"> 
             <div class="form-top-left"> 
             <h1><strong>Registration Form</strong></h1><br> 
              <h3>Step 1/3</h3> 
              <p>Please fill out this form and once you have paid and confirmed your email you will be able to log in to your dashboard.</p> 
             </div> 
             <div class="form-top-right"> 
              <img class="img-circle" src="//www.mcr-qr-time.com/img/member-1.png" width="100" height="100"> 
             </div> 
            </div> 
            <div class="form-bottom"> 
             <div class="form-group"> 
              <label class="sr-only" for="form-first-name">First name</label> 
              <input type="text" name="form-first-name" placeholder="First name..." class="form-first-name form-control" id="fname"> 
             </div> 
             <div class="form-group"> 
              <label class="sr-only" for="form-last-name">Last name</label> 
              <input type="text" name="form-last-name" placeholder="Last name..." class="form-last-name form-control" id="sname"> 
             </div> 
             <div class="form-group"> 
              <label class="sr-only" for="form-company">Company</label> 
              <input type="text" name="form-company" placeholder="company" class="form-control" id="company"> 
             </div> 
             <button type="button" class="btn btn-next">Next</button> 
            </div> 
           </fieldset> 

           <fieldset> 
            <div class="form-top"> 
             <div class="form-top-left"> 
              <h3>Step 2/3</h3> 
              <p>Set up your account:</p> 
             </div> 
             <div class="form-top-right"> 
              <i class="fa fa-key"></i> 
             </div> 
            </div> 
            <div class="form-bottom"> 
             <div class="form-group"> 
              <label class="sr-only" for="form-email">Email</label> 
              <input type="text" name="form-email" placeholder="Email..." class="form-email form-control" id="form-email"> 
             </div> 
             <div class="form-group"> 
              <label class="sr-only" for="form-password">Password</label> 
              <input type="password" name="form-password" placeholder="Password..." class="form-password form-control" id="form-password"> 
             </div> 
             <div class="form-group"> 
              <label class="sr-only" for="form-repeat-password">Repeat password</label> 
              <input type="password" name="form-repeat-password" placeholder="Repeat password..." 
                 class="form-repeat-password form-control" id="form-repeat-password"> 
             </div> 
             <button type="button" class="btn btn-previous">Previous</button> 
             <button type="button" class="btn btn-next">Next</button> 
            </div> 
           </fieldset> 

           <fieldset> 
            <div class="form-top"> 

             <div class="form-top-left"> 
              <h3>Step 3/3</h3> 
              <p>Subscription payment setup:</p> 
             </div> 
             <div class="form-top-right"> 
              <i class="glyphicon glyphicon-credit-card"></i> 
             </div> 
            </div> 
            <div class="form-bottom"> 
               <div class="form-group"> 
             <label for="card-number-field">Card Number</label> 
                 <div id="card-number-field"></div> 
                 </div> 
                 <div class="form-group"> 
                 <label for="security-code-field">CVV</label> 
                 <div id="security-code-field"></div> 
                 </div> 
                 <div class="form-group"> 
                 <label for="expiration-date-field">Expiration Date</label> 
                 <div id="expiration-date-field"></div> 
                 </div> 
             <button type="button" class="btn btn-previous">Previous</button> 
             <button type="submit" class="btn">Sign me up!</button> 
            </div> 
           </fieldset> 

          </form> 
          <script src="https://code.jquery.com/jquery-2.1.1.js"></script> 
          <script src="https://js.braintreegateway.com/js/braintree-2.21.0.min.js"></script> 
    <script> 
     braintree.setup('<?php print $clientToken; ?>', 'custom', { 
    id: 'form', 
    hostedFields: { 
    number: { 
     selector: '#card-number-field', 
     placeholder: 'Card Number' 
    }, 
    cvv: { 
     selector: '#security-code-field', 
     placeholder: 'CVV' 
    }, 
    expirationDate: { 
     selector: '#expiration-date-field', 
     placeholder: 'MM/YYYY' 
    } 

    } 
}); 
    </script> 
         </div> 
        </div> 
       </div> 
      </div> 

     </div> 
</div> 

     <!-- Javascript --> 
     <script src="assets/js/jquery-1.11.1.min.js"></script> 
     <script src="assets/bootstrap/js/bootstrap.min.js"></script> 
     <script src="assets/js/jquery.backstretch.min.js"></script> 
     <script src="assets/js/retina-1.1.0.min.js"></script> 
     <script src="assets/js/scripts.js"></script> 

     <!--[if lt IE 10]> 
      <script src="assets/js/placeholder.js"></script> 
     <![endif]--> 

    </body> 

</html>

来源

2016-03-04 Shane Buckley

要到达最后一页，只需在字段中输入任何字母，以便您可以继续。 –

我也上传了braintree-php-3.9.0.tar.gz并将其解压缩到我的主目录中，还有其他什么我需要这样做？ –

您提供的链接与您发布的代码示例不符。具体的输入标签，而不是divs，并且不存在托管域代码。 – pblesi

形式使用时，托管领域或嵌入式，布伦特里地方隐藏现时输入，这可能是一些使用的人的，你只需要调用它在你的表单处理脚本象下面这样：

<?php 

require_once 'braintree-php-3.9.0/lib/Braintree.php'; 

Braintree_Configuration::environment('production'); 
Braintree_Configuration::merchantId('#'); 
Braintree_Configuration::publicKey('#'); 
Braintree_Configuration::privateKey('#'); 

$paymentMethodNonce = $_POST['payment_method_nonce']; 

$result = Braintree_Transaction::sale([ 
    'amount' => '10.00', 
    'paymentMethodNonce' => $paymentMethodNonce, 
    'options' => [ 
    'submitForSettlement' => True 
    ] 
]); 

?>

来源

2016-03-10 17:50:29

'$ paymentMethodToken'与$ paymentMethodNonce不同。 Braintree付款方式令牌是长寿命令牌，您可以使用它来引用保管库中存储的原始付款方式。付款方式随机数是用于标识付款方式的一次性使用标识符，直到它存储在保险箱中。 – pblesi

_{全面披露：我在布伦特里工作。如果您还有其他问题，请随时联系我们的support团队。}

Braintree使用Drop-in或Hosted Fields为您提供一个代表用户付款方式的随机数。这可以减轻您不必处理信用卡号码和到期日期信息以及随之而来的PCI负担。下面是使用随机数与Braintree_Transaction::sale的例子：

$result = Braintree_Transaction::sale([ 
    'amount' => '10.00', 
    'paymentMethodNonce' => nonceFromTheClient, 
    'options' => [ 
    'submitForSettlement' => True 
    ] 
]);

参观Braintree_Transaction::sale reference有关处理随机数的更多信息。

来源

2016-03-10 16:00:39 pblesi

Braintree托管字段集成

回答

相关问题