Acceda a la página por contraseña en la ventana emergente

En este artículo, te mostraré cómo acceder a la página por contraseña en una ventana emergente de forma rápida y eficiente. Si necesita una protección más fuerte, lea los comentarios sobre este artículo.
Lo haremos usando JavaScript y HTML con CSS. Todo el artículo que voy a compartir en los pasos con los que fácilmente será capaz de repetir estos movimientos y obtener lo mismo que yo.
Acceda a la página por contraseña en la ventana emergente
Tenemos un sitio web y tenemos una página y tenemos que restringir el acceso a ella. Para ello, entramos en el código de esta página y escribimos el código de la ventana emergente, junto con los estilos al principio de nuestra página. Tenga en cuenta que este método solo funciona en páginas estáticas, si usa algún CMS, busque los módulos apropiados.
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 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
<style type="text/css"> html { padding: 0; margin: 0; } .modalDialog { position: fixed; font-family: Arial, Helvetica, sans-serif; top: 0; right: 0; bottom: 0; left: 0; background: #000; z-index: 99999; display: block; } .modalDialog > div { width: 400px; position: relative; margin: 10% auto; padding: 5px 20px 13px 20px; border-radius: 10px; background: #fff; background: -moz-linear-gradient(#fff, #999); background: -webkit-linear-gradient(#fff, #999); background: -o-linear-gradient(#fff, #999); } .close { display: none; } </style> <script type="text/javascript"> function my_proverka () { var code = document.getElementById("my_pass").value; var pass = "basww2mKKdnkKKsmmas"; if (code == pass) { var win = document.getElementById("openModal"); win.classList.add("close"); } } </script> <div id="openModal" class="modalDialog"> <div> <h2>Введите пароль</h2> <input type="password" id="my_pass" placeholder="Introduzca la contraseña aquí"> <input type="submit" onclick="my_proverka();" value="Enter"> </div> </div> <div style="color: #000;"> Aquí el código de nuestro sitio principal es nuestro sitio principal.</div> |
¿Qué hace este código? Cubre el contenido del sitio y espera a que se introduzca la contraseña en el campo correspondiente. Después de introducir la contraseña, se iniciará la verificación para que coincida con el código que hay en el sistema, a continuación, iniciar sesión en el sitio.
Advertencia
¡Atención, queridos amigos! Código para principiantes, no lo use en proyectos serios, porque este código se crea de forma elemental y cualquiera puede evitarlo. Necesita cosas más serias para proteger la página, entonces sin ayuda del servidor no puede ser. A continuación hay enlaces en los comentarios.
Contact Us
You are used to see a contact form here. Almost everyone does it. But while examining the behavior of people, we came to the conclusion that the form is completely unnecessary. In any case, it all comes down to discuss your project on WhatsApp. Why should we waste your time filling out various forms?