用來向登錄頁面輸出驗證碼圖片的一般處理程序頁面

 這是自己以前做的B/S項目中的一個輸出驗證碼圖片的頁面，沒什么技術含量，希望高手們不要嘲笑，只是希望為需要幫助的人盡一點綿薄之力罷了！

 頁面簡介：該頁面是一個以ashx 為后綴的一般處理程序頁面，用於向登錄頁面輸出驗證碼圖片，驗證碼可以有數字和大小寫字母組成，是隨機產生的，具體的驗證碼長度可以自定義，輸出的驗證碼圖片可以有圖片邊框、背景噪音線和前景噪音點，當然了，具體的得根據個人的需求來選擇。

代碼如下：

<%@ WebHandler Language="C#" Class="VerificationCode" %>
using System;
using System.Drawing;
using System.IO;
using System.Web;
using System.Web.SessionState;

/// <summary>
/// VerificationCode類
/// </summary>
public class VerificationCode : IHttpHandler, IRequiresSessionState
{
    // Response對象
    HttpResponse Response = HttpContext.Current.Response;

    // 實現了IHttpHandler接口中的ProcessRequest方法
    public void ProcessRequest(HttpContext context)
    {
        // Session對象
        HttpSessionState Session = context.Session;
        CreateVerifyCodeImage((Session["VerifyCode"] =
            GeneratorVerifyCode(4)).ToString());
    }

    /// <summary>
    /// 隨機產生指定長度的驗證碼字符串
    /// </summary>
    /// <param name="codeCount">驗證碼字符的個數</param>
    /// <returns>驗證碼字符串</returns>
    private string GeneratorVerifyCode(int codeCount)
    {
        // 隨機產生的非負數
        int randomNumber;
        // 根據產生的隨機數，按一定規律得到的單個字符
        char singleCode;
        // 驗證碼字符串
        string verifyCode = String.Empty;
        Random random = new Random();
        for (int i = 0; i < codeCount; i++)
        {
            randomNumber = random.Next();
            //// 如果隨機數能夠整除3的情況
            if (randomNumber % 3 == 0)
            {
                // 產生一個'0'到'9'的字符
                singleCode = (char)('0' + randomNumber % 10);
            }
            else
            {

                if (randomNumber % 3 == 1)
                {
                    // 產生一個'A'到'Z'的字符
                    singleCode = (char)('A' + randomNumber % 26);
                }
                else
                {
                    // 產生一個'a'到'z'的字符
                    singleCode = (char)('a' + randomNumber % 26);
                }
            }
            verifyCode += singleCode.ToString();
        }
        return verifyCode;
    }

    /// <summary>
    /// 創建驗證碼圖片
    /// </summary>
    private void CreateVerifyCodeImage(string verifyCode)
    {
        if (string.IsNullOrEmpty(verifyCode))
        {
            return;
        }
        Bitmap image = new Bitmap(verifyCode.Length * 16, 27);
        Graphics g = Graphics.FromImage(image);
        Random random = new Random();
        // 清空驗證碼圖片的背景色
        g.Clear(Color.White);
        // 畫驗證碼圖片的背景噪音線
        for (int i = 0; i < 25; i++)
        {
            int x1 = random.Next(image.Width);
            int y1 = random.Next(image.Height);
            int x2 = random.Next(image.Width);
            int y2 = random.Next(image.Height);
            // 在驗證碼圖片上畫單條背景噪音線
            g.DrawLine(new Pen(Color.Silver), x1, y1, x2, y2);
        }

        // 畫驗證碼圖片
        Font font = new System.Drawing.Font("Arial", 15, (System.Drawing.FontStyle.Bold | System.Drawing.FontStyle.Italic));
        System.Drawing.Drawing2D.LinearGradientBrush brush = new System.Drawing.Drawing2D.LinearGradientBrush(new Rectangle(0, 0, image.Width, image.Height), Color.Blue, Color.DarkRed, 1.2f, true);
        g.DrawString(verifyCode, font, brush, 2, 2);

        // 畫驗證碼圖片的前景噪音點
        for (int i = 0; i < 100; i++)
        {
            int x = random.Next(image.Width);
            int y = random.Next(image.Height);
            image.SetPixel(x, y, Color.FromArgb(random.Next()));
        }

        // 畫驗證碼圖片的邊框線
        g.DrawRectangle(new Pen(Color.Silver), 0, 0, image.Width - 1, image.Height - 1);
        MemoryStream ms = new MemoryStream();
        // 將圖片保存到指定的流中
        image.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
        Response.ClearContent();
        Response.ContentType = "image/Jpeg";
        Response.BinaryWrite(ms.ToArray());
        g.Dispose();
        image.Dispose();
    }

    // 實現了IHttpHandler接口中的IsReusable屬性
    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

 在登錄頁面顯示該驗證碼的方式為: <img class='verifyImg' src=" VerificationCode.ashx " alt="單擊" />，這樣驗證碼圖片就顯示在你的登錄頁面上了！

 接下來，要做的事，不用我說大家都知道，肯定是要寫該圖片對象的單擊事件了，因為有時候，可能用戶看不清當前的驗證碼圖片上的文本，這時候就需要為用戶提供單擊驗證碼重新獲取驗證碼的功能了，好吧，現在我就來寫它的單擊事件吧！！！

 1 <script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
 2     <script type="text/javascript">
 3             // 驗證碼顯示框的click單擊事件
 4             $('.verifyImg').click(function () {
 6                 $(this).attr('src','Handler/ValidateCode.ashx?');
 9             });
10         });
11     </script>

 相信大家都已經試過了，第一次單擊驗證碼發現驗證碼變化了是不是很難掩飾內心的激動，第二次單擊時，突然發現驗證碼圖片沒有任何變化，是不是又讓大家很失望、十分失望、失望到了極點啊，呵呵，其實大家仔細想一想，就會明白，原來是緩存的緣故，因為驗證碼第一次單擊之時，驗證碼頁面沒有緩存，所以加載了Verification.ashx，產生了一個新的驗證碼，這時候頁面輸出的驗證碼圖片就會被緩存起來，當我們再次單擊的時候，驗證碼頁面就不會被重新加載，而是輸出第一次單擊所產生的驗證碼圖片，這就是為什么第二次單擊時，驗證碼圖片沒有改變的原因！其實要解決這樣的問題也很簡單，只要讓圖片對象每次單擊都指向不同的url地址即可，詳細請看如下代碼：

<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
    <script type="text/javascript">
           // 驗證碼顯示框的click單擊事件
            $('.verifyImg).click(function () {
              // 下面這種方式便可解決頁面緩存的問題，因為每次訪問的url地址都是變化的
                $(this).attr('src', 'Handler/VerificationCode.ashx?' + Math.random(1));
            });
        });
    </script>