1.首先创建一个web窗体,只使用后台部分,生成验证码,并输出图片流跟图片验证码的字符,在使用验证码的窗体中图片控件直接指向这个窗体
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Drawing; public partial class YZM : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { //一、引用using System.Drawing;类 //二、准备画布 Bitmap img = new Bitmap(60,30); //三、往图片上画验证码 //1、准备绘制类,相当于铺好画布准备绘画 Graphics g = Graphics.FromImage(img); //2、准备绘画的内容与工具 string all = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890";//验证内容 Random r = new Random();//实例化随机类 string aa = ""; for(int i=0;i<4;i++) { aa += all.Substring(r.Next(all.Length), 1);//随机截取字符组成验证码 } Session["YZM"] = aa;//验证的数据用session传过去,用来在验证码页面后台判断输入的验证码是否相符 Font f = new Font("微软雅黑",16);//字体格式 SolidBrush b = new SolidBrush(Color.Green);//准备画刷,括号里写颜色 //3、绘制验证码 g.DrawString(aa, f, b, 0, 0); //四、输出验证码到页面上 img.Save(Response.OutputStream,System.Drawing.Imaging.ImageFormat.Png);//数据流,输出格式 } }
2.图片验证码界面,放一个文本框用来输入验证码,放一个inage图片控件用来显示验证码,放一个按钮用来点击验证码的验证事件,放一个label用来显示验证是否正确(图片空间中图片指向ImageUrl="~/YZM.aspx")
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PMShtml.aspx.cs" Inherits="PMShtml" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> </head> <body> <form id="form1" runat="server"> <div> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><asp:Image ID="Image1" runat="server" ImageUrl="~/YZM.aspx" /><br /> <asp:Button ID="Button1" runat="server" Text="验证" /><asp:Label ID="Label1" runat="server" Text="" ForeColor="Red"></asp:Label> </div> </form> </body> </html> <script type="text/javascript"> //验证图片的点击事件,点击图片重新换一张图片 var bb = 0;//点击切换图片时因为图片指向同一个路径,每次点击都会就会相同,设置一个变量拼在传过来的aa后面,变量每次点击都会加1变化 document.getElementById("Image1").onclick = function () { this.setAttribute("src", "yzm.aspx?aa=" + bb ); bb++; } </script>
验证界面后台,只需要在验证按钮中获取输入的验证码,与session传过来的值进行比对就可以了
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class PMShtml : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { Button1.Click += Button1_Click;//验证按钮事件 } //验证按钮开始 void Button1_Click(object sender, EventArgs e) { if (Session["YZM"] != null) { if (TextBox1.Text == Session["YZM"].ToString()) { Label1.Text = "验证成功!"; } else { Label1.Text = "验证失败!"; } } } //验证按钮结束 }