Formulario de Contacto con Recaptcha Asp.Net

jueves, 19 de julio de 2012

Siempre que desarrollamos una aplicacion web algo que nunca debe faltar es un formulario de contacto para que los usuarios que visitan o usan nuestra aplicacion web puedan ponerse en contacto con nosotros.

Pues bien ahora veremos como hacer un formulario de contacto en asp.net y ademas le agregaremos recaptcha para evitar spam.

Aspectos a considerar
El ejemplo esta desarrollado en visual estudio 2010 con c# y vb.net
Tener una cuenta de correo gmail(que sera donde recibirás los mensajes).

Lo primero sera descargar la librería de recaptcha para asp.net (el ejemplo ya incluirá la librería).

El diseño de nuestro formulario de contacto sera el siguiente(lo pueden personalizar como quieran)

Diseño


Como pueden observar el formulario tiene 4 textbox que ademas están validados con los controles de validación para que el usuario rellene todos los datos e ingrese un correo valido, también tiene el control recaptcha, tenemos un botón y abajo del botón tenemos un label que nos servirá para mostrar un mensaje al usuario para que sepa si se envió o no el mensaje.

Ahora en nuestro web.config tendremos que agregar lo siguiente.











Lo que hacemos es agregar los datos de nuestro servidor de correo en este caso utilizamos smtp de gmail, lo que esta en mayúscula lo tienen que remplazar por sus credencias(correo y password) de gmail lo medas no lo toquen.

Ahora nos vamos al código de nuestro formulario y empezamos a programar, creemos los siguientes métodos.
private void Limpiar()
{
txttitulo.Text = "";
txtnombre.Text = "";
txtcorreo.Text = "";
txtmensaje.Text = "";
lblaviso.Text = "";
}

private void Enviar(string titulo, string nombre, string correo, string mensaje)
{

if (Page.IsValid)
{
string to = ConfigurationManager.AppSettings["To"];
MailMessage mail = new MailMessage();
mail.To.Add(new MailAddress(to));
mail.From = new MailAddress(correo, nombre);
mail.Subject = titulo + " " + correo;
mail.Body = mensaje + "\n\n" + nombre + "\n" + correo;

SmtpClient smtp = new SmtpClient();
smtp.Send(mail);

Limpiar();
lblaviso.Text = "Mensaje Enviado gracias por tomarse el tiempo de escribir...!";
}
else
{
lblaviso.Text = "No has escrito correctamente el codigo de verificacion";

}
}

    Private Sub Limpiar()
txttitulo.Text = ""
txtnombre.Text = ""
txtcorreo.Text = ""
lblaviso.Text = ""
End Sub
Private Sub Enviar(ByVal titulo As String, ByVal nombre As String, ByVal correo As String, ByVal mensaje As String)
If (Page.IsValid) Then
Dim t As String = ConfigurationManager.AppSettings("To")
Dim mail As New MailMessage()
mail.To.Add(New MailAddress(t))
mail.From = New MailAddress(correo, nombre)
mail.Subject = titulo + " " + correo
mail.Body = mensaje + vbLf & vbLf + nombre + vbLf + correo

Dim smtp As New SmtpClient()
smtp.Send(mail)

Limpiar()
lblaviso.Text = "Mensaje Enviado gracias por tomarse el tiempo de escribir...!"
Else
lblaviso.Text = "No has escrito correctamente el codigo de verificacion"
End If
End Sub

El primer método Limpiar lo único que ara es limpiar los textbox.
El método Enviar es el que nos servirá para enviar el mensaje podemos ver que recibe 4 parámetros que son los que necesitamos para que se envié el mensaje, luego comprobamos que la pagina se valide correctamente y dentro leemos los datos del web.config y armamos el correo haciendo uso de la clase MailMessage y luego enviamos el correo usando la clase SmtpClient y mostramos los mensajes que el mensaje se envió correctamente, y si la pagina no se valida correctamente mostramos mensajes que no se pudo enviar el correo mensaje.

Por ultimo dentro del evento click del botón hacemos lo siguiente.
Enviar(txttitulo.Text,txtnombre.Text,txtcorreo.Text,txtmensaje.Text);

Enviar(txttitulo.Text, txtnombre.Text, txtcorreo.Text, txtmensaje.Text)

Lo único que hacemos es llamar al método Enviar y le pasamos los datos correspondientes.

Captura

Captura


Eso seria todo por ahora espero les sirva a alguien saludos desde El Salvador.

Descargar Proyecto C#

Descargar Proyecto VB.Net

2 comentarios:

Publicar un comentario en la entrada

Nota: solo los miembros de este blog pueden publicar comentarios.