Algoritmos y Algo Más

Para todos los amantes de la programación.
Skip to content
  • C/C++
  • Java
  • .NET
  • Pseint
  • Youtube

Etiqueta: login

Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 4 – 4

Posted on 4 septiembre, 20212 enero, 2022 by ayam

Esta es la parte 4 y última de esta serie de publicaciones. La parte 3 puedes encontrarla en este link https://algoritmosyalgomas.com/login-java-web-usuario-password-conexion-base-datos-mysql-n-capas-parte3/ 

Continuaremos mejorando la aplicación web y dándole los retoques finales.

Agregando la librería jquery y bootstrap

Incluiremos la librería jquery 3.5.1. Para ello debemos incluir la etiqueta script especificando en el atributo src la url de su ubicación. Utilizaremos una cdn

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js”></script>

En cuanto a bootstrap, incluiremos las hojas de estilos y la librería javascript:

  • CSS:
  • JS:

La librería css de bootstrap se incluye en el <head> mientras que las librerías javascript se agregan antes del cierre del tag <body>.

Luego de la inclusión de estas dos librerías mencionadas, la aplicación se verá de forma distinta:

Archivo style.css para la personalización de los estilos

Vamos a mejorar los estilos de nuestro login. Para ello, además de usar las clases propias de bootstrap añadiremos nuestros estilos personalizados. Hacemos clic derecho en la carpeta css  (la cual se encuentra dentro de WebContent o dentro de src/main/webapp) y elegimos new / File.. 

El nombre del archivo a crear es style.css

Estas son las reglas de estilos que debes copiar y pegar dentro del archivo style.css

Modificando index.jsp

También vamos a modificar la página index.jsp utilizando clases de bootstrap para darle estilos a los cuadros de texto, botón y divs.

A continuación se muestra el código completo de la página index.jsp con la inclusión de las librerías jquery, bootstrap y los estilos personalizados:

 

Ahora la página se verá mucho más elegante.

Mejorando el mensaje de error

El mensaje de error para login fallido se imprime con código Java el cual se incrusta mediante scriptlets. Como ya hemos visto, la lógica de este scriptlet consiste en acceder al valor del atributo “mensaje” y si este es diferente de nulo, imprimirlo en pantalla. 

 

Vamos a hacer la misma lógica pero utilizando una etiqueta condicional if, la cual forma parte de la librería core JSTL.

Uso de la JSTL Core

Vamos a descargarnos la librería JSTL desde este enlace: https://mvnrepository.com/artifact/javax.servlet/jstl/1.2

Buscamos el link “jar” y lo descargamos.

Luego, copiamos el jar descargado dentro de la carpeta WEB-INF/lib de nuestro proyecto Java web.

 

Ahora, para empezar a usar los tags es necesario añadir la directiva taglib en todas las páginas jsp donde nos haga falta. En nuestro caso la vamos a usar en index.jsp.  Es importante indicar que en esta directiva hay dos partes: la uri y el prefix (prefijo). El prefijo que estamos usando, por una cuestión de costumbre, es “c” de “core”.

Ahora, ya que contamos con la librería core JSTL cargada en la página, vamos a usar dos tipos de tags: set y if (con el prefijo “c”)

Con el tag set declaramos una variable llamada mensaje y le asignamos un valor mediante el uso del lenguaje de expresiones EL. El valor asignado es requestScope.mensaje, es decir, el mensaje guardado como atributo dentro del objeto request (este valor es asignado desde el fragmento de código java (scriptlet)  dentro de la página validar.jsp).

Con el tag if evaluamos una condición, si es verdadero, se ejecuta lo que se encuentra dentro. En nuestro caso, si se cumple la condición de que la variable mensaje es vacío o nulo, se imprimirá el valor del mensaje.

En la siguiente imagen se muestra el código equivalente: A la izquierda usando scriptlets y a la derecha usando la JSTL y EL.

Hasta el momento, el código de la página index.jsp queda como sigue:

Y para mejorar de manera visual el mensaje de error mostrado, usaremos un componente de bootstrap llamado alert. 

Basta hacer algunos ajustes al código html donde se muestra el mensaje de error como se ve a continuación:

Finalmente la página index.jsp quedaría como sigue:

Y los mensajes de error ahora se verán se verán como alerts de bootstrap:

Validaciones del formulario con BootstrapValidator

Vamos a utilizar esta librería para poder aplicar validaciones a los componentes del formulario de login (y a cualquier otro componente html). 

Hay que descargar estos dos archivos:

  • bootstrapValidator.js: https://gist.githubusercontent.com/algoritmosyalgomas/7db932abcd2dcaa25f2d933e89bae914/raw/a2466e6ed9a0c818a35d2131f8fe50d50079b3d1/bootstrapValidator.js
  • bootstrapValidator.css: https://gist.githubusercontent.com/algoritmosyalgomas/44e0cdfcff64489ba2af8883d85bcc3f/raw/6cd1403632922f65e665de41e458eef7274e84f6/bootstrapValidator.css

Una vez que descargaste los dos archivos, hay que ubicarlos en una carpeta adecuada:

  • bootstrapValidator.js en la carpeta js:
  • bootstrapValidator.css en la carpeta css:

Archivo script.js

Creamos este archivo dentro de la carpeta js. Este archivo contiene el código javascript que permite validar los campos del formulario de login utilizando la librería bootstrapValidator:

Una vez que tenemos los archivos de la librería bootstrapValidator y el archivo script.js en sus carpetas respectivas, las incluímos en la página index.jsp:

 

Finalmente el código de la página index.jsp sería el siguiente:

Solo nos queda probar cómo funciona el validador de bootstrapValidator:

La lista completa de entradas relacionadas a esta son las siguientes:

Parte 1: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 1 – 4

Parte 2: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 2 – 4

Parte 3: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 3 – 4

Parte 4: Login en Java web y MySQL – N capas (JSP’s y Servlets) Parte 4 – 4

Base de datos, Java, Java web bootstrap, eclipse, java, java web, jquery, login, mysql, programación, servlet, tomcat
1

Login en C con 3 intentos, clave en asteriscos y registro de usuarios usando archivos binarios

Posted on 26 abril, 20212 enero, 2022 by ayam

En esta entrada se presenta un programa en lenguaje C que permite registrar cuentas de usuario haciendo uso de archivos binarios. También tiene la opción para listar todos los usuarios registrados en pantalla. Y por último una opción para realizar un inicio de sesión (login) al sistema mediante un usuario y password en asteriscos (solo se permite 3 intentos).

Se utilizó:

  1. Estructuras de control:
    1. Condicionales: if-else, switch
    2. Bucles: do-while, for
  2. Funciones de la biblioteca estándar string para el manejo de cadenas (strcpy, strcmp)
  3. Funciones con parámetros con paso por valor y por referencia.
  4. Uso de structs, punteros y memoria dinámica (creación de un vector dinámico).
  5. Manejo de archivos binarios: apertura, acceso, lectura y escritura, cierre.
  6. Uso de la biblioteca no estándar conio para invocar a la función getch y poder leer caracteres sin eco (para que no se muestren en pantalla).
Este programa es una fusión de dos programas que hice anteriormente por separado:
 

1. Login en C en 3 intentos y clave en asteriscos: https://algoritmosyalgomas.com/login-en-c-con-clave-en-asteriscos-y-3-intentos/

2. Programa para registrar y mostrar usuarios con archivos binarios: https://algoritmosyalgomas.com/programa-en-c-registrar-y-mostrar-usuarios-archivos-binarios/

Código fuente (lenguaje C)

C y C++ archivos binarios, c++, login, registro de usuarios
2
  • 1
  • 2
  • 3
  • 4
  • »

Contenido

  • julio 2022 (7)
  • marzo 2022 (1)
  • diciembre 2021 (2)
  • octubre 2021 (3)
  • septiembre 2021 (3)
  • abril 2021 (7)
  • diciembre 2020 (4)
  • noviembre 2020 (1)
  • octubre 2020 (2)
  • julio 2020 (1)
  • octubre 2019 (1)
  • junio 2019 (1)
  • abril 2019 (1)
  • febrero 2019 (4)
  • noviembre 2018 (2)
  • octubre 2018 (8)
  • septiembre 2018 (1)

Lo último de este blog

  • Pregunta final resuelta de principios de algoritmos UTP en Pseint 3 30 julio, 2022
  • UTP Ejercicios de prueba de escritorio de principios de algoritmos Nº 4 26 julio, 2022
  • UTP Ejercicios de prueba de escritorio de principios de algoritmos Nº 3 26 julio, 2022
  • UTP Ejercicios de prueba de escritorio de principios de algoritmos Nº 2 25 julio, 2022
  • UTP Ejercicios de prueba de escritorio de principios de algoritmos Nº 1 25 julio, 2022
  • Ejercicios resueltos de principios de algoritmos UTP en Pseint 2 24 julio, 2022
  • Ejercicios resueltos de principios de algoritmos UTP en Pseint 1 24 julio, 2022
  • Principios de algoritmos UTP – resolución de examen final Nº 3 13 marzo, 2022
  • Principios de algoritmos UTP – resolución de examen final Nº 2 30 diciembre, 2021
  • Principios de algoritmos UTP – resolución de examen final Nº 1 30 diciembre, 2021

Categorías

Etiquetas

algoritmos (16) archivos binarios (3) bootstrap (2) bucle (10) c (3) c++ (18) ciclos (9) conio (2) cpp (6) diagramas de flujo (10) eclipse (7) editores (2) estructura repetitiva (9) estructuras de control (10) examenes finales (6) herramientas de programación (2) IDE (2) ides (2) int (2) java (7) java web (4) jquery (2) jsp (3) juegos (3) login (7) matemática (3) mcm (2) menú (4) menú de opciones (6) mysql (5) paso por referencia (1) paso por valor (1) principios de algoritmos (6) programación (7) pseint (10) pseudocódigo (10) punteros (1) registro de usuarios (2) servlet (5) swap (1) teclas direccionales (2) tomcat (4) utp (6) validación (2) while (2)
Este sitio web utiliza cookies para mejorar su experiencia. Asumiremos que está de acuerdo con esto, pero puede optar por no participar si lo desea.AceptoCancelar Read More
Privacy & Cookies Policy

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Siempre activado
Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.
Non-necessary
Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.
GUARDAR Y ACEPTAR