圖片驗證碼

時間 2019-11-29

標籤圖片驗證碼简体版

原文原文鏈接

1.首先建立一個web窗體，只使用後臺部分，生成驗證碼，並輸出圖片流跟圖片驗證碼的字符，在使用驗證碼的窗體中圖片控件直接指向這個窗體javascript

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)
    {
        //1、引用using System.Drawing;類
        //2、準備畫布
        Bitmap img = new Bitmap(60,30);
        //3、往圖片上畫驗證碼
        //一、準備繪製類，至關於鋪好畫布準備繪畫
        Graphics g = Graphics.FromImage(img);
        //二、準備繪畫的內容與工具
        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);//準備畫刷，括號裏寫顏色
        //三、繪製驗證碼
        g.DrawString(aa, f, b, 0, 0);

        //4、輸出驗證碼到頁面上
        img.Save(Response.OutputStream,System.Drawing.Imaging.ImageFormat.Png);//數據流，輸出格式
        
    }
}

2.圖片驗證碼界面，放一個文本框用來輸入驗證碼，放一個inage圖片控件用來顯示驗證碼，放一個按鈕用來點擊驗證碼的驗證事件，放一個label用來顯示驗證是否正確（圖片空間中圖片指向ImageUrl="~/YZM.aspx"）html

<%@ 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傳過來的值進行比對就能夠了java

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 = "驗證失敗！";
            }
        }
    }
    //驗證按鈕結束
}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。