Jump to content
marcelocardoso

Google Recaptcha V3 - Param não resgata

Recommended Posts

olá colegas.

depois de tanto quebrar a cabeça com o RECAPTCHA do google, v3.
não estou conseguindo resgatar o ID do INPUT hidden que guarda o TOKEN!!!!

Segue código
HTML
 

<!DOCTYPE html>
<html lang="pt_BR">

    <head>
        <meta charset="utf-8">
        <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
        <meta content="ie=edge" http-equiv="X-UA-Compatible">
        <title>Google Recaptcha - v3</title>

        <!-- STYLES CSS -->
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/inputmask@3.3.11/css/inputmask.min.css">
        <!-- STYLES CSS -->

        <!-- SCRIPTS JS -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-form@4.2.2/dist/jquery.form.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/jquery.validate.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/localization/messages_pt_BR.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/additional-methods.min.js"></script>
        <!-- SCRIPTS JS -->

        <!-- SCRIPTS RECAPTCHA - SITE KEY -->
        <script src="https://www.google.com/recaptcha/api.js?render=6LesQewUAAAAAIWQKRKk19yob6G8hx3LEoYXybIC"></script>
        <!-- SCRIPTS RECAPTCHA - SITE KEY -->

        <style type="text/css">
            *:focus {
                outline: none !important;
            }

            html,
            body {
                height: 100%;
                width: 100%;
            }

            body {
                color: darkgrey;
                margin: 60px 0px;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }

            /* google captcha - hidden na tela */
            .grecaptcha-badge {
                display: none !important;
            }

            .valid-class {
                color: #006400;
                padding-left: 12px;
                padding-top: 3px;
                font-size: 15px;
                display: block;
            }

            .error-class {
                color: #e33d00;
                padding-left: 12px;
                padding-top: 3px;
                font-size: 15px;
                display: block;
            }

            .loading {
                position: fixed;
                left: 0px;
                top: 0px;
                margin: 0px;
                width: 100%;
                height: 100%;
                display: block;
                z-index: 999999;
                opacity: 0.92;
                -moz-opacity: 0.92;
                filter: alpha(opacity=98);
                background-color: #00224b;
                background-image: url("img/loading.gif");
                background-repeat: no-repeat;
                background-position: 50% 50%;
                text-align: center;
                overflow: hidden;
                font-weight: bold;
                font-size: 25px;
                color: white;
                padding-top: 25%;
            }

        </style>
    </head>

    <body>


        <!-- code | formulario -->
        <section class="container-fluid">
            <h1 class="text-center">RECAPTCHA</h1>
            <h4 class="text-center">GOOGLE v3</h4>
            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <form id="frm_form_contato" method="post" action="inc/google-form.asp">
                    <div class="form-group">
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_nome">Nome</label>
                            <input type="text" id="campo_nome" name="campo_nome" class="form-control" autocomplete="name" placeholder="Digite seu nome">
                        </div>
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_email">Email</label>
                            <input type="text" id="campo_email" name="campo_email" class="form-control" autocomplete="email" placeholder="Digite seu e-mail">
                        </div>
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_mensagem">Mensagem</label>
                            <textarea type="text" id="campo_mensagem" name="campo_mensagem" class="form-control" placeholder="Descreva sua mensagem"></textarea>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mt-4">
                            <div id="contato_retorno"></div>
                            <button id="btn-form" type="submit" class="btn btn-block btn-md btn-success">ENVIAR</button>
                        </div>
                    </div>

                    <input type="hidden" id="token">
                </form>
            </div>
            <div id="contato_carregando"></div>
        </section>
        <!-- code | formulario -->





        <!-- GOOGLE reCAPTCHA -->
        <script type="text/javascript">
            "use strict";

            //formulario de validacao
            $("#frm_form_contato").validate({
                errorClass: "error-class",
                validClass: "valid-class",

                onkeyup: function (element) {
                    this.element(element);
                },

                onfocusout: function (element) {
                    this.element(element);
                },

                rules: {
                    campo_nome: {
                        required: true,
                        minlength: 5,
                        maxlength: 50
                    },

                    campo_email: {
                        required: true,
                        minlength: 5,
                        email: true
                    },

                    campo_mensagem: {
                        required: true,
                        minlength: 5,
                        maxlength: 5000
                    }
                },

                submitHandler: function (form) {
                    grecaptcha.ready(function () {
                        grecaptcha.execute('6LesQewUAAAAAIWQKRKk19yob6G8hx3LEoYXybIC', {
                            action: 'homepage'
                        }).then(function (token) {
                            $("input#token").attr({
                                "value": "" + token + ""
                            });
                        });
                    });

                    // A) resgatar variaveis (uma por uma)
                    var form_url = $(this).attr("action");
                    var form_method = $(this).attr("method");
                    var form_token = $(this).find('input[name="token"]').val();
                    var form_nome = $(this).find('input[name="campo_nome"]').val();
                    var form_email = $(this).find('input[name="campo_email"]').val();
                    var form_telefone = $(this).find('input[name="campo_telefone"]').val();
                    var form_mensagem = $(this).find('input[name="campo_mensagem"]').val();

                    // B) resgatar variaveis (tudo de uma vez)
                    // var form_data = $("#frm_form_contato").serializeArray();

                    var form_data = {
                        'campo_nome': $("#campo_nome").val(),
                        'campo_email': $("#campo_email").val(),
                        'campo_mensagem': $("#campo_mensagem").val(),
                        'campo_token': $("#token").val(),
                    };


                    // ENVIAR FORM com POST
                    // $("form").submit(function (e) {
                    //     e.preventDefault();
                    //     var $form = $(this);
                    //     $.post($form.attr("action"), $form.serialize()).then(function () {});
                    // });


                    //ENVIAR FORM com AJAX
                    $.ajax({
                        url: $("#frm_form_contato").attr("action"),
                        type: $("#frm_form_contato").attr("method"),
                        data: JSON.stringify(form_data),
                        dataType: 'json',
                        contentType: 'application/json; utf-8',

                        //loading antes do sucesso e do envio
                        beforeSend: function () {
                            $("#btn-form").prop("disabled", false).text('Enviando ...').fadeIn();
                            $("#contato_carregando").html("<div class='loading'></div>").fadeIn(500);
                        },

                        //se houver sucesso
                        success: function (response) {
                            setTimeout(function () {
                                $("#contato_carregando").fadeOut(250);
                            }, 3950);

                            setTimeout(function () {
                                $("#contato_retorno").html("<div class='valida_a_certo'>" + response + "</div>").fadeIn(500);
                            }, 4000);

                            setTimeout(function () {
                                $("#contato_retorno").fadeOut(500);
                                $("#btn-form").prop("disabled", false).text('Enviado');
                                $(form)[0].reset();
                            }, 10000);
                        },

                        //se houver sucesso, finaliza
                        complete: function (response) {
                            $('body').fadeTo(4000, '1');
                        },

                        //se houver erro
                        error: function (response) {
                            setTimeout(function () {
                                $("#contato_retorno").html("<div class='valida_a_erro'>" + response + "</div>").fadeIn(500);
                            }, 4000);

                            setTimeout(function () {
                                $("#contato_retorno").fadeOut(500);
                                $(form)[0].reset();
                            }, 10000);
                        },
                    });
                    return false;
                }
            });

        </script>

        <!-- SCRIPTS RODAPE -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/inputmask@3.3.11/dist/jquery.inputmask.bundle.js"></script>
        <!-- SCRIPTS RODAPE -->

    </body>

</html>

BACKEND - ASP
não estou conseguindo repassar o TOKEN para cá, já tentei de várias formas... 
mas não consigo nem com REQUEST.QUERYSTRING, REQUEST e nem REQUEST.FORM.


 

<%
   Response.LCID = 1033 'USA LCID
IF Request.ServerVariables("SERVER_NAME") <> Request.ServerVariables("SERVER_NAME") THEN
   Response.Write "ACESSO RESTRITO!"
ELSE

   G_TOKEN      = Request.Form("campo_token")                                 'google token
   G_KEY_URL    = "https://www.google.com/recaptcha/api/siteverify?secret="   'google url
   G_KEY_SITE   = ""                  'google chave do site
   G_KEY_SECRET = ""                  'google chave secreta

   IF Request.ServerVariables("REQUEST_METHOD") = "POST" THEN
      SET objXML = Server.CreateObject("MSXML2.ServerXMLHTTP")
          objXML.Open "GET", ""& G_KEY_URL & G_KEY_SECRET &"&response=" & G_TOKEN & "", false
          objXML.Send
      
         IF InStr(objXML.ResponseText, "TRUE") THEN
            campo_nome      = Request.Form("campo_nome")
            campo_email     = Request.Form("campo_email")
            campo_mensagem  = Replace(Request.Form("campo_mensagem"), Chr(13), "<br>") 

                 cdoSERVER  = "mail.teste.com.br"
                 cdoORIGEM  = "teste@teste.com.br"
                 cdoPASS    = "senha"
                 cdoPORT    = 587
                 cdoTIMEOUT = 120
                 cdoUSING   = 2
                 cdoAUT     = 1
                 cdoSSL     = 0

                 cdoDE      =  campo_nome &" <"& campo_email &">"
                 cdoPARA    = "teste@teste.com.br"
                 cdoASSUNTO = "teste - contato"
                 cdoTEXT    = "Envio de mensagem usando CDOSYS"

            SET objCDOSYSmail = Server.CreateObject("cdo.message")
            SET objCDOSYScon  = Server.CreateObject("cdo.configuration")

                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserverport")          = cdoPORT
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusing")               = cdoUSING
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpauthenticate")        = cdoAUT
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout")   = cdoTIMEOUT
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpusessl")              = cdoSSL
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserver")              = cdoSERVER
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusername")            = cdoORIGEM
                objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendpassword")            = cdoPASS
                objCDOSYScon.Fields.Update

            SET objCDOSYSmail.Configuration    = objCDOSYScon
                objCDOSYSmail.From             = cdoORIGEM
                objCDOSYSmail.To               = cdoPARA
                objCDOSYSmail.Subject          = cdoASSUNTO
                objCDOSYSmail.TextBody         = cdoTEXT

                  ON ERROR RESUME NEXT
                     IF objCDOSYSmail.SEND = "" THEN 
                        Response.Write "Mensagem enviada com sucesso!"
                     ELSE
                        IF NOT ERR.NUMBER = "0" THEN
                              Response.Write "Não foi possível enviar a mensagem!"
                              Response.Write "OCORREU UM ERRO: " & Err.Number & " | " & Err.Description
                           Err.Clear()
                        END IF
                     END IF
                  ON ERROR GOTO 0

            SET objCDOSYSmail = Nothing 
            SET objCDOSYScon  = Nothing

         ELSE
            Response.Write "recaptcha errado!"
         END IF

      SET objXML = Nothing
   END IF

END IF
%>

Quem tiver tempo, e quiser dar uma olhada, só falta isso para finalizar o código, PASSAR o bendito parametro que não consigo do input para o ASP.
No demais, agradeço.
Até....
 

Share this post


Link to post
Share on other sites

Após 4 dias de quebra-cabeça, consegui finalizar o script....
Quem tá sofrendo, e precisar, segue exemplo completo em ASP, mas podendo ser adaptável para PHP ou qualquer outra linguagem.

HTML:
 

<!DOCTYPE html>
<html lang="pt_BR">

    <head>
        <meta charset="utf-8">
        <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
        <meta content="ie=edge" http-equiv="X-UA-Compatible">
        <title>Google Recaptcha - v3</title>

        <!-- STYLES CSS -->
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/inputmask@3.3.11/css/inputmask.min.css">
        <!-- STYLES CSS -->

        <!-- SCRIPTS JS -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-form@4.2.2/dist/jquery.form.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/jquery.validate.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/localization/messages_pt_BR.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/additional-methods.min.js"></script>
        <!-- SCRIPTS JS -->

        <!-- SCRIPTS RECAPTCHA - SITE KEY -->
        <script src="https://www.google.com/recaptcha/api.js?render=6LesKRKk19yob6G8hx3LEoYXybIC"></script>
        <!-- SCRIPTS RECAPTCHA - SITE KEY -->

        <style type="text/css">
            *:focus {
                outline: none !important;
            }

            html,
            body {
                height: 100%;
                width: 100%;
            }

            body {
                color: darkgrey;
                margin: 60px 0px;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }

            /* google captcha - hidden na tela */
            .grecaptcha-badge {
                /* display: none !important; */
                visibility: hidden !important;
            }

            /* google captcha - exibe somente na página contato */
            #frm-contato .grecaptcha-badge {
                visibility: visible !important;
            }

            .grecaptcha-badge {
                width: 0 !important;
            }

            .grecaptcha-badge.show {
                width: 256px !important;
            }

            .grecaptcha-badge {
                display: flex;
                justify-content: flex-end;
                overflow: hidden;
                width: 70px;
                height: 60px;
                margin: 0 auto;
                box-shadow: 0 0 4px #ddd;
                transition: linear 100ms width;
            }

            .grecaptcha-badge:hover {
                width: 256px;
            }

            .grecaptcha-badge-small {
                font-size: 9px;
                color: darkgray;
                text-align: center;
            }

            .valid-class {
                color: #006400;
                padding-left: 12px;
                padding-top: 3px;
                font-size: 15px;
                display: block;
            }

            .error-class {
                color: #e33d00;
                padding-left: 12px;
                padding-top: 3px;
                font-size: 15px;
                display: block;
            }

            .loading {
                position: fixed;
                left: 0px;
                top: 0px;
                margin: 0px;
                width: 100%;
                height: 100%;
                display: block;
                z-index: 999999;
                opacity: 0.92;
                -moz-opacity: 0.92;
                filter: alpha(opacity=98);
                background-color: #00224b;
                background-image: url("img/loading.gif");
                background-repeat: no-repeat;
                background-position: 50% 50%;
                text-align: center;
                overflow: hidden;
                font-weight: bold;
                font-size: 25px;
                color: white;
                padding-top: 25%;
            }

        </style>
    </head>

    <body>


        <!-- code | formulario -->
        <section id="frm-contato" class="container-fluid">
            <h1 class="text-center">RECAPTCHA</h1>
            <h4 class="text-center">GOOGLE v3</h4>
            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <form id="form_contato" method="post" action="inc/recaptcha.asp">
                    <div class="form-group">
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_nome">Nome</label>
                            <input type="text" id="campo_nome" name="campo_nome" class="form-control" autocomplete="name" placeholder="Digite seu nome">
                        </div>
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_email">Email</label>
                            <input type="text" id="campo_email" name="campo_email" class="form-control" autocomplete="email" placeholder="Digite seu e-mail">
                        </div>
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_mensagem">Mensagem</label>
                            <textarea type="text" id="campo_mensagem" name="campo_mensagem" class="form-control" placeholder="Descreva sua mensagem"></textarea>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mt-4">
                            <div id="contato_retorno"></div>
                            <button id="btn-form" type="submit" class="btn btn-block btn-md btn-success">ENVIAR</button>
                        </div>
                    </div>

                    <input type="hidden" id="g-recaptcha-response">
                    <input type="hidden" id="action" value="validate_captcha">

                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 grecaptcha-badge-small p-4">
                        Este site é protegido pelo reCAPTCHA e pelo Google
                        <a href="https://policies.google.com/privacy">Política de Privacidade</a> e
                        <a href="https://policies.google.com/terms">Termos do serviço</a>.
                    </div>

                </form>
            </div>
            <div id="contato_carregando"></div>
        </section>
        <!-- code | formulario -->



        <!-- GOOGLE reCAPTCHA -->
        <script type="text/javascript">
            "use strict";

            //formulario de validacao
            $("#form_contato").validate({
                errorClass: "error-class",
                validClass: "valid-class",

                onkeyup: function (element) {
                    this.element(element);
                },
                onfocusout: function (element) {
                    this.element(element);
                },

                rules: {
                    campo_nome: {
                        required: true,
                        minlength: 5,
                        maxlength: 50
                    },
                    campo_email: {
                        required: true,
                        minlength: 5,
                        email: true
                    },
                    campo_mensagem: {
                        required: true,
                        minlength: 5,
                        maxlength: 5000
                    }
                },

                submitHandler: function (form) {

                    // A) resgatar variaveis (SerializeArray)
                    // var formData = $("#frm_form_contato").serialize();
                    // var formData = $("#frm_form_contato").serializeArray();

                    // B) resgatar variaveis (FormData)
                    // var formData = {
                    // 'campo_nome': $("#campo_nome").val(),
                    // 'campo_email': $("#campo_email").val(),
                    // 'campo_mensagem': $("#campo_mensagem").val(),
                    // 'campo_token': $("#g-recaptcha-response").val(),
                    // };


                    //CAPTCHA + FORM POR POST
                    // grecaptcha.ready(function () {
                    //     grecaptcha.execute('6LeWQKRKk19yob6G8hx3LEoYXybIC', {
                    //         action: 'validate_captcha'
                    //     }).then(function (token) {
                    //         document.getElementById('g-recaptcha-response').value = token;

                    //         $.post($("#form_contato").attr("action"), {
                    //             campo_nome: $("#campo_nome").val(),
                    //             campo_email: $("#campo_email").val(),
                    //             campo_mensagem: $("#campo_mensagem").val(),
                    //             campo_token: $("#g-recaptcha-response").val(),
                    //         }).then(function (response) {
                    //             if (response = "success") {
                    //                 console.log('captcha ok');
                    //                 alert(token);
                    //             } else {
                    //                 console.log('recaptcha inválido! você é um ROBO ou SPAMMER!!!');
                    //             }
                    //         });

                    //     });
                    // });



                    var nome = $("#campo_nome").val();
                    var email = $("#campo_email").val();
                    var mensagem = $("#campo_mensagem").val();
                    var token = $("#g-recaptcha-response").val();


                    //CAPTCHA + FORM POR AJAX
                    grecaptcha.ready(function () {
                        grecaptcha.execute('6LesKk19yob6G8hx3LEoYXybIC', {
                            action: 'validate_captcha'
                        }).then(function (token) {
                            document.getElementById('g-recaptcha-response').value = token;

                            $.ajax({
                                url: $("#form_contato").attr("action"),
                                type: "get",
                                // contentType: 'application/json; utf-8',
                                // dataType: 'json',
                                // data: "nome=" + nome + "&email=" + email + "&msg=" + mensagem + "&token=" + token + "",
                                data: {
                                    nome: nome,
                                    email: email,
                                    mensagem: mensagem,
                                    token: token,
                                },

                                // antes de tudo
                                beforeSend: function () {
                                    $("#btn-form").removeClass('btn-success').addClass('btn-warning').text('Aguarde, enviando ...').fadeIn();
                                    $("#contato_carregando").html("<div class='loading'></div>").fadeIn();
                                },

                                // se houver sucesso
                                success: function (response) {
                                    $("#contato_carregando").delay(100).fadeOut();
                                    $("#contato_retorno").html("<div class='valida_a_certo'>" + response + "</div>").delay(2000).fadeIn();
                                    $("#contato_retorno").fadeOut();
                                    $("#btn-form").removeClass('btn-warning').addClass('btn-success').text('Mensagem Enviada!');
                                    $(form)[0].reset();
                                },

                                // se houver erro
                                error: function (response) {
                                    $("#contato_retorno").html("<div class='valida_a_erro'>" + response + "</div>").delay(2000).fadeIn();
                                    $("#contato_retorno").fadeOut();
                                    $(form)[0].reset();
                                },

                                // depois de tudo,
                                complete: function (response) {
                                    $("body").fadeTo(4000, '1');
                                },

                            });

                            return false;
                        });
                    });

                }
            });

        </script>



        <!-- SCRIPTS RODAPE -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/inputmask@3.3.11/dist/jquery.inputmask.bundle.js"></script>
        <!-- SCRIPTS RODAPE -->

    </body>

</html>


ASP:
 

<!--#include file="objetojson.asp"-->

<%
   Response.LCID = 1033 'USA LCID
IF Request.ServerVariables("SERVER_NAME") <> Request.ServerVariables("SERVER_NAME") THEN
   Response.Write "ACESSO RESTRITO!"
ELSE

      G_TOKEN      = Request("token")                                            'google token
      G_KEY_URL    = "https://www.google.com/recaptcha/api/siteverify?secret="   'google url
      G_KEY_SITE   = "suachave"                  'google chave do site
      G_KEY_SECRET = "chavesecreta"                  'google chave secreta

      ' response.write request("nome") & "<br>"
      ' response.write request("email") & "<br>"
      ' response.write request("mensagem") & "<br><br>"
      ' response.write request("token") & "<br><br>"

   IF Request.ServerVariables("REQUEST_METHOD") = "POST" OR Request.ServerVariables("REQUEST_METHOD") = "GET" THEN
      SET objXML = Server.CreateObject("MSXML2.ServerXMLHTTP")
          objXML.Open "GET", ""&G_KEY_URL&G_KEY_SECRET&"&response="&G_TOKEN&"", false
          objXML.Send
      
          SET objXMLjson    = new jsonClass
          SET objXMLjsonOut = objXMLjson.parse(objXML.responseText) 

               IF objXMLjson.value("success") THEN
                  recaptcha = "true"
               ELSE
                  recaptcha = "false"
               END IF

            ' response.write recaptcha & "<br>"
            ' response.write objXML.responseText & "<br>"

         IF recaptcha = "true" THEN
         
                campo_nome      = Request.Form("nome")
                campo_email     = Request.Form("email")
                campo_mensagem  = Replace(Request.Form("mensagem"), Chr(13), "<br>") 

                     cdoSERVER  = "mail.teste.com.br"
                     cdoORIGEM  = "teste@teste.com.br"
                     cdoPASS    = "teste%#@"
                     cdoPORT    = 587
                     cdoTIMEOUT = 120
                     cdoUSING   = 2
                     cdoAUT     = 1
                     cdoSSL     = 0

                     cdoDE      =  campo_nome &" <"& campo_email &">"
                     cdoPARA    = "teste@teste.com.br"
                     cdoASSUNTO = "teste - Contato"
                     cdoTEXT    = "Envio de mensagem usando CDOSYS"

              SET objCDOSYSmail = Server.CreateObject("cdo.message")
              SET objCDOSYScon  = Server.CreateObject("cdo.configuration")

                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserverport")          = cdoPORT
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusing")               = cdoUSING
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpauthenticate")        = cdoAUT
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout")   = cdoTIMEOUT
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpusessl")              = cdoSSL
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserver")              = cdoSERVER
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusername")            = cdoORIGEM
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendpassword")            = cdoPASS
                  objCDOSYScon.Fields.Update

              SET objCDOSYSmail.Configuration    = objCDOSYScon
                  objCDOSYSmail.From             = cdoORIGEM
                  objCDOSYSmail.To               = cdoPARA
                  objCDOSYSmail.Subject          = cdoASSUNTO
                  objCDOSYSmail.TextBody         = cdoTEXT

                     ON ERROR RESUME NEXT
                        IF NOT objCDOSYSmail.Send = "" THEN 
                           Response.Write "Mensagem enviada com sucesso!"
                        ELSE
                           IF NOT ERR.NUMBER = "0" THEN
                                 Response.Write "Não foi possível enviar a mensagem!"
                                 Response.Write "OCORREU UM ERRO: " & Err.Number & " | " & Err.Description
                              ERR.Clear()
                           END IF
                        END IF
                     ON ERROR GOTO 0

              SET objCDOSYSmail = Nothing 
              SET objCDOSYScon  = Nothing

         ELSE
            Response.Write "<b>Google Captcha - Erro!<b>"
         END IF

      SET objXML = Nothing
   END IF

END IF
%>

uma contribuição...
serve de exemplo e implementação...
correções, melhorias, fico satisfeito....

abraços....

 

Share this post


Link to post
Share on other sites
Em 30/04/2020 at 18:36, marcelocardoso disse:

Após 4 dias de quebra-cabeça, consegui finalizar o script....
Quem tá sofrendo, e precisar, segue exemplo completo em ASP, mas podendo ser adaptável para PHP ou qualquer outra linguagem.

HTML:
 


<!DOCTYPE html>
<html lang="pt_BR">

    <head>
        <meta charset="utf-8">
        <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
        <meta content="ie=edge" http-equiv="X-UA-Compatible">
        <title>Google Recaptcha - v3</title>

        <!-- STYLES CSS -->
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/inputmask@3.3.11/css/inputmask.min.css">
        <!-- STYLES CSS -->

        <!-- SCRIPTS JS -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-form@4.2.2/dist/jquery.form.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/jquery.validate.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/localization/messages_pt_BR.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/additional-methods.min.js"></script>
        <!-- SCRIPTS JS -->

        <!-- SCRIPTS RECAPTCHA - SITE KEY -->
        <script src="https://www.google.com/recaptcha/api.js?render=6LesKRKk19yob6G8hx3LEoYXybIC"></script>
        <!-- SCRIPTS RECAPTCHA - SITE KEY -->

        <style type="text/css">
            *:focus {
                outline: none !important;
            }

            html,
            body {
                height: 100%;
                width: 100%;
            }

            body {
                color: darkgrey;
                margin: 60px 0px;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }

            /* google captcha - hidden na tela */
            .grecaptcha-badge {
                /* display: none !important; */
                visibility: hidden !important;
            }

            /* google captcha - exibe somente na página contato */
            #frm-contato .grecaptcha-badge {
                visibility: visible !important;
            }

            .grecaptcha-badge {
                width: 0 !important;
            }

            .grecaptcha-badge.show {
                width: 256px !important;
            }

            .grecaptcha-badge {
                display: flex;
                justify-content: flex-end;
                overflow: hidden;
                width: 70px;
                height: 60px;
                margin: 0 auto;
                box-shadow: 0 0 4px #ddd;
                transition: linear 100ms width;
            }

            .grecaptcha-badge:hover {
                width: 256px;
            }

            .grecaptcha-badge-small {
                font-size: 9px;
                color: darkgray;
                text-align: center;
            }

            .valid-class {
                color: #006400;
                padding-left: 12px;
                padding-top: 3px;
                font-size: 15px;
                display: block;
            }

            .error-class {
                color: #e33d00;
                padding-left: 12px;
                padding-top: 3px;
                font-size: 15px;
                display: block;
            }

            .loading {
                position: fixed;
                left: 0px;
                top: 0px;
                margin: 0px;
                width: 100%;
                height: 100%;
                display: block;
                z-index: 999999;
                opacity: 0.92;
                -moz-opacity: 0.92;
                filter: alpha(opacity=98);
                background-color: #00224b;
                background-image: url("img/loading.gif");
                background-repeat: no-repeat;
                background-position: 50% 50%;
                text-align: center;
                overflow: hidden;
                font-weight: bold;
                font-size: 25px;
                color: white;
                padding-top: 25%;
            }

        </style>
    </head>

    <body>


        <!-- code | formulario -->
        <section id="frm-contato" class="container-fluid">
            <h1 class="text-center">RECAPTCHA</h1>
            <h4 class="text-center">GOOGLE v3</h4>
            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <form id="form_contato" method="post" action="inc/recaptcha.asp">
                    <div class="form-group">
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_nome">Nome</label>
                            <input type="text" id="campo_nome" name="campo_nome" class="form-control" autocomplete="name" placeholder="Digite seu nome">
                        </div>
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_email">Email</label>
                            <input type="text" id="campo_email" name="campo_email" class="form-control" autocomplete="email" placeholder="Digite seu e-mail">
                        </div>
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-xs-12 mb-2">
                            <label class="control-label" for="campo_mensagem">Mensagem</label>
                            <textarea type="text" id="campo_mensagem" name="campo_mensagem" class="form-control" placeholder="Descreva sua mensagem"></textarea>
                        </div>
                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 mt-4">
                            <div id="contato_retorno"></div>
                            <button id="btn-form" type="submit" class="btn btn-block btn-md btn-success">ENVIAR</button>
                        </div>
                    </div>

                    <input type="hidden" id="g-recaptcha-response">
                    <input type="hidden" id="action" value="validate_captcha">

                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 grecaptcha-badge-small p-4">
                        Este site é protegido pelo reCAPTCHA e pelo Google
                        <a href="https://policies.google.com/privacy">Política de Privacidade</a> e
                        <a href="https://policies.google.com/terms">Termos do serviço</a>.
                    </div>

                </form>
            </div>
            <div id="contato_carregando"></div>
        </section>
        <!-- code | formulario -->



        <!-- GOOGLE reCAPTCHA -->
        <script type="text/javascript">
            "use strict";

            //formulario de validacao
            $("#form_contato").validate({
                errorClass: "error-class",
                validClass: "valid-class",

                onkeyup: function (element) {
                    this.element(element);
                },
                onfocusout: function (element) {
                    this.element(element);
                },

                rules: {
                    campo_nome: {
                        required: true,
                        minlength: 5,
                        maxlength: 50
                    },
                    campo_email: {
                        required: true,
                        minlength: 5,
                        email: true
                    },
                    campo_mensagem: {
                        required: true,
                        minlength: 5,
                        maxlength: 5000
                    }
                },

                submitHandler: function (form) {

                    // A) resgatar variaveis (SerializeArray)
                    // var formData = $("#frm_form_contato").serialize();
                    // var formData = $("#frm_form_contato").serializeArray();

                    // B) resgatar variaveis (FormData)
                    // var formData = {
                    // 'campo_nome': $("#campo_nome").val(),
                    // 'campo_email': $("#campo_email").val(),
                    // 'campo_mensagem': $("#campo_mensagem").val(),
                    // 'campo_token': $("#g-recaptcha-response").val(),
                    // };


                    //CAPTCHA + FORM POR POST
                    // grecaptcha.ready(function () {
                    //     grecaptcha.execute('6LeWQKRKk19yob6G8hx3LEoYXybIC', {
                    //         action: 'validate_captcha'
                    //     }).then(function (token) {
                    //         document.getElementById('g-recaptcha-response').value = token;

                    //         $.post($("#form_contato").attr("action"), {
                    //             campo_nome: $("#campo_nome").val(),
                    //             campo_email: $("#campo_email").val(),
                    //             campo_mensagem: $("#campo_mensagem").val(),
                    //             campo_token: $("#g-recaptcha-response").val(),
                    //         }).then(function (response) {
                    //             if (response = "success") {
                    //                 console.log('captcha ok');
                    //                 alert(token);
                    //             } else {
                    //                 console.log('recaptcha inválido! você é um ROBO ou SPAMMER!!!');
                    //             }
                    //         });

                    //     });
                    // });



                    var nome = $("#campo_nome").val();
                    var email = $("#campo_email").val();
                    var mensagem = $("#campo_mensagem").val();
                    var token = $("#g-recaptcha-response").val();


                    //CAPTCHA + FORM POR AJAX
                    grecaptcha.ready(function () {
                        grecaptcha.execute('6LesKk19yob6G8hx3LEoYXybIC', {
                            action: 'validate_captcha'
                        }).then(function (token) {
                            document.getElementById('g-recaptcha-response').value = token;

                            $.ajax({
                                url: $("#form_contato").attr("action"),
                                type: "get",
                                // contentType: 'application/json; utf-8',
                                // dataType: 'json',
                                // data: "nome=" + nome + "&email=" + email + "&msg=" + mensagem + "&token=" + token + "",
                                data: {
                                    nome: nome,
                                    email: email,
                                    mensagem: mensagem,
                                    token: token,
                                },

                                // antes de tudo
                                beforeSend: function () {
                                    $("#btn-form").removeClass('btn-success').addClass('btn-warning').text('Aguarde, enviando ...').fadeIn();
                                    $("#contato_carregando").html("<div class='loading'></div>").fadeIn();
                                },

                                // se houver sucesso
                                success: function (response) {
                                    $("#contato_carregando").delay(100).fadeOut();
                                    $("#contato_retorno").html("<div class='valida_a_certo'>" + response + "</div>").delay(2000).fadeIn();
                                    $("#contato_retorno").fadeOut();
                                    $("#btn-form").removeClass('btn-warning').addClass('btn-success').text('Mensagem Enviada!');
                                    $(form)[0].reset();
                                },

                                // se houver erro
                                error: function (response) {
                                    $("#contato_retorno").html("<div class='valida_a_erro'>" + response + "</div>").delay(2000).fadeIn();
                                    $("#contato_retorno").fadeOut();
                                    $(form)[0].reset();
                                },

                                // depois de tudo,
                                complete: function (response) {
                                    $("body").fadeTo(4000, '1');
                                },

                            });

                            return false;
                        });
                    });

                }
            });

        </script>



        <!-- SCRIPTS RODAPE -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js"></script>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/inputmask@3.3.11/dist/jquery.inputmask.bundle.js"></script>
        <!-- SCRIPTS RODAPE -->

    </body>

</html>


ASP:
 


<!--#include file="objetojson.asp"-->

<%
   Response.LCID = 1033 'USA LCID
IF Request.ServerVariables("SERVER_NAME") <> Request.ServerVariables("SERVER_NAME") THEN
   Response.Write "ACESSO RESTRITO!"
ELSE

      G_TOKEN      = Request("token")                                            'google token
      G_KEY_URL    = "https://www.google.com/recaptcha/api/siteverify?secret="   'google url
      G_KEY_SITE   = "suachave"                  'google chave do site
      G_KEY_SECRET = "chavesecreta"                  'google chave secreta

      ' response.write request("nome") & "<br>"
      ' response.write request("email") & "<br>"
      ' response.write request("mensagem") & "<br><br>"
      ' response.write request("token") & "<br><br>"

   IF Request.ServerVariables("REQUEST_METHOD") = "POST" OR Request.ServerVariables("REQUEST_METHOD") = "GET" THEN
      SET objXML = Server.CreateObject("MSXML2.ServerXMLHTTP")
          objXML.Open "GET", ""&G_KEY_URL&G_KEY_SECRET&"&response="&G_TOKEN&"", false
          objXML.Send
      
          SET objXMLjson    = new jsonClass
          SET objXMLjsonOut = objXMLjson.parse(objXML.responseText) 

               IF objXMLjson.value("success") THEN
                  recaptcha = "true"
               ELSE
                  recaptcha = "false"
               END IF

            ' response.write recaptcha & "<br>"
            ' response.write objXML.responseText & "<br>"

         IF recaptcha = "true" THEN
         
                campo_nome      = Request.Form("nome")
                campo_email     = Request.Form("email")
                campo_mensagem  = Replace(Request.Form("mensagem"), Chr(13), "<br>") 

                     cdoSERVER  = "mail.teste.com.br"
                     cdoORIGEM  = "teste@teste.com.br"
                     cdoPASS    = "teste%#@"
                     cdoPORT    = 587
                     cdoTIMEOUT = 120
                     cdoUSING   = 2
                     cdoAUT     = 1
                     cdoSSL     = 0

                     cdoDE      =  campo_nome &" <"& campo_email &">"
                     cdoPARA    = "teste@teste.com.br"
                     cdoASSUNTO = "teste - Contato"
                     cdoTEXT    = "Envio de mensagem usando CDOSYS"

              SET objCDOSYSmail = Server.CreateObject("cdo.message")
              SET objCDOSYScon  = Server.CreateObject("cdo.configuration")

                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserverport")          = cdoPORT
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusing")               = cdoUSING
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpauthenticate")        = cdoAUT
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout")   = cdoTIMEOUT
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpusessl")              = cdoSSL
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/smtpserver")              = cdoSERVER
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendusername")            = cdoORIGEM
                  objCDOSYScon.Fields("http://schemas.microsoft.com/cdo/configuration/sendpassword")            = cdoPASS
                  objCDOSYScon.Fields.Update

              SET objCDOSYSmail.Configuration    = objCDOSYScon
                  objCDOSYSmail.From             = cdoORIGEM
                  objCDOSYSmail.To               = cdoPARA
                  objCDOSYSmail.Subject          = cdoASSUNTO
                  objCDOSYSmail.TextBody         = cdoTEXT

                     ON ERROR RESUME NEXT
                        IF NOT objCDOSYSmail.Send = "" THEN 
                           Response.Write "Mensagem enviada com sucesso!"
                        ELSE
                           IF NOT ERR.NUMBER = "0" THEN
                                 Response.Write "Não foi possível enviar a mensagem!"
                                 Response.Write "OCORREU UM ERRO: " & Err.Number & " | " & Err.Description
                              ERR.Clear()
                           END IF
                        END IF
                     ON ERROR GOTO 0

              SET objCDOSYSmail = Nothing 
              SET objCDOSYScon  = Nothing

         ELSE
            Response.Write "<b>Google Captcha - Erro!<b>"
         END IF

      SET objXML = Nothing
   END IF

END IF
%>

uma contribuição...
serve de exemplo e implementação...
correções, melhorias, fico satisfeito....

abraços....

 

 

Existe algum requisito? alguma lib (css, javascript) ou algo do gênero?

Share this post


Link to post
Share on other sites

não utilizei no wordpress, mas acredito que consiga sim....
o código acima, é feito em ASP, para backend e html puro para qualquer linguagem além de javascript, então, não utilizo wordpress, mas com certeza, consegue ....

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By gersonab
      Bom dia, tenho 2 tabelas editáveis em uma div, estas funcionam normalmente, o problema é que o loop não acontece , só carrega sobre 1 item, sendo que este eu posso ter mais itens.
       na página principal tenho:
      <div class="carregadados"></div> function fetch_data() { $.ajax({ url:"../lista/finan.php", method:"POST", success:function(data){ $('.carregadados').html(data); } }); } fetch_data(); a página a ser carregada esta assim:
      <?php session_start(); require_once('config.php'); $output = ''; $idc1=$_SESSION['idc']; $sql01 = "SELECT * FROM porcent WHERE idfcli='$idc1'"; $result = mysqli_query($con, $sql01); while($user41 = mysqli_fetch_array($result)){ // primeiro while onde seleciono os itens da pessoa podendo ter vários $output .= ' <div class="table-responsive mb-4 mt-4"> Aqui vem os dados da pessoa '; $id1= $user41["idproc"]; $sqladv = "SELECT * FROM poradv WHERE procav='$id1'"; $resulta = mysqli_query($con, $sqladv); $output .= ' <table class="table table-bordered table-hover table-striped" style="width:100%"> <thead> <tr> </tr> </thead> <tbody>'; if(mysqli_num_rows($resulta) > 0) { while($usera = mysqli_fetch_array($resulta)){ //segundo while onde tenho os dados de venda em uma tabela editavel $output .= ' <tr> </tr>'; } $output .= ' <tr> // insiro linhas caso precise </tr> '; } else { $output .= '<tr> // caso não tenha nada inserido, posso fazer por aqui </tr> '; } $output .= '</tbody> </table>'; $id2= $user41["idproc"]; $sql = "SELECT * FROM parcelas WHERE procid='$id2' ORDER BY datapar, idpar ASC"; $result = mysqli_query($con, $sql); $output .= ' <table class="table table-bordered table-hover table-striped" style="width:100%"> <thead> <tr> // tabela de pagamentos editavel </tr> </thead> <tbody>'; if(mysqli_num_rows($result) > 0) { while($row = mysqli_fetch_array($result)) { //terceiro while , tabela referente a pagamentos $output .= ' <tr> // tabela pagamentos </tr>'; } $output .= ' <tr> // insiro linhas caso precise </tr> '; } else { $output .= '<tr> // caso não tenha nada inserido, posso fazer por aqui </tr> '; } $output .= '</tbody> </table> </div> '; } echo $output; ?> só esta carregando uma vez , tudo dentro da parte editável esta funcionando, porém no primeiro while só faz 1 loop, os demais estão funcionando perfeitamente.
      desde já agradeço qualquer ajuda.
    • By Marlonsantos
      Olá pessoal, eu estou começando meu curso de programação Full Stack e tive a tarefa de fazer uma página mais parecida possível com essa. Mas estou com muita dificuldade na hora de colocar essa <DIV> branca dentro dessa <DiV> preta. Eu já consegui colocar os links nas imagens do Facebook e do Instagram, porém não consigo alinhar elas no canto direito, meu <h1> vem junto... Muito obrigado pela atenção galera

    • By mamotinho
      Olá, gostaria de sabe como posso fazer uma contagem regressiva apartir de um registro em meu banco de dados eu tentei montar um código da seguinte forma:

       
      <? $DateGET = date('m/d/Y H:i A', strtotime($result->DateDiscount)); ?> <script> var valueDate = <?=$DateGET?>; var end = new Date(valueDate); var _second = 1000; var _minute = _second * 60; var _hour = _minute * 60; var _day = _hour * 24; var timer; function showRemaining() { var now = new Date(); var distance = end - now; if (distance < 0) { clearInterval(timer); document.getElementById("countdown").innerHTML = "EXPIRED!"; return; } var days = Math.floor(distance / _day); var hours = Math.floor((distance % _day) / _hour); var minutes = Math.floor((distance % _hour) / _minute); var seconds = Math.floor((distance % _minute) / _second); document.getElementById("countdown").innerHTML = "<span class='n_date day' id='days'>" + days + "</span><span class='date'>일</span>"; document.getElementById("countdown").innerHTML += "<span class='n_time hour' id='hrs'>" + hours + "</span>"; document.getElementById("countdown").innerHTML += "<span class='n_time minute' id='minus'>" + minutes + "</span>"; document.getElementById("countdown").innerHTML += "<span class='n_time second' id='secs'>" + seconds + "</span>"; } timer = setInterval(showRemaining, 1000); </script> Mais infelizmente não passou a data registrada no banco de dados, alguém teria ideia de como posso ta fazendo.
    • By leandro123456789
      <div id="direito">
             
             <?php 
                      
                 $link = filter_input(INPUT_GET, 'link');
                 
                 $pag[1] = "../admin/home.php";
                 $pag[2] = "../admin/classes/Lista.php";
                 
              
              
                 if(!empty($link)){
                     
                     if(file_exists($pag[$link]))
                        
                      {
                         include $pag[$link];
                      
                      }
                        
                      else
                      { 
                         
                          include "home.php";
                      
                      }
                     
                 }else{
                     include "home.php";
                 }
              
              ?>
             
          </div>
       
       
      Estou tentando colocar a paginação do meu banco em $ pag [2] na minha página: ../admin/classes/Lista.php tem o seguinte código de paginação:

      <? php
          
          include_once ("../ admin / classes / ClassConexao.php");
          
          
          // verifique a página atual se informado no URL, caso contrário, ela será atribuída como 1ª página
          $ pagina = (isset ($ _ GET ['link = 2']))? $ _GET ['link = 2']: 1;
       
          // seleciona todos os itens da tabela
          $ cmd = "selecione * da categoria";
          $ produtos = mysqli_query ($ conn, $ cmd);
          
          // conta o total de itens
          $ total = mysqli_num_rows ($ produtos);
       
          // seta o número de itens por página, neste caso, 2 itens
          $ registros = 2;
       
          // calcula o número de páginas arredondando o resultado
          $ numPaginas = teto ($ total / $ registros);
       
          // variável para calcular o início da visualização com base na página atual
          $ inicio = ($ registros * $ pagina) - $ registros;
       
          // seleciona itens por página
          $ cmd = "selecione * da categoria limite $ inicio, $ registros";
          $ produtos = mysqli_query ($ conn, $ cmd);
          $ total = mysqli_num_rows ($ produtos);
           
          // exibe produtos selecionados
          while ($ produto = mysqli_fetch_array ($ produtos)) {
              echo $ produto ['id_categoria']. "-";
              echo $ produto ['categoria']. "-";
              echo $ produto ['ativo_categoria']. "<br />";
          }

      // Não sei como consertar esta parte para mostrar a paginação nesse $ pag [2] = "../admin/classes/Lista.php";
           
          // exibe paginação
          para ($ i = 1; $ i <$ numPaginas + 1; $ i ++) {
              
             echo "<a href='?pagina=$i'>". $ i. "</a>";
          }
                  
      ?>
      Meu menu fica assim:

      <div id = "sessao"> Categoria </div>
         <ul>
             
            
             <li> <a href="index.php?link=3"> Cadastro </a> </li>
             <li> <a href="index.php?link=2"> Listar / Editar </a> </li>
         
        </ul>
    • By Camilavip
      Oi, tenho um flip para virar a imagem, bem pequeno e funcional, mas ao colocar um rodapé, ele simplesmente invade esse rodapé
      Creio que tem haver alguma coisa com o position: absolute, mas não entendo nada de css
       
      <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"> </head> <body> <!-- CSS DO FLIP --> <style> .flip-container:hover .flipper{ transform: rotateY(180deg); /* se quiser uma animação na vertical, troque por rotateX(180deg) */ } .flipper{ width: 100%; height: 100%; transition: transform 0.8s; transform-style: preserve-3d; } .front, .back{ position: absolute; width: 100%; height: 100%; } .back{ transform: rotateY(180deg); } </style> <center> <div class="flip-container"> <div class="flipper"> <div class="front"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/zohO24tyN2WB8etR3nhZPvhf.png" /> </div> <div class="back"> <img src="https://d3mwk3f7r8fv9u.cloudfront.net/images/XkAkTVqVPbLB3cK5njqdun66.png" /> </div> </div> </div> <!-- AQUI COMEÇA O RODAPÉ --> <!-- CSS DO RODAPÉ --> <style> @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap'); *{ margin: 0; padding: 0; color: #d9d9d9; box-sizing: border-box; font-family: 'Poppins', sans-serif; } .content1{ position: relative; margin: 130px auto; text-align: center; padding: 0 20px; } .content1 .text{ font-size: 2.5rem; font-weight: 600; color: #202020; } .content1 .p{ font-size: 2.1875rem; font-weight: 600; color: #202020; } footer{ position: fixed; bottom: 0px; width: 100%; background: #111; } .main-content{ display: flex; } .main-content .box{ flex-basis: 50%; padding: 10px 20px; } .box h2{ font-size: 1.125rem; font-weight: 600; text-transform: uppercase; } .box .content{ margin: 20px 0 0 0; position: relative; } .box .content:before{ position: absolute; content: ''; top: -10px; height: 2px; width: 100%; background: #1a1a1a; } .box .content:after{ position: absolute; content: ''; height: 2px; width: 15%; background: #f12020; top: -10px; } .left .content p{ text-align: justify; } .left .content .social{ margin: 20px 0 0 0; } .left .content .social a{ padding: 0 2px; } .left .content .social a span{ height: 40px; width: 40px; background: #1a1a1a; line-height: 40px; text-align: center; font-size: 18px; border-radius: 5px; transition: 0.3s; } .left .content .social a span:hover{ background: #f12020; } .center .content .fas{ font-size: 1.4375rem; background: #1a1a1a; height: 45px; width: 45px; line-height: 45px; text-align: center; border-radius: 50%; transition: 0.3s; cursor: pointer; } .center .content .fas:hover{ background: #f12020; } .center .content .text{ font-size: 1.0625rem; font-weight: 500; padding-left: 10px; } .center .content .phone{ margin: 15px 0; } .right form .text{ font-size: 1.0625rem; margin-bottom: 2px; color: #656565; } .right form .msg{ margin-top: 10px; } .right form input, .right form .msgForm{ width: 100%; font-size: 1.0625rem; background: #151515; padding-left: 10px; border: 1px solid #222222; } .right form input:focus, .right form .msgForm:focus{ outline-color: #3498db; } .right form input{ height: 35px; } .right form .btn{ margin-top: 10px; } .right form .btn button{ height: 40px; width: 100%; border: none; outline: none; background: #f12020; font-size: 1.0625rem; font-weight: 500; cursor: pointer; transition: .3s; } .right form .btn button:hover{ background: #000; } .bottom center{ padding: 5px; font-size: 0.9375rem; background: #151515; } .bottom center span{ color: #656565; } .bottom center a{ color: #f12020; text-decoration: none; } .bottom center a:hover{ text-decoration: underline; } @media screen and (max-width: 900px) { footer{ position: relative; bottom: 0px; } .main-content{ flex-wrap: wrap; flex-direction: column; } .main-content .box{ margin: 5px 0; } } </style> <div class="content1"> <div class="text"> Fully Responsive Footer Section</div> <div class="p"> HTML and CSS (Flexbox)</div> </div> <footer> <div class="main-content"> <div class="left box"> <h2> About us</h2> <div class="content"> <p> CodinNepal is a YouTube channel where you can learn web designing, web development, ui/ux designing, html css tutorial, hover animation and effects, javascript and jquery tutorial and related so on.</p> <div class="social"> <a href="https://facebook.com/coding.np"><span class="fab fa-facebook-f"></span></a> <a href="#"><span class="fab fa-twitter"></span></a> <a href="https://instagram.com/coding.np"><span class="fab fa-instagram"></span></a> <a href="https://youtube.com/c/codingnepal"><span class="fab fa-youtube"></span></a> </div> </div> </div> <div class="center box"> <h2> Address</h2> <div class="content"> <div class="place"> <span class="fas fa-map-marker-alt"></span> <span class="text">Birendranagar, Surkhet</span> </div> <div class="phone"> <span class="fas fa-phone-alt"></span> <span class="text">+089-765432100</span> </div> <div class="email"> <span class="fas fa-envelope"></span> <span class="text">abc@example.com</span> </div> </div> </div> <div class="right box"> <h2> Contact us</h2> <div class="content"> <form action="#"> <div class="email"> <div class="text"> Email *</div> <input type="email" required> </div> <div class="msg"> <div class="text"> Message *</div> <!-- NOTE: Due to more textarea tag I got an error. So I changed the textarea name to changeit. Please change that changeit name to textarea --> <changeit id=".msgForm" rows="2" cols="25" required></changeit> <!-- replace this changeit name to textarea --> <br /> <div class="btn"> <button type="submit">Send</button> </div> <div class="bottom"> <center> <span class="credit">Created By <a href="https://youtube.com/c/codingnepal">CodingNepal</a> | </span> <span class="far fa-copyright"></span> 2020 All rights reserved. </center> </div> </body> </html>  
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.