SweetAlert

Résolu
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
- Modifié le 30 août 2018 à 13:52
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
- 31 août 2018 à 22:29
Bonjour,

J'ai un projet d'intégrer reCAPTCHA et je coince à intégrer sweetAlert en php.

Voici le script.
 <?php

$siteKey = "6Ld_OmcUAAAAAGQ0hrVFjZdZb9-BT9st5JKms86E";
$secretKey = "6Ld_OmcUAAAAAIML-hWUT-HX8Mk-QFLa4i1nS0oL";

require('recaptcha/autoload.php');

if(isset($_POST['submitpost'])) {

if(isset($_POST['g-recaptcha-response'])) {

$recaptcha = new \ReCaptcha\ReCaptcha($secretKey);

$resp = $recaptcha->verify($_POST['g-recaptcha-response']);

if ($resp->isSuccess()) {

var_dump('Captcha Valide');

} else {
 
echo "<script type='text/javascript'>alert(\"Captcha \ invalide\");</script>";

}

} else {

var_dump('Captcha non rempli');

}

}

?>

<html>

<head>

<title>reCAPTCHA demo: Simple page</title>

<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> <!-- sweetAlert-->
<script src="https://www.google.com/recaptcha/api.js" async defer></script> <!--reCAPTCHA-->

</head>

<body>

<form method="POST">

<div class="g-recaptcha" data-sitekey="<?php echo("$siteKey");?>"></div>

<br/>

<input type="submit" value="Valider" name="submitpost">

</form>

</body>

</html>


EDIT : Ajout des balises de code (jordane)

2 réponses

jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356
30 août 2018 à 13:53
Bonjour,

1 - Pour poster ton code sur le forum, à l'avenir, merci d'utiliser les balises de code
(explications disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

2 - Nous poster ton code sans nous expliquer en détail le souci rencontré ne nous sert à rien.
Pense à nous préciser si tu as d'éventuels messages d'erreurs et explique en quoi exactement ton souci consiste.
Sans cela..impossible pour nous de t'aider !
1
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
1
Modifié le 30 août 2018 à 15:42
Je ferais attention à l'avenir veuillez m'escuser.
Le problème que je rencontre c'est que j'aimerais remplacer l'alerte Pop-Up traditionnelle situé dans la partie <?php?>
 echo "<script type='text/javascript'>alert(\"Captcha \ invalide\");</script>";

Par celui de sweetAlert mais je n'y arrive pas en php (quelques exemples de Pop-Up sweetAlert ici : https://sweetalert2.github.io

en html d'un autre projet la solution était de mettre la source sweetAlert dans <head>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js">

suivi de
<script> //JavaScript
$(document).ready(function(){
 $("form").submit(function(){
   var response = grecaptcha.getResponse();
      if(response.length == 0){
          sweetAlert("Oops...", 'Veuillez cocher la case "Je ne suis pas un robot"', "error"); //Alerte Pop-up
    return false;
 } 
 });
});
</script>

<script type="text/javascript">
 var onloadCallback = function() {
 grecaptcha.render('html_element', {
 'sitekey' : '6Ld_OmcUAAAAAGQ0hrVFjZdZb9-BT9st5JKms86E' //SiteKey
 });
 };
</script>

Pour que l'alerte Pop-Up de sweetAlert fonctionne.
Le script complet du premier projet en html si ça peut aider.
<!DOCTYPE html>
<html>
<head>
 <title>Nom entrepise</title>
 <link rel="stylesheet" type="text/css" href="style/style.css" />
 
 <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> <!-- SweetAlert-->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 
<script> //JavaScript
$(document).ready(function(){
 $("form").submit(function(){
   var response = grecaptcha.getResponse();
      if(response.length == 0){
          sweetAlert("Oops...", 'Veuillez cocher la case "Je ne suis pas un robot"', "error"); //Alerte Pop-up
    return false;
 } 
 });
});
</script>

<script type="text/javascript">
 var onloadCallback = function() {
 grecaptcha.render('html_element', {
 'sitekey' : '6Ld_OmcUAAAAAGQ0hrVFjZdZb9-BT9st5JKms86E' //SiteKey
 });
 };
</script>
 
</head>

<body>

 <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" 
 async defer> <!--Google ReCaptcha-->
 </script>
 
<div align="center">

<h3>Application web</h3>

<img src="https://scontent-cdg2-1.xx.fbcdn.net/v/t1.0-9/12046572_1655106934769523_8786844962802643801_n.jpg?_nc_cat=1&oh=ec7ed622ad6a0fe65d0d70474fb62d41&oe=5C35DD63.jpg"
  alt="Google logo"
   title="Google"/> <!--Professional Logo-->
 

<form action="https://www.google.fr" method="post">
 <div id="html_element"></div>
 
<section class="buttons"> <!--Custom button-->
 <button class="spin circle">Valider</button>
</section>
 
</form> 
 
 
</body>
</html>
1
jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356
Modifié le 31 août 2018 à 10:27
Tu as essayé
echo "<script type='text/javascript'>sweetAlert('Oops...', 'Captcha invalide', 'error');</script>";


Bien entendu... en ayant chargé au préalable, dans ton fichier PHP, le script sweetalert.min.js
0
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
1
31 août 2018 à 08:12
J'ai essayé la méthode que tu proposes mais je ne sais pas comment le charger en php ? Tu aurais un exemple ?
0
jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356 > ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018

31 août 2018 à 08:43
ben comme dans l'exemple que tu donnes....
Il faut le charger dans le html.... (dans le head ou à la fin du <body> )
0
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
1
31 août 2018 à 10:23
Ah ^^', je pensais qu'il existait une autre manière de le faire, sinon non ça ne fonctionne pas.

Si je met ça :
echo "<script type='text/javascript'>sweetAlert("Oops...", 'Captcha invalide"', "error");</script>";

J'ai le message d'erreur "500 - Erreur interne au serveur."

Si je laisse par défaut :
echo "<script type='text/javascript'>sweetAlert(\"Captcha \Invalide\");</script>";

ou
echo "<script type='text/javascript'>swal(\"Captcha \Invalide\");</script>";

J'ai un saut d'image au lieu d'avoir le Pop-Up sans message d'erreur.
0
jordane45
Messages postés
35415
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
16 mai 2022
356 > ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018

31 août 2018 à 10:28
qu'as tu dans la console de ton navigateur ? pas de message d'erreur ?
As tu chargé le JS dans ta page ? Montre le code complet de ton fichier....
0