SweetAlert [Résolu]

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

Votre réponse

15 réponses

Messages postés
23273
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2018
- 30 août 2018 à 13:53
0
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 !
Commenter la réponse de jordane45
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Dernière intervention
31 août 2018
- Modifié par ckrisL le 30/08/2018 à 15:42
0
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>
Messages postés
23273
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2018
- 31 août 2018 à 16:08
Il faut que ton echo se trouve apres le chargement du js.
Messages postés
23273
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2018
- 31 août 2018 à 16:41
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>
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Dernière intervention
31 août 2018
- 31 août 2018 à 21:13
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"
Messages postés
23273
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
18 novembre 2018
- 31 août 2018 à 21:36
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
Messages postés
8
Date d'inscription
jeudi 30 août 2018
Dernière intervention
31 août 2018
- 31 août 2018 à 22:29
Entendu je te remercie pour ton aide j'ai beaucoup appris.
Commenter la réponse de ckrisL

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.