SweetAlert [Résolu]

Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
-
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)
Afficher la suite 
A voir également:

2 réponses

Meilleure réponse
Messages postés
26490
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 octobre 2019
316
1
Merci
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 !

Dire « Merci » 1

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 188 internautes nous ont dit merci ce mois-ci

Commenter la réponse de jordane45
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
1
1
Merci
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>

Dire « Merci » 1

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 188 internautes nous ont dit merci ce mois-ci

jordane45
Messages postés
26490
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 octobre 2019
316 -
Il faut que ton echo se trouve apres le chargement du js.
jordane45
Messages postés
26490
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 octobre 2019
316 -
Essaye comme ça
<?php

//affichage des erreurs PHP
error_reporting(E_ALL);
ini_set('display_errors', TRUE);
ini_set('display_startup_errors', TRUE);

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

require_once('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']);
  } else {
    var_dump('Captcha non rempli');
  }
}

?>
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <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>
  </head>
  <body>
    <div class="form">
      <form method="POST">
        <div class="g-recaptcha" data-sitekey="<?php echo("$siteKey");?>"></div>
        <br/>
        <input type="submit" value="Valider" name="submitpost">
      </form>
    </div>
    <div class="messages">
      <?php
      if (!empty($res) && $resp->isSuccess()) {
          var_dump('Captcha Valide');
      } else {
        echo "<script type='text/javascript'>
                document.addEventListener('DOMContentLoaded', function() {
                  sweetAlert(\"Captcha \Invalide\");
                });
              </script>";
      }
      ?>
    </div>
  </body>
</html>
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
1 -
Ca fonctionne mille merci ! Mais il y a un souci c'est que lorsque je valide le test du captcha l'echo "Captcha Valide" n'apparait pas. A la place apparait pop "Captcha Invalide"
jordane45
Messages postés
26490
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
14 octobre 2019
316 -
Ca c'est un autre souci.... donc ouverture d'un nouveau sujet sur le forum dédié à ce problème.
De toutes façons... on ne sait rien de la class recaptcha que tu utilises...donc impossible de te renseigner.
A tout hasard... vérifie que le "secret" que tu utilises est le bon (celui que tu auras récupéré via ton compte google : https://www.google.com/recaptcha/admin#list)
Tu peux aussi faire un
print_r($_POST);
au début de ton script pour essayer de voir ce que retourne ton formulaire.
Pense aussi à regarder la doc officielle si besoin :
https://developers.google.com/recaptcha/intro
ckrisL
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Statut
Membre
Dernière intervention
31 août 2018
1 -
Entendu je te remercie pour ton aide j'ai beaucoup appris.
Commenter la réponse de ckrisL