Le script javascript Braintree ne fonctionnait pas sur UserAgent ios10

Question

J'ai ajouté le code lame suivant dans mon fichier de vue pour l'ajout de cartes de crédit via Braintree.

<form id="form-add-card" class="popup-form" method="POST" action="{{ url('account/credit-card') }}"> 
    <div id="card-braintree"> 
     <div class="row"> 
      <div class="input-field col s12 mbm"> 
       <h6>Add a card</h6> 
      </div> 
      <div class="input-field col s12"> 
       <input placeholder="XXXX XXXX XXXX XXXX" id="card_no" maxlength="16" type="text" data-braintree-name="number" class="validate"> 
       <label for="card_no">Card Number</label> 
      </div> 
      <div class="input-field col s6"> 
       <input placeholder="MM/YY" id="valid_until" type="text" data-braintree-name="expiration_date" class="validate"> 
       <label for="valid_until">Valid Until</label> 
      </div> 
      <div class="col s12"> 
       <p class="small-notice light-text mtm">We accept both Visa and MasterCard payment and has a validated certification for PCI DSS Compliant Service Provider.</p> 
      </div> 
      <div class="input-field col s12"> 
       <button class="waves-effect waves-light btn load">Save Card</button> 
      </div> 
     </div> 
    </div> 
</form> 

puis mis en place le javascript pour Braintree comme suit:

<script src="https://js.braintreegateway.com/v2/braintree.js"></script> 
    <script> 
    $(document).ready(function() { 
     braintree.setup('{{ $client_token }}', 'custom', { id:'form-add-card', 
      onPaymentMethodReceived: function(data){ 
       console.log(data); 
      } 
     }); 
    }); 
    </script> 

Si je tente d'ajouter une carte de crédit via le web grâce à ce formulaire, j'aurais la méthode de paiement nonce et les détails de carte de crédit revenu. Toutefois, si je devais utiliser safari, l'ajout de carte de crédit n'est pas possible, il passera dans un mode de paiement vide nonce dans mon formulaire. Cela se produit dans les ios et safari de chrome. Android chrome et web chrome fonctionnent bien.

Pensées?

Modifier: Je rencontre toujours le même problème dans les périphériques Safari/ios malgré la mise à jour du script braintree.

Answer 1

apposent ce ici au cas où quelqu'un a le même problème,

Je me suis connecté mon serveur et remarqué que le formulaire est soumis deux fois, la première fois sans la valeur du paramètre payment_method_nonce, et le second est avec. D'une manière ou d'une autre dans les dispositifs Safari et ios, le formulaire ne soumet qu'une seule fois avec la valeur vide, donc ne permet pas l'ajout de la carte via braintree. Pour résoudre ce problème, au lieu de:

 <div class="input-field col s12"> 
      <button class="waves-effect waves-light btn load">Save Card</button> 
     </div> 

Je l'ai remplacé avec:

 <div class="input-field col s12"> 
      <input class="waves-effect waves-light btn load" type="submit" id="submit" value="Save Card"> 
     </div> 

et il fonctionne.