漂亮验证码基于Asp.net与jquery.cookie.js验证码

最新推荐文章于 2025-06-15 21:38:12 发布

ymnets

最新推荐文章于 2025-06-15 21:38:12 发布

阅读量3.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： JQuery Javascript 文章标签： asp.net random string fonts image graph

本文链接：https://blog.youkuaiyun.com/ymnets/article/details/7619443

Javascript 同时被 2 个专栏收录

6 篇文章

订阅专栏

JQuery

4 篇文章

订阅专栏

本文介绍了一种基于 ASP.NET 的验证码生成方法，利用 Cookie 存储验证码内容避免服务器资源消耗。通过 C# 代码实现验证码图片的绘制，包括随机字符生成、背景噪音线与点、扭曲效果等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先看效果图吧！无图无真相

效果不错吧，还可以吧！

第一：基于Cookie不占用服务器资源

第二：CS代码清晰，随时修改验证码的个数及生成颜色等操作

先见ValidateCode.aspx代码

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ValidateCode.aspx.cs" Inherits="Web.Admin.ValidateCode.ValidateCode" %>

再见ValidateCode.aspx.cs代码

using System;
using System.Collections.Generic;

using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Drawing;
using System.IO;
using System.Drawing.Imaging;

namespace Web.Admin.ValidateCode
{
    public partial class ValidateCode : System.Web.UI.Page
    {
        private int letterWidth = 15;//单个字体的宽度范围
        private int letterHeight = 27;//单个字体的高度范围
        private int letterCount = 5;//验证码位数
        private char[] chars = "0123456789QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm".ToCharArray();
        private string[] fonts = { "Arial", "Georgia" };
        /// <summary>
        /// 产生波形滤镜效果
        /// </summary>
        private const double PI = 3.1415926535897932384626433832795;
        private const double PI2 = 6.283185307179586476925286766559;
        protected void Page_Load(object sender, EventArgs e)
        {
            //防止网页后退--禁止缓存    
            Response.Expires = 0;
            Response.Buffer = true;
            Response.ExpiresAbsolute = DateTime.Now.AddSeconds(-1);
            Response.AddHeader("pragma", "no-cache");
            Response.CacheControl = "no-cache";
            string str_ValidateCode = GetRandomNumberString(letterCount);
            HttpCookie objCookie = new HttpCookie("ValidateCode");
            objCookie.Value = str_ValidateCode.ToLower();
            objCookie.Path = "/";
            objCookie.Expires = DateTime.Now.AddSeconds(1200);
            Response.Cookies.Add(objCookie);
            CreateImage(str_ValidateCode);

        }
        public void CreateImage(string checkCode)
        {
            int int_ImageWidth = checkCode.Length * letterWidth+5;
            Random newRandom = new Random();
            Bitmap image = new Bitmap(int_ImageWidth, letterHeight);
            Graphics g = Graphics.FromImage(image);
            //生成随机生成器
            Random random = new Random();
            //白色背景
            g.Clear(Color.White);
            //画图片的背景噪音线
            for (int i = 0; i < 10; i++)
            {
                int x1 = random.Next(image.Width);
                int x2 = random.Next(image.Width);
                int y1 = random.Next(image.Height);
                int y2 = random.Next(image.Height);

                g.DrawLine(new Pen(Color.Silver), x1, y1, x2, y2);
            }

            //画图片的前景噪音点
            for (int i = 0; i < 10; i++)
            {
                int x = random.Next(image.Width);
                int y = random.Next(image.Height);

                image.SetPixel(x, y, Color.FromArgb(random.Next()));
            }
            //随机字体和颜色的验证码字符

            int findex;
            for (int int_index = 0; int_index < checkCode.Length; int_index++)
            {
                findex = newRandom.Next(fonts.Length - 1);
                string str_char = checkCode.Substring(int_index, 1);
                Brush newBrush = new SolidBrush(GetRandomColor());
                Point thePos = new Point(int_index * letterWidth + 1 + newRandom.Next(3), 1 + newRandom.Next(3));//5+1+a+s+p+x
                g.DrawString(str_char, new Font(fonts[findex], 14, FontStyle.Bold), newBrush, thePos);
            }
            //灰色边框
            g.DrawRectangle(new Pen(Color.LightGray, 1), 0, 0, int_ImageWidth - 1, (letterHeight - 1));
            //图片扭曲
            //image = TwistImage(image, true, 3, 4);
            //将生成的图片发回客户端
            MemoryStream ms = new MemoryStream();
            image.Save(ms, ImageFormat.Png);
            Response.ClearContent(); //需要输出图象信息 要修改HTTP头 
            Response.ContentType = "image/Png";
            Response.BinaryWrite(ms.ToArray());
            g.Dispose();
            image.Dispose();
        }
        /// <summary>
        /// 正弦曲线Wave扭曲图片
        /// </summary>
        /// <param name="srcBmp">图片路径</param>
        /// <param name="bXDir">如果扭曲则选择为True</param>
        /// <param name="nMultValue">波形的幅度倍数，越大扭曲的程度越高，一般为3</param>
        /// <param name="dPhase">波形的起始相位，取值区间[0-2*PI)</param>
        /// <returns></returns>
        public System.Drawing.Bitmap TwistImage(Bitmap srcBmp, bool bXDir, double dMultValue, double dPhase)
        {
            System.Drawing.Bitmap destBmp = new Bitmap(srcBmp.Width, srcBmp.Height);

            // 将位图背景填充为白色
            System.Drawing.Graphics graph = System.Drawing.Graphics.FromImage(destBmp);

            graph.FillRectangle(new SolidBrush(System.Drawing.Color.White), 0, 0, destBmp.Width, destBmp.Height);

            graph.Dispose();

            double dBaseAxisLen = bXDir ? (double)destBmp.Height : (double)destBmp.Width;

            for (int i = 0; i < destBmp.Width; i++)
            {
                for (int j = 0; j < destBmp.Height; j++)
                {
                    double dx = 0;

                    dx = bXDir ? (PI2 * (double)j) / dBaseAxisLen : (PI2 * (double)i) / dBaseAxisLen;

                    dx += dPhase;

                    double dy = Math.Sin(dx);

                    // 取得当前点的颜色
                    int nOldX = 0, nOldY = 0;

                    nOldX = bXDir ? i + (int)(dy * dMultValue) : i;

                    nOldY = bXDir ? j : j + (int)(dy * dMultValue);

                    System.Drawing.Color color = srcBmp.GetPixel(i, j);
                    if (nOldX >= 0 && nOldX < destBmp.Width && nOldY >= 0 && nOldY < destBmp.Height)
                    {
                        destBmp.SetPixel(nOldX, nOldY, color);
                    }
                }
            }
            return destBmp;
        }
        public Color GetRandomColor()
        {
            Random RandomNum_First = new Random((int)DateTime.Now.Ticks);
            System.Threading.Thread.Sleep(RandomNum_First.Next(50));
            Random RandomNum_Sencond = new Random((int)DateTime.Now.Ticks);
            int int_Red = RandomNum_First.Next(210);
            int int_Green = RandomNum_Sencond.Next(180);
            int int_Blue = (int_Red + int_Green > 300) ? 0 : 400 - int_Red - int_Green;
            int_Blue = (int_Blue > 255) ? 255 : int_Blue;
             return Color.FromArgb(int_Red, int_Green, int_Blue);
        }
        //  生成随机数字字符串
        public string GetRandomNumberString(int int_NumberLength)
        {
            Random random = new Random();
            string validateCode = string.Empty;
            for (int i = 0; i < int_NumberLength; i++)
                validateCode += chars[random.Next(0, chars.Length)].ToString();
            return validateCode;
        }
        
    }
}

调用：

asp.net HTML调用

<p><label for="login">
                        验证码</label><br />
                        <input id="authcode" type="text"  maxlength="5" />
                        
                <img id="authImg"  onclick="this.src=this.src+?" src="ValidateCode/ValidateCode.aspx" align="absmiddle" style="cursor: pointer" alt="看不清楚，换一张" title="看不清楚，换一张" />
                </p>

由于是是用jquery.cookie.js来读取的（需要引入jquery.cookie.js）百度一下就有

下面也用jquery框架来辅助对比（大家一看就明白）

用js用asp.net获取cookie都同样可获得到

if ($("#authcode").val().toLowerCase() != $.cookie("ValidateCode")) {
      alert(验证码错误或已经过期);

      return;
    }