Discussion :

[wilson120]

Bonjour,je suis en train d'intégrer stripe dans mon forumulaire mais lorsque regarde la console sur Firefox, j'ai ce message d'erreurs:

SyntaxError: missing variable name

J'ai longtemos cherhcé (plusieurrs jours) la variable n'est pas déclaré, voici le début du code javascript, placé arpès le code html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
var stripe = Stripe('changer clé :-> pk_test_Z7WCo5oUXnhfCMMKeEh49Tds00TYAWyZ8h');
                var elements = stripe.elements();
                var card = elements.create('card');
                card.mount('#card-element');
 
                var promise = stripe.createToken(card);
                promise.then(function(result) {
                // result.token is the card token.
                });

Comment puis-je déclarer la variable stripe?
Merci beaucoup

[Loralina]

Bonjour,
L'erreur "missing variable name" n'indique pas qu'une variable n'est pas déclarée, mais plutôt qu'il manque son nom, comme si on écrivait var; ou var =0; ou bien qu'on utilisait un mot réservé, exemple : var super=123;.

Ici, les noms de variables paraissent tous indiqués, à voir si l'erreur ne se situe pas ailleurs...

[danielhagnoul]

let stripe = new Stripe('...'); si Stripe est une class ou une fonction constructeur.

[wilson120]

Loralina:
Merci de ta réponse; j'ai mis ça au début:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>            
            <script>
                var stripe= "Stripe";
                var.stripe; "Stripe";

et ajouter ça à la fin:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var $form = $('payment_form')
                $form.submit(function (e){
                    e.preventDefault()
                    $form.find('.styled').attr('disabled', true)
                    Stripe.card.createToken($form, function (status, response){
                        if (response.error) {
                            $form.prepend('<div class="ui negative message"><p>'+ response.error.message + '</p></div>');
 
                        }else {
                            var token = response.id
                            $form.append($('<input type="hidden" name="stripeToken">').val(token))
                            $form.get(0).submit()
 
                        }
                    })
                })
            </script>
            <script src="https://js.stripe.com/v3/"></script>

peut être l'erreur se situe là?
Merci

[wilson120]

danielhagnoul:
Merci de ta réponse, Stripe n'est pas une class et j'ai cherché ce qu'étais une fonction constructeur je ne pense pas que ça en soi une.
Du coup je ne peux pas l'ajouter.

[javatwister]

Bonjour,

cette ligne

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var.stripe; "Stripe";

va forcément générer un message d'erreur;
Commence par l'effacer...

[wilson120]

javatwister:Merci de ta réponse, lorsque je l'enlève, il m'affiche ce mesage d'erreur:
ReferenceError: Stripe is not defined
Pourtant Stripe est défini avec var?

[javatwister]

- vérifie la ligne correspondant au message;
- pense que Stripe et stripe sont 2 objets différents;

[wilson120]

javatwister:Merci en effet, stripe et Stipe sont deux fonction différente..Merci
Mais maintenant , il m'affiche ce message:
Undefined index: stripeToken

Pour ce:

Code PHP :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<?php
$stripe = $_POST['stripeToken'];
$email = $_POST['email'];
$Prénom = $_POST['Prénom'];
$adresse_de_livraison = $_POST['adresse_de_livraison'];
$Ville_et_code_postal = $_POST['Ville_et_code_postal'];
 
if (filter_var(!empty($token))) {
	$ch = curl_init();
	$data = [
		'source' => $token,
		'description' => $Prénom, $adresse_de_livraison, $Ville_et_code_postal,
		'email' => $email
	];
	curl_setopt_array($ch, [
		CURLOPT_URL => 'https://api.stripe.com/v1/customers',
		CURLOPT_RETURNTRANSFER => true,
		CURLOPT_USERPWD => 'sk_test_T5KIwwJ6gPkZ0Edsdv9vKLD0008rUS4M7C',
		CURLOPT_HTTPAUTH => CURLAUTH_BASIC,
		CURLOPT_POSTFIELDS => http_build_query($data)
	]);
	$response = json_decode(curl_exec($ch));
	curl_close($ch);
	var_dump($response);
	die();
 
}
?>

[Loralina]

Bonjour,
Par rapport à l'erreur "Stripe is not defined" :
"Stripe" est certainement défini dans le script externe "https://js.stripe.com/v3/".
La balise ciblant ce script doit donc être intégrée avant toute utilisation de cette fonction et non à la fin.
Apparemment le problème est réglé.

Pour l'erreur "Undefined index: stripeToken" :
Le formulaire a-t-il son attribut "method" défini sur POST ?
En effet, par défaut les données sont envoyées en GET.

Si le problème est ailleurs :
Il faudrait désactiver l'instruction de soumission comme ceci //$form.get(0).submit() afin d'aller vérifier, par exemple dans l'inspecteur, que le champ caché est bien ajouté dans le html de la page.

Niveau PHP, on peut aussi faire un var_dump($_GET,$_POST);.

[wilson120]

Bonjour Loralina,
Merci pour cette réponse complète, j'avais en effet réussis à retirer l'erreur( d'ou le temps d'attente).
Mais ce que tu dis est très inintéressant, j'avais déplacer "https://js.stripe.com/v3/" en bas afin qu'il ne me génère plus d'erreur, mais placé tout en haut ça fonctionne.OK
Le formulaire est en POST.D'accord, ou puis-je placer var_dump($_GET,$_POST); ?
Mon champs caché est dans cette partie de code javascript :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
                                    var token = response.id
                                    $form.append($('<input type="hidden" name="stripeToken">').val(token))
                                    $form.get(0).submit()

Dois je créer un input en html avec ce même champs caché?
Merci

[Loralina]

Bonsoir,
Vu que je ne fais pas de jQuery, j'ai fait un test pour vérifier que ces trois lignes de code étaient fonctionnelles et la réponse est oui :
index.html :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<form id="payment_form" method="POST" action="script.php">
	<input type="submit">
</form>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
var $form = $('#payment_form');
$form.submit(function(e) {
        e.preventDefault();
        var response = {id : 123};
 
        var token = response.id;
        $form.append($('<input type="hidden" name="stripeToken">').val(token));
        $form.get(0).submit();
});
</script>

script.php :

Code PHP :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<?php
var_dump($_POST);
?>

Dois je créer un input en html avec ce même champs caché?

Pas besoin.
Il faudrait par contre faire des affichages avec des console.log ou alert.
Je mettrais bien un alert("preventDefault"); juste avant ou après e.preventDefault(); pour être sûr qu'on rentre bien dans la fonction et donc que la soumission par défaut est annulée.
Je mettrais bien également un affichage avant cette ligne $form.get(0).submit();, par exemple : alert($form.get(0).innerHTML);.

D'accord, ou puis-je placer var_dump($_GET,$_POST); ?

En début de script php.

j'avais déplacer "https://js.stripe.com/v3/" en bas afin qu'il ne me génère plus d'erreur

Attention tout de même en corrigeant une erreur à faire quelque chose de sensé.
Par ailleurs, quand une erreur est signalée, il faut penser également à repérer le numéro de la ligne concernée indiqué par le navigateur.