Después del registro exitoso, apareció la inscripción zrz. Creamos un sistema de registro increíblemente sencillo en PHP y MySQL. Cómo utilizar este sistema

El proceso de creación de un sistema de registro requiere bastante trabajo. Debe escribir un código que verifique la validez de las direcciones de correo electrónico, envíe correos electrónicos de confirmación, ofrezca la posibilidad de recuperar contraseñas, almacene contraseñas en un lugar seguro, valide los formularios de entrada y mucho más. Incluso cuando haga todo esto, los usuarios se mostrarán reacios a registrarse, ya que incluso los más inscripción mínima requiere su actividad.

En el tutorial de hoy, desarrollaremos un sistema de registro simple que no requerirá contraseñas. El resultado será un sistema que se puede modificar o integrar fácilmente en un sitio web PHP existente. Si estás interesado, sigue leyendo.

PHP

Ahora estamos listos para comenzar con el código PHP. La funcionalidad principal del sistema de registro la proporciona la clase Usuario, que puede ver a continuación. La clase utiliza (), que es una biblioteca de bases de datos minimalista. La clase Usuario es responsable de acceder a las bases de datos, generar tokens de inicio de sesión y validarlos. Nos presenta una interfaz sencilla que puede incorporarse fácilmente al sistema de registro de sus sitios web basados ​​en PHP.

Usuario.clase.php

// Instancia ORM privada
forma privada;

/**
* Encuentra un usuario por una cadena de token. Sólo se aceptan tokens válidos
* consideración. Un token es válido durante 10 minutos después de su generación.
* @param string $token El token a buscar
* @return Usuario
*/

Función estática pública findByToken($token)(

// lo buscamos en la base de datos y nos aseguramos de que la marca de tiempo sea correcta


->donde("token", $token)
->where_raw("validez_token > AHORA()")
->buscar_uno();

Si(!$resultado)(
devolver falso;
}

Devolver nuevo usuario ($resultado);
}

/**
* Inicie sesión o registre un usuario.
* @return Usuario
*/

Función estática pública loginOrRegister($correo electrónico)(

// Si dicho usuario ya existe, lo devolvemos

Si(Usuario::existe($correo electrónico))(
devolver nuevo usuario ($correo electrónico);
}

// En caso contrario, créelo y devuélvalo

Usuario devuelto::create($correo electrónico);
}

/**
* Crear un nuevo usuario y guardarlo en la base de datos.
* @param string $email La dirección de correo electrónico del usuario
* @return Usuario
*/

Función estática privada crear ($ correo electrónico) (

// Escribe un nuevo usuario en la base de datos y lo devuelve.

$resultado = ORM::for_table("reg_users")->create();
$resultado->correo electrónico = $correo electrónico;
$resultado->guardar();

Devolver nuevo usuario ($resultado);
}

/**
* Verifique si dicho usuario existe en la base de datos y devuelva un valor booleano.
* @param string $email La dirección de correo electrónico del usuario
* @return booleano
*/

Existe una función estática pública ($email)(

// ¿Existe el usuario en la base de datos?
$resultado = ORM::for_table("reg_users")
->dónde("correo electrónico", $correo electrónico)
->contar();

Devuelve $resultado == 1;
}

/**
* Crear un nuevo objeto de usuario
* @param $param Instancia ORM, id, correo electrónico o nulo
* @return Usuario
*/

Función pública __construct($param = null)(

Si ($param instancia de ORM)(

// Se pasó una instancia ORM
$this->orm = $param;
}
demás si(is_string($param))(

//Se pasó un correo electrónico
$esto->
->dónde("correo electrónico", $param)
->buscar_uno();
}
demás(

Si(is_numeric($param))(
// Se pasó una identificación de usuario como parámetro
$id = $param;
}
else if(isset($_SESSION["loginid"]))(

// No se pasó ningún ID de usuario, mira la sesión
$id = $_SESSION["loginid"];
}

$this->orm = ORM::for_table("reg_users")
->dónde("identificación", $identificación)
->buscar_uno();
}

/**
* Genera un nuevo token de inicio de sesión SHA1, lo escribe en la base de datos y lo devuelve.
* @cadena de retorno
*/

Función pública generarToken())(
// genera un token para el usuario que ha iniciado sesión. Guárdelo en la base de datos.

$token = sha1($this->email.time().rand(0, 1000000));

// Guarda el token en la base de datos,
// y márcalo como válido sólo durante los próximos 10 minutos

$this->orm->set("token", $token);
$this->orm->set_expr("token_validity", "ADDTIME(NOW(),"0:10")");
$this->orm->save();

Devolver $token;
}

/**
*Inicia sesión con este usuario
* @retorno nulo
*/

Inicio de sesión de función pública()

// Marcar al usuario como iniciado sesión
$_SESSION["loginid"] = $this->orm->id;

//Actualiza el campo de base de datos last_login
$this->orm->set_expr("last_login", "AHORA()");
$this->orm->save();
}

/**
* Destruye la sesión y cierra la sesión del usuario.
* @retorno nulo
*/

Cerrar sesión de función pública()
$_SESSION = matriz();
desarmado($_SESSION);
}

/**
* Compruebe si el usuario ha iniciado sesión.
* @return booleano
*/

Función pública iniciada sesión())(
return isset($this->orm->id) && $_SESSION["loginid"] == $this->orm->id;
}

/**
* Comprobar si el usuario es administrador
* @return booleano
*/

La función pública esAdmin())(
return $this->rank() == "administrador";
}

/**
* Encuentra el tipo de usuario. Puede ser administrativo o regular.
* @cadena de retorno
*/

Rango de función pública ()
if($this->orm->rango == 1)(
devolver "administrador";
}

Devolver "normal";
}

/**
* Método mágico para acceder a los elementos de lo privado.
* $orm instancia como propiedades del objeto de usuario
* @param string $key El nombre de la propiedad a la que se accede
* @retorno mixto
*/

Función pública __get($clave)(
if(isset($this->orm->$clave))(
devolver $this->orm->$key;
}

Devuelve nulo;
}
}
Los tokens se generan mediante un algoritmo y se almacenan en una base de datos. Usamos MySQL para configurar la columna token_validity en 10 minutos. Al validar un token, le decimos al motor que necesitamos un token, el campo token_validity aún no ha caducado. De esta forma limitamos el tiempo durante el cual el token será válido.

Observe que usamos el método mágico __get() al final del documento para acceder a las propiedades del objeto de usuario. Esto nos permite acceder a los datos que están almacenados en la base de datos como propiedades: $usuario->correo electrónico, $usuario->token. Como ejemplo, veamos cómo podemos usar esta clase en el siguiente fragmento de código:


Otro archivo que almacena la funcionalidad necesaria es funciones.php. Allí tenemos algunas funciones auxiliares que nos permiten mantener el resto del código más ordenado.

Funciones.php

Función enviar_correo electrónico($de, $a, $asunto, $mensaje)(

// Función auxiliar para enviar correo electrónico

$headers = "Versión MIME: 1.0" . "\r\n";
$headers .= "Tipo de contenido: texto/sin formato; charset=utf-8" . "\r\n";
$encabezados .= "De: ".$de . "\r\n";

Devolver correo ($a, $asunto, $mensaje, $encabezados);
}

función get_page_url())(

// Descubra la URL de un archivo PHP

$url = "http".(empty($_SERVER["HTTPS"])?"":"s")."://".$_SERVER["SERVER_NAME"];

If(isset($_SERVER["REQUEST_URI"]) && $_SERVER["REQUEST_URI"] != "")(
$url.= $_SERVER["REQUEST_URI"];
}
demás(
$url.= $_SERVER["PATH_INFO"];
}

Devolver $url;
}

función límite_tasa($ip, $límite_hora = 20, $límite_10_min = 10)(

// El número de intentos de inicio de sesión durante la última hora con esta dirección IP

$count_hour = ORM::for_table("reg_login_attempt")
->
->where_raw("ts > SUBTIME(AHORA(),"1:00")")
->contar();

// El número de intentos de inicio de sesión durante los últimos 10 minutos con esta dirección IP

$count_10_min = ORM::for_table("reg_login_attempt")
->dónde("ip", sprintf("%u", ip2long($ip)))
->where_raw("ts > SUBTIME(AHORA(),"0:10")")
->contar();

Si($count_hour > $limit_hour || $count_10_min > $limit_10_min)(
lanzar una nueva excepción ("¡Demasiados intentos de inicio de sesión!");
}
}

función rate_limit_tick($ip, $correo electrónico)(

// Crea un nuevo registro en la tabla de intentos de inicio de sesión

$login_attempt = ORM::for_table("reg_login_attempt")->create();

$login_attempt->correo electrónico = $correo electrónico;
$login_attempt->ip = sprintf("%u", ip2long($ip));

$login_attempt->save();
}

función de redirección ($url)(
encabezado("Ubicación: $url");
salida;
}
Las funciones rate_limit y rate_limit_tick nos permiten limitar el número de intentos de autorización durante un periodo de tiempo determinado. Los intentos de autorización se registran en la base de datos reg_login_attempt. Estas funciones se activan cuando se verifica el formulario de inicio de sesión, como puede ver en el siguiente fragmento de código.

El siguiente código fue tomado de index.php y es responsable de validar el formulario de inicio de sesión. Devuelve una respuesta JSON impulsada por el código jQuery que vimos en activos/js/script.js.

index.php

If(!empty($_POST) && isset($_SERVER["HTTP_X_REQUESTED_WITH"]))(

// Genera un encabezado JSON

Encabezado("Tipo de contenido: aplicación/json");

// ¿Es válida la dirección de correo electrónico?

If(!isset($_POST["correo electrónico"]) || !filter_var($_POST["correo electrónico"], FILTER_VALIDATE_EMAIL))(
throw new Exception ("Ingrese un correo electrónico válido.");
}

// Esto generará una excepción si la persona está arriba
// los límites de intentos de inicio de sesión permitidos (consulte funciones.php para obtener más información):
rate_limit($_SERVER["REMOTE_ADDR"]);

// Registra este intento de inicio de sesión
rate_limit_tick($_SERVER["REMOTE_ADDR"], $_POST["correo electrónico"]);

//Envía el mensaje al usuario

$mensaje = "";
$correo electrónico = $_POST["correo electrónico"];
$subject = "Su enlace de inicio de sesión";

Si(!Usuario::existe($correo electrónico))(
$subject = "¡Gracias por registrarse!";
$message = "¡Gracias por registrarse en nuestro sitio!\n\n";
}

// Intenta iniciar sesión o registrar a la persona
$usuario = Usuario::loginOrRegister($_POST["correo electrónico"]);

$message.= "Puedes iniciar sesión desde esta URL:\n";
$mensaje.= get_page_url()."?tkn=".$usuario->generateToken()."\n\n";

$message.= "El enlace caducará automáticamente después de 10 minutos.";

$resultado = send_email($fromEmail, $_POST["email"], $asunto, $mensaje);

Si(!$resultado)(
throw new Exception("Hubo un error al enviar su correo electrónico. Inténtelo de nuevo.");
}

Muere(json_encode(matriz(
"message" => "¡Gracias! Hemos enviado un enlace a su bandeja de entrada. Revisa también tu carpeta de spam."
)));
}
}
captura(Excepción $e)(

Muere(json_encode(matriz(
"error"=>1,
"mensaje" => $e->getMessage()
)));
}
Tras la autorización o el registro exitosos, el código anterior envía un correo electrónico a la persona con un enlace para la autorización. El token está disponible como una variable $_GET "tkn" debido a la URL generada.

index.php

Si(isset($_GET["tkn"]))(

// ¿Es este un token de inicio de sesión válido?
$usuario = Usuario::findByToken($_GET["tkn"]);

// ¡Sí! Inicie sesión como usuario y redirija a la página protegida.

$usuario->iniciar sesión();
redirigir("protegido.php");
}

// Token no válido. Redirigir nuevamente al formulario de inicio de sesión.
redirigir("index.php");
}
Al ejecutar $user->login() se crearán las variables de sesión necesarias, lo que permitirá al usuario permanecer conectado en inicios de sesión posteriores.

El cierre de sesión del sistema se implementa aproximadamente de la misma manera:

índice.php

If(isset($_GET["cerrar sesión"]))(

$usuario = nuevo Usuario();

Si($usuario->loggedIn())(
$usuario->cerrar sesión();
}

Redirigir("index.php");
}
Al final del código, redirigimos al usuario a index.php nuevamente, por lo que se elimina el parámetro ?logout=1 en la URL.

Nuestro archivo index.php también necesitará protección; no queremos que los usuarios que ya han iniciado sesión vean el formulario. Para hacer esto usamos el método $usuario->loggedIn():

índice.php

$usuario = nuevo Usuario();

if($usuario->loggedIn())(
redirigir("protegido.php");
}
Finalmente, veamos cómo puede proteger la página de su sitio web y hacerla accesible solo después de la autorización:

protegido.php

// Para proteger cualquier página PHP en tu sitio, incluye main.php
// y crea un nuevo objeto Usuario. ¡Es así de simple!

require_once "incluye/main.php";

$usuario = nuevo Usuario();

if(!$usuario->loggedIn())(
redirigir("index.php");
}
Después de esta verificación, puede estar seguro de que el usuario ha iniciado sesión correctamente. También tendrá acceso a los datos almacenados en la base de datos como propiedades del objeto $user. Para mostrar el correo electrónico del usuario y su clasificación, utilice el siguiente código:

Haga eco de "Su correo electrónico: ".$usuario->correo electrónico;
echo "Tu rango: ".$usuario->rank();
Aquí ranking() es el método porque la columna de rango en la base de datos generalmente contiene números (0 para usuarios normales y 1 para administradores), y necesitamos convertir todos estos en nombres de rango, lo cual se implementa usando este método. Para convertir usuario habitual como administrador, simplemente edite la entrada del usuario en phpmyadmin (o cualquier otro programa de base de datos). Como administrador, al usuario no se le otorgarán capacidades especiales. Usted mismo tiene derecho a elegir qué derechos conceder a los administradores.

¡Listo!

¡Con esto, nuestro sencillo sistema de registro está listo! Puede usarlo en un sitio PHP existente o modernizarlo para adaptarlo a sus propios requisitos.

¡Hola! Ahora intentaremos implementar el registro más simple en el sitio usando PHP + MySQL. Para hacer esto, Apache debe estar instalado en su computadora. El principio de funcionamiento de nuestro script se muestra a continuación.

1. Comencemos creando una tabla de usuarios en la base de datos. Contendrá los datos del usuario (nombre de usuario y contraseña). Vayamos a phpmyadmin (si estás creando una base de datos en tu PC http://localhost/phpmyadmin/). Creamos una tabla de usuarios, tendrá 3 campos.

Yo lo creo en la base de datos mysql, tu puedes crearlo en otra base de datos. A continuación, establezca los valores como en la figura:

2. Se requiere una conexión a esta mesa.

Creemos un archivo bd.php. Su contenido:

En mi caso se ve así:
Guarde bd.php.

¡Excelente! Tenemos una tabla en la base de datos y una conexión a ella. Ahora puedes empezar a crear una página en la que los usuarios dejarán sus datos.



3. Cree un archivo reg.php con contenido (todos los comentarios dentro):


3. Cree un archivo reg.php con contenido (todos los comentarios dentro):


Registro




Su inicio de sesión:








Tu contraseña:

4. Cree un archivo que ingresará datos en la base de datos y guardará al usuario. save_user.php (comentarios dentro):




5. ¡Ahora nuestros usuarios pueden registrarse!


5. ¡Ahora nuestros usuarios pueden registrarse!


Registro


Su inicio de sesión:






A continuación, debe crear una "puerta" para que los usuarios ya registrados ingresen al sitio. index.php (comentarios dentro):



pagina de inicio

Registro

¡Pues eso es todo! La lección puede resultar aburrida, pero muy útil. Aquí solo se muestra la idea de registro, luego puedes mejorarla: agregar seguridad, diseño, campos de datos, cargar avatares, cerrar sesión en tu cuenta (para hacer esto, simplemente destruye las variables de la sesión con la función de desarmar) y pronto. ¡Buena suerte!

¡Revisé todo, funciona correctamente!

Crear un sitio basado en membresías parece una tarea desalentadora al principio. Si alguna vez quisiste hacer esto por tu cuenta y luego te diste por vencido cuando empezaste a pensar cómo vas a armarlo usando tus habilidades de PHP, entonces este artículo es para ti. Lo guiaremos a través de todos los aspectos de la creación de un sitio basado en membresía, con un área segura para miembros protegida por contraseña.

Todo el proceso consta de dos grandes partes: registro de usuario y autenticación de usuario. En la primera parte, cubriremos la creación del formulario de registro y el almacenamiento de los datos en una base de datos MySQL. En la segunda parte, crearemos el formulario de inicio de sesión y lo usaremos para permitir a los usuarios acceder al área segura. Descarga el código Puedes descargar la fuente completa.

código para
el sistema de registro/inicio de sesión desde el siguiente enlace:

Configuración y carga El archivo Léame contiene instrucciones detalladas. Abre el

fuente\include\membersite_config.php

archivo en un editor de texto y actualice la configuración. (Inicio de sesión en la base de datos, el nombre de su sitio web, su dirección de correo electrónico, etc.).

Cargue todo el contenido del directorio. Pruebe el registro.php enviando el formulario. El formulario de registro. Por supuesto, podemos pedir más información en este momento, pero un formulario largo siempre desanima. Así que limitémonos sólo a esos campos.

Aquí está el formulario de inscripción:

Registre su nombre completo*: Dirección de correo electrónico*: Nombre de usuario*: Contraseña*:

Entonces, tenemos campos de texto para el nombre, el correo electrónico y la contraseña. Tenga en cuenta que estamos utilizando para una mejor usabilidad.

Validación de formulario

En este punto, es una buena idea implementar algún código de validación del formulario, de modo que nos aseguremos de tener todos los datos necesarios para crear la cuenta de usuario. Necesitamos verificar si el nombre, el correo electrónico y la contraseña están completos y si el correo electrónico tiene el formato adecuado.

Manejo del envío del formulario

Ahora tenemos que manejar los datos del formulario que se envían.

Aquí está la secuencia (consulte el archivo fg_membersite.php en la fuente descargada):

función RegisterUser() ( if(!isset($_POST["enviado"])) ( devuelve falso; ) $formvars = array(); if(!$this->ValidateRegistrationSubmission()) ( devuelve falso; ) $this- >CollectRegistrationSubmission($formvars); if(!$this->SaveToDatabase($formvars)) ( devuelve falso; ) if(!$this->SendUserConfirmationEmail($formvars)) ( devuelve falso; ) $this->SendAdminIntimationEmail($ formvars); devuelve verdadero;

Primero, validamos el envío del formulario. Luego recopilamos y "desinfectamos" los datos de envío del formulario (siempre haga esto antes de enviar un correo electrónico, guardarlo en la base de datos, etc.). Luego, el envío del formulario se guarda en la tabla de la base de datos. Enviamos un correo electrónico al usuario solicitando confirmación. Luego le informamos al administrador que un usuario se ha registrado.

Guardar los datos en la base de datos.

Ahora que reunimos todos los datos, necesitamos almacenarlos en la base de datos.
Así es como guardamos el envío del formulario en la base de datos.

función SaveToDatabase(&$formvars) ( if(!$this->DBLogin()) ( $this->HandleError("¡Error de inicio de sesión en la base de datos!"); return false; ) if(!$this->Ensuretable()) ( return false; ) if(!$this->IsFieldUnique($formvars,"email")) ( $this->HandleError("Este correo electrónico ya está registrado"); return false; ) if(!$this->IsFieldUnique( $formvars,"nombre de usuario")) ( $this->HandleError("Este nombre de usuario ya está utilizado. Intente con otro nombre de usuario"); return false; ) if(!$this->InsertIntoDB($formvars)) ( $this- >HandleError("¡Error al insertar en la base de datos!");

Tenga en cuenta que ha configurado los detalles de inicio de sesión de la base de datos en el archivo membersite_config.php. En la mayoría de los casos, puede utilizar "localhost" como host de la base de datos.
Después de iniciar sesión, nos aseguramos de que la tabla exista (de lo contrario, el script creará la tabla requerida).
Luego nos aseguramos de que el nombre de usuario y el correo electrónico sean únicos. Si no es único, devolvemos el error al usuario.

La estructura de la tabla de la base de datos.

Esta es la estructura de la tabla. La función CreateTable() en el archivo fg_membersite.php crea la tabla. Aquí está el código:

función CrearTabla() ( $qry = " Crear tabla$this->tablename (". "id_user INT NOT NULL AUTO_INCREMENT", "nombre VARCHAR(128) NOT NULL", "correo electrónico VARCHAR(64) NOT NULL", "número de teléfono VARCHAR(16) NOT NULL", " "nombre de usuario VARCHAR (16) NOT NULL "," contraseña VARCHAR(32) NOT NULL "," código de confirmación VARCHAR(32) "," CLAVE PRIMARIA (id_user)". ,$this->conexión)) ( $this->HandleDBError("Error crear la tabla \nquery fue\n $qry"); devolver falso; ) devolver verdadero)

El campo id_user contendrá la identificación única del usuario y también es la clave principal de la tabla. Tenga en cuenta que permitimos 32 caracteres para el campo de contraseña. Hacemos esto porque, como medida de seguridad adicional, almacenaremos la contraseña en la base de datos cifrada usando MD5. Tenga en cuenta que debido a que MD5 es un método de cifrado unidireccional, no podremos recuperar la contraseña en caso de que el usuario la olvide.

Insertando el registro a la mesa

Aquí está el código que usamos para insertar datos en la base de datos. Tendremos todos nuestros datos disponibles en la matriz $formvars.

función InsertIntoDB(&$formvars) ( $confirmcode = $this->MakeConfirmationMd5($formvars["email"]); $insert_query = "insertar en ".$this->tablename."(nombre, correo electrónico, nombre de usuario, contraseña, confirmcode) valores ("" . $this->SanitizeForSQL($formvars["name"]) . "", "" . $this->SanitizeForSQL($formvars["email"]) . "", "" . $ this->SanitizeForSQL($formvars["nombre de usuario"]) "", "" md5($formvars["contraseña"]) "", "" $confirmcode . ( $insert_query ,$this->connection)) ( $this->HandleDBError("Error al insertar datos en la tabla\nquery:$insert_query"); devuelve falso; ) devuelve verdadero)

Observe que usamos la función PHP md5() para cifrar la contraseña antes de insertarla en la base de datos.
Además, generamos el código de confirmación único a partir de la dirección de correo electrónico del usuario.

Enviar correos electrónicos

Ahora que tenemos el registro en nuestra base de datos, enviaremos un correo electrónico de confirmación al usuario. El usuario debe hacer clic en un enlace en el correo electrónico de confirmación para completar el proceso de registro.

función SendUserConfirmationEmail(&$formvars) ( $mailer = new PHPMailer(); $mailer->CharSet = "utf-8"; $mailer->AddAddress($formvars["email"],$formvars["nombre"]) ; $mailer->Subject = "Su registro con ".$this->sitename; $mailer->From = $this->GetFromAddress() $confirmcode = urlencode($this->MakeConfirmationMd5($formvars["email" ])); $confirm_url = $this->GetAbsoluteURLFolder()."/confirmreg.php?code=".$confirmcode; $mailer->Body ="Hola ".$formvars["nombre"]."\r\ n\r\n". "Gracias por su registro con ".$this->sitename."\r\n". "Haga clic en el enlace a continuación para confirmar su registro.\r\n." "$confirm_url\r \n". "\r\n". "Saludos,\r\n". "Webmaster\r\n". $this->nombre del sitio; if(!$mailer->Enviar()) ( $this-> HandleError("Error al enviar el correo electrónico de confirmación de registro."); devolver falso; devolver verdadero)

Actualizaciones

9 de enero de 2012
Se agregan las funciones Restablecer contraseña/Cambiar contraseña
El código ahora se comparte en GitHub.

¡Bienvenido de nuevo!

Licencia


El código se comparte bajo licencia LGPL. Puede utilizarlo libremente en sitios web comerciales o no comerciales.

No hay publicaciones relacionadas.

Los comentarios sobre esta entrada están cerrados.

formularios HTML - elementos complejos interfaz. Incluyen varios elementos funcionales: campos de entrada, listas, información sobre herramientas, etc. Todo el código del formulario está contenido en el archivo .

La mayor parte de la información de los formularios web se transmite mediante el formato . Para ingresar una línea de texto, se usa el elemento; para líneas múltiples, se usa el elemento. El elemento crea una lista desplegable.

El elemento crea etiquetas para los campos del formulario. Hay dos formas de agrupar etiquetas y campos. Si el campo está dentro de un elemento, no es necesario especificar el atributo for.

Apellido Apellido Apellido

Los campos del formulario se pueden dividir en bloques lógicos utilizando el elemento. A cada sección se le puede dar un nombre usando el elemento.

Información del contacto Nombre Correo electrónico
Arroz. 1. Agrupar campos de formulario

Para que el formulario sea más comprensible para los usuarios, se agrega texto a los campos del formulario para proporcionar un ejemplo de los datos de entrada. Este tipo de texto se denomina texto comodín y se crea utilizando el atributo de marcador de posición.

Los campos obligatorios también deben resaltarse. Antes de HTML5, se utilizaba el símbolo de asterisco * junto al nombre del campo. La nueva especificación introduce un atributo obligatorio especial, que le permite marcar un campo obligatorio en el nivel de marcado. Este atributo indica al navegador (suponiendo que admita HTML5) que no envíe datos después de que el usuario haga clic en enviar hasta que se completen los campos especificados.

Para cambiar la apariencia de un campo de texto cuando recibe el foco, utilice la pseudoclase de foco. Por ejemplo, puede oscurecer el fondo del campo actual o agregar un borde de color para que se destaque del resto:

Entrada: foco (fondo: #eaeaea;)

Otro atributo HTML5 útil es el atributo de enfoque automático. Le permite establecer automáticamente el foco en el campo inicial deseado para los elementos y (solo un elemento de cada formulario).

Ejemplo de creación de un formulario de registro.

marcado HTML

Registro Nombre Género masculino femenino E-mail País Seleccione país de residencia Rusia Ucrania Bielorrusia Enviar

Nota
action="form.php" - enlace al archivo del controlador de formulario. Cree un archivo en codificación UTF-8, cárguelo en el servidor y reemplace action="form.php" con la ruta al archivo en su servidor.


Arroz. 2. Apariencia formularios predeterminados

Como puede ver en la figura, cada elemento del formulario tiene estilos de navegador predeterminados. Aclaremos los estilos y diseñemos los elementos del formulario.

Ajuste de formulario (ancho: 550 px; fondo: #ffd500; radio de borde: 20 px;) .form-wrap *(transición: .1s lineal) .profile (ancho: 240 px; flotador: izquierda; alineación de texto: centro; relleno : 30px; ) formulario (fondo: blanco; flotante: izquierda; ancho: calc(100% - 240px); relleno: 30px; radio de borde: 0 20px 20px 0; color: #7b7b7b; ) .form-wrap:after, formulario div:después ( contenido: ""; mostrar: tabla; borrar: ambos; ) formulario div (margen inferior: 15px; posición: relativa;) h1 (tamaño de fuente: 24px; peso de fuente: 400; posición: relativa ; margen superior: 50px; ) h1:después ( contenido: "\f138"; tamaño de fuente: 40px; familia de fuentes: FontAwesome; posición: absoluta; arriba: 50px; izquierda: 50%; transformar: traducirX(-50 %); ) /********************* estilo de elementos de formulario ********************* ** / etiqueta, intervalo (pantalla: bloque; tamaño de fuente: 14px; margen inferior: 8px;) entrada, entrada (ancho de borde: 0; contorno: ninguno; margen: 0; ancho: 100%; relleno: 10px 15px; fondo: #e6e6e6;) entrada:enfoque, entrada:enfoque (box-shadow: inset 0 0 0 2px rgba(0,0,0,.2); ) .radio etiqueta ( posición: relativa; relleno-izquierda: 50px; cursor: puntero; ancho: 50%; flotante: izquierda; altura de línea: 40px; ) .radio entrada ( posición: absoluta; opacidad: 0; ) .radio -control ( posición: absoluta; arriba: 0; izquierda: 0; altura: 40px; ancho: 40px; fondo: #e6e6e6; radio-borde: 50%; alineación de texto: centro; ) .male:before ( contenido: " \f222"; familia de fuentes: FontAwesome; peso de fuente: negrita; ) .female:before ( contenido: "\f221"; familia de fuentes: FontAwesome; peso de fuente: negrita; ) .etiqueta de radio: entrada flotante ~ . radiocontrol, .radiol input:focus ~ .radio-control ( box-shadow: inset 0 0 0 2px rgba(0,0,0,.2); ) .radio input:checked ~ .radio-control ( color: rojo;) seleccione (ancho: 100%; cursor: puntero; relleno: 10px 15px; contorno: 0; borde: 0; fondo: #e6e6e6; color: #7b7b7b; -apariencia-webkit: ninguno; /* desmarque webkit -browsers */ -moz-appearance: none; /*desmarcar en Mozilla Firefox*/ ) select::-ms-expand ( display: none; /*desmarcar en IE*/ ) .select-arrow ( posición: absoluta ;

Archivo formulario.php

Nota
En la variable $subject, especifique el texto que se mostrará como título de la carta;
Su_nombre: aquí puede especificar el nombre que se mostrará en el campo "de quién es la carta";
reemplace your_site_url con la dirección del sitio con el formulario de registro;
reemplace your_email con su dirección de correo electrónico;
$headers .= "CCO: tu_correo electrónico". "\r\n"; envía bcc a su dirección de correo electrónico.

Reg.ru: dominios y hosting

El mayor registrador y proveedor de alojamiento de Rusia.

Más de 2 millones de nombres de dominio en servicio.

Promoción, correo de dominio, soluciones empresariales.

Más de 700.000 clientes en todo el mundo ya han elegido.

*Pase el mouse sobre para pausar el desplazamiento.

Atrás Adelante

Creando un sistema simple de registro de usuarios en PHP y MySQL

Crear un sistema de registro es mucho trabajo. Debe escribir un código que valide las direcciones de correo electrónico, envíe un correo electrónico confirmando el registro y también valide otros campos del formulario y mucho más.

E incluso después de escribir todo esto, los usuarios se mostrarán reacios a registrarse, porque... esto requiere algo de esfuerzo de su parte.

En este tutorial, crearemos un muy sistema sencillo¡Registro que no requiere ni almacena contraseñas en absoluto! El resultado será fácil de modificar y agregar a un sitio PHP existente. ¿Quieres saber cómo funciona? Lea a continuación.



Así es como funcionará nuestro sistema súper simple:

Combinaremos el formulario de autorización y el registro. Este formulario tendrá un campo para ingresar su dirección de correo electrónico y un botón de registro;
- Al completar el campo con una dirección de correo electrónico, al hacer clic en el botón de registro se creará un registro sobre un nuevo usuario, pero solo si la dirección de correo electrónico ingresada no se encontró en la base de datos.

Después de esto, un azar conjunto único caracteres (token), que se envía al correo electrónico especificado por el usuario en forma de enlace que será relevante durante 10 minutos;
- El enlace lleva al usuario a nuestro sitio web. El sistema determina la presencia de un token y autoriza al usuario;

Ventajas de este enfoque:

No es necesario almacenar contraseñas ni validar campos;
- No es necesario recuperar tu contraseña, preguntas de seguridad, etc.;
- Desde el momento en que un usuario se registra/inicia sesión, siempre puedes estar seguro de que este usuario estará en tu zona de acceso (que la dirección de correo electrónico es verdadera);
- Proceso de registro increíblemente sencillo;

Defectos:

Seguridad de la cuenta de usuario. Si alguien tiene acceso al correo del usuario, puede iniciar sesión.
- El correo electrónico no es seguro y puede ser interceptado. Tenga en cuenta que esta pregunta también es relevante en el caso de que la contraseña se haya olvidado y sea necesario restaurarla, o en cualquier sistema de autorización que no utilice HTTPS para la transferencia de datos (inicio de sesión/contraseña);
- Hasta que lo configures según sea necesario servidor de correo, existe la posibilidad de que los mensajes con enlaces de autorización terminen en spam;

Comparando las ventajas y desventajas de nuestro sistema, podemos decir que el sistema tiene una alta usabilidad (máxima comodidad para el usuario final) y, al mismo tiempo, tiene un indicador de seguridad bajo.

Por lo que se sugiere utilizarlo para registros en foros y servicios que no funcionan con información importante.

Cómo utilizar este sistema

En caso de que sólo necesite utilizar un sistema para autorizar a los usuarios en su sitio y no quiera desglosar esta lección, esto es lo que debe hacer:

Necesitas descargar las fuentes adjuntas a la lección.
- Busque el archivo table.sql en el archivo. Importelo a su base de datos usando la opción de importación en phpMyAdmin. Manera alternativa: abra este archivo a través de editor de texto, copie la consulta SQL y ejecútela;
- Abra include/main.php y complete la configuración para conectarse con su base de datos (especifique el usuario y la contraseña para conectarse con la base de datos, así como el host y el nombre de la base de datos). En el mismo archivo también deberá especificar el correo electrónico, que se utilizará como dirección original para los mensajes enviados por el sistema. Algunos servidores bloquean los correos electrónicos salientes a menos que el formulario contenga una dirección de correo electrónico real, que fue creada desde el panel de control del servidor, así que proporcione una dirección real;
- Cargue todos los archivos y activos index.php, protected.php e incluye carpetas a través de FTP a su host;
- Agregue el siguiente código a cada página PHP donde desee mostrar el formulario de inicio de sesión;

Require_once "incluye/main.php"; $usuario = nuevo Usuario(); if(!$usuario->loggedIn())( redirigir("index.php"); )
- ¡Listo!

Para aquellos que estén interesados ​​en cómo funciona todo, ¡sigan leyendo a continuación!

El primer paso es escribir el código HTM del formulario de autorización. este codigo ubicado en el archivo index.php. Este archivo también contiene código PHP que procesa datos de formularios y otros características útiles sistemas de autorización. Puede obtener más información sobre esto en la siguiente sección sobre revisión PHP código.

index.php

Tutorial: Sistema de registro súper simple con PHP y MySQL Iniciar sesión o registrarse

Introduzca su dirección de correo electrónico arriba y le enviaremos
usted un enlace de inicio de sesión.

Iniciar sesión/Registrarse

En la sección principal (entre las etiquetas y) incluí los estilos principales (no se tratan en este tutorial, por lo que puedes verlos tú mismo. Carpeta activos/css/style.css). Antes de la etiqueta de cierre me conecté biblioteca jQuery y un archivo script.js, que escribiremos y analizaremos a continuación.


javascript

jQuery rastrea el estado del botón "Registrarse/Iniciar sesión" usando la función e.preventDefault() y envía solicitudes AJAX. Dependiendo de la respuesta del servidor, muestra uno u otro mensaje y determina acciones adicionales/

activos/js/script.js

$(función())( var form = $("#login-register"); form.on("enviar", función(e)( if(form.is(".loading, .loggedIn"))( return falso; ) var correo electrónico = form.find("input").val(), messageHolder = form.find("span"); $.post(this.action, (correo electrónico: correo electrónico), función (m)( if (m.error)( form.addClass("error"); messageHolder.text(m.message); ) else( form.removeClass("error").addClass("loggedIn"); messageHolder.text(m.message ) )); $(documento).ajaxStart(función())( formulario.addClass("cargando"); )); $(documento).ajaxComplete(función())( formulario. removeClass("cargando") ;

se agregó al formulario para mostrar el estado actual de la solicitud AJAX (esto fue posible gracias a los métodos ajaxInicio()) Y ajaxCompleto(), que puede encontrar hacia el final del archivo).

Esta clase muestra un archivo GIF animado giratorio (como para indicarnos que la solicitud se está procesando) y también actúa como una bandera para evitar que el formulario se envíe nuevamente (cuando ya se ha hecho clic una vez en el botón de registro). La clase .loggedIn es otro indicador: se establece cuando se envió el correo electrónico. Esta bandera bloquea inmediatamente cualquier acción adicional con el formulario.

Esquema de base de datos

Nuestro sistema de registro increíblemente simple utiliza 2 tablas MySQL (el código SQL está en el archivo table.sql). El primero almacena datos sobre cuentas de usuario. El segundo almacena información sobre la cantidad de intentos de inicio de sesión.


Esquema de la tabla de usuarios.

El sistema no utiliza contraseñas, como se puede observar en el diagrama. En él puede ver la columna de tokens con tokens adyacentes a la columna token_validity. El token se instala tan pronto como el usuario se conecta al sistema, configura su correo electrónico para enviar un mensaje (más sobre esto en siguiente bloque). La columna token_validity establece la hora 10 minutos después, después de la cual el token ya no es válido.


Esquema de tabla que cuenta el número de intentos de autorización.

En ambas tablas, la dirección IP se almacena en forma procesada, utilizando la función ip2long en un campo de tipo entero.

Ahora podemos escribir algo de código PHP. La funcionalidad principal del sistema está asignada a la clase User.class.php, que puedes ver a continuación.

Esta clase utiliza activamente idorm (docs), estas bibliotecas son las herramientas mínimas necesarias para trabajar con bases de datos. Maneja el acceso a la base de datos, la generación de tokens y la validación de tokens. Proporciona una interfaz sencilla que facilita la conexión de un sistema de registro a su sitio si utiliza PHP.

Usuario.clase.php

Usuario de clase( // ORM privado caso privado $orm; /** * Encuentre un usuario por token. Solo se aceptan tokens válidos para su consideración. El token se genera solo durante 10 minutos desde el momento en que se creó * @param string $token Este es el token que estamos buscando * @return Usuario. Devuelve el valor de la función Usuario */ función estática pública findByToken($token)( // busca el token en la base de datos y asegúrate de que esté configurada la marca de tiempo correcta $. resultado = ORM::for_table("reg_users") ->where ("token", $token) ->where_raw("token_validity > NOW()") ->find_one(); if(!$resultado)( return false; ) return new User($resultado) /** *); Autorizar o registrar un usuario * @param string $email Dirección de correo electrónico del usuario * @return User */ public static function loginOrRegister($email)( // Si dicho usuario ya existe, devuelve el valor de la función Usuario de la dirección de correo electrónico especificada almacenada en la base de datos if(User::exists($email))( return new User($email); ) // De lo contrario, crea un nuevo usuario en el base de datos y devolver el valor de la función User::create del correo electrónico especificado return User::create($email);

Los tokens se generan utilizando el algoritmo SHA1 y se almacenan en la base de datos. Estoy usando las funciones de sincronización de MySQL para establecer un límite de tiempo de 10 minutos para la validez de un token.

Cuando se valida un token, le decimos directamente al controlador que solo estamos considerando los tokens que aún no han caducado, almacenados en la columna token_validity.

Tenga en cuenta que estoy usando el método mágico. __conseguir biblioteca docs al final del archivo para interceptar el acceso a las propiedades del objeto Usuario.

Gracias a esto, es posible acceder a la información almacenada en la base de datos, gracias a las propiedades $usuario->email, $usuario->token, etc. En el siguiente fragmento de código, veremos cómo utilizar estas clases como ejemplo.


Página protegida

Otro archivo que almacena funcionalidades útiles y necesarias es el archivo funciones.php. Existen varios llamados ayudantes: funciones de asistente que le permiten crear código más limpio y legible en otros archivos.

funciones.php

Función send_email($from, $to, $subject, $message)( // Ayudante que envía correo electrónico $headers = "MIME-Version: 1.0" . "\r\n"; $headers .= "Tipo de contenido: texto /plain; charset=utf-8" . "\r\n"; $encabezados .= "De: ".$de . "\r\n"; return mail($a, $asunto, $mensaje, $encabezados ); ) function get_page_url())( // Determinar la URL del archivo PHP $url = "http".(empty($_SERVER["HTTPS"])?"":"s")."://" .$_SERVER ["SERVER_NAME"]; if(isset($_SERVER["REQUEST_URI"]) && $_SERVER["REQUEST_URI"] != "")( $url.= $_SERVER["REQUEST_URI"]; ) else( $url. = $_SERVER["PATH_INFO"]; ) return $url; function rate_limit($ip, $limit_hour = 20, $limit_10_min = 10)( // Número de intentos de inicio de sesión en la última hora para esta dirección IP $count_hour = ORM: :for_table("reg_login_attempt") ->where("ip", sprintf("%u", ip2long($ip))) ->where_raw("ts > SUBTIME(NOW(),"1:00" )") ->count(); // Número de intentos de inicio de sesión en los últimos 10 minutos para esta dirección IP $count_10_min = ORM::for_table("reg_login_attempt") ->where("ip", sprintf("%u" , ip2long($ ip))) ->where_raw("ts > SUBTIME(NOW(),"0:10")") ->count();

if($count_hour > $limit_hour || $count_10_min > $limit_10_min)( throw new Exception("¡Demasiados intentos de inicio de sesión!"); ) ) function rate_limit_tick($ip, $email)( // Crea un nuevo registro en la tabla eso cuenta el número de intentos de inicio de sesión $login_attempt = ORM::for_table("reg_login_attempt")->create(); $login_attempt->email = $login_attempt->ip = sprintf("%u", ip2long($ip; )); $login_attempt->save(); función redirigir($url)( encabezado("Ubicación: $url"); salir; ) Funciones límite_tasa Y tasa_limit_tick

monitorear el número de intentos de autorización durante el período de tiempo transcurrido desde el primer intento. El intento de inicio de sesión se registra en la base de datos en la columna reg_login_attempt. Estas funciones se llaman cuando los datos del formulario se procesan y envían, como puede ver en el siguiente fragmento de código.

index.php

El siguiente código se toma del archivo index.php y maneja el envío del formulario. Devuelve una respuesta JSON, que a su vez es procesada por jQuery en el archivo activos/js/script.js que vimos anteriormente. Try( if(!empty($_POST) && isset($_SERVER["HTTP_X_REQUESTED_WITH"]))( // Genera un encabezado JSON header("Content-type: application/json"); // ¿Esta dirección de correo electrónico es válida si (!isset($_POST["email"]) || !filter_var($_POST["email"], FILTER_VALIDATE_EMAIL))( throw new Exception("Ingrese un correo electrónico válido."); ) // Comprobar. usuario autorizado a iniciar sesión, ¿ha excedido el número de? (archivo funciones.php para más información) rate_limit($_SERVER["REMOTE_ADDR"]);

// Registra este intento de autorización rate_limit_tick($_SERVER["REMOTE_ADDR"], $_POST["email"]); // Enviar una carta al usuario $message = "";$correo electrónico = $_POST["correo electrónico"];

index.php

$subject = "Su enlace de inicio de sesión";

if(!User::exists($email))( $subject = "¡Gracias por registrarte!"; $message = "¡Gracias por registrarte en nuestro sitio!\n\n"; ) // Intenta autorizar o registrarte un usuario $usuario = Usuario::loginOrRegister($_POST["correo electrónico"]);

$message.= "Puedes iniciar sesión desde esta URL:\n";

$mensaje.= get_page_url()."?tkn=".$usuario->generateToken()."\n\n";

index.php

$message.= "El enlace caducará automáticamente después de 10 minutos.";

$resultado = send_email($fromEmail, $_POST["email"], $asunto, $mensaje); if(!$result)( throw new Exception("Hubo un error al enviar su correo electrónico. Inténtelo de nuevo."); ) die(json_encode(array("message" => "¡Gracias! Hemos enviado un enlace a su bandeja de entrada también revise su carpeta de correo no deseado."))); ) ) catch(Exception $e)( die(json_encode(array("error"=>1, "message" => $e->getMessage(). ))); Después de iniciar sesión/registrarse exitosamente, el código anterior enviará al usuario un enlace de inicio de sesión. El token está disponible porque se pasa como una variable en el enlace generado por el método

$_GET con marcador tkn.

index.php

If(isset($_GET["tkn"]))( // ¿Este token es válido para autorización? $user = User::findByToken($_GET["tkn"]); if($user)( // Sí, es. Redirigir a la página protegida $user->login(); redirigir("protected.php"); // No, el token no es válido. ).

Finalmente, aquí hay un fragmento de código que le permite proteger las páginas de su sitio y hacerlas accesibles solo después de la autorización.

protegido.php

// Para proteger cada página de su sitio, incluya un archivo main.php // y cree un nuevo objeto Usuario. ¡Así de fácil es! require_once "incluye/main.php"; $usuario = nuevo Usuario(); if(!$usuario->loggedIn())( redirigir("index.php"); )

Después de esta verificación, puede estar seguro de que el usuario fue autorizado exitosamente. También puede acceder a la información almacenada en la base de datos utilizando las propiedades del objeto. $usuario. Para mostrar el correo electrónico y el estado del usuario, utilice este código:

Haga eco de "Su correo electrónico: ".$usuario->correo electrónico; echo "Tu rango: ".$usuario->rank();

Método rango() se utiliza aquí porque la base de datos generalmente almacena números (0 para un usuario normal, 1 para un administrador) y necesitamos convertir estos datos en los estados a los que se relacionan, que es con lo que nos ayuda este método.

Para convertir a un usuario normal en administrador, simplemente edite la entrada del usuario a través de phpMyAdmin (o cualquier otro programa que le permita administrar bases de datos). El estado de administrador no otorga ningún privilegio; en este ejemplo, la página mostrará que usted es administrador, y eso es todo.

Pero qué hacer con esto queda a su discreción; usted mismo puede escribir y redactar código que establezca ciertos privilegios y capacidades para los administradores.

¡Hemos terminado!

¡Hemos terminado con esta forma increíblemente súper casi simple! Puedes usarlo en tus sitios PHP, es bastante simple. También puedes modificarlo tú mismo y hacerlo como quieras.

El material fue preparado por Denis Malyshok específicamente para el sitio web.

PD ¿Quieres avanzar más en el dominio de PHP y POO? Preste atención a las lecciones premium sobre varios aspectos creación de sitios web, incluida la programación en PHP, así como un curso gratuito sobre cómo crear su propio sistema CMS en PHP desde cero usando programación orientada a objetos:

¿Te gustó el material y quieres agradecerme?
¡Simplemente comparte con tus amigos y colegas!





Arriba