因作業中驗證碼有漏洞，需要進行改造，百度了很多，然后不是這個問題就那個問題，
1，驗證碼圖片生成這里借鑒了https://blog.csdn.net/z10668107/article/details/103074267這個老哥的，ashx代碼如下
using System; using System.Collections.Generic; using System.Drawing; using System.Drawing.Imaging; using System.Text; using System.Web; namespace YiSoft.Web.cn2016.mobile { /// <summary> /// ImageCodeHandler 圖片驗證碼 /// </summary> public class ImageCodeHandler : IHttpHandler, System.Web.SessionState.IRequiresSessionState { public void ProcessRequest(HttpContext context) { bool isCreate = true; //創建時間初始化，在頁面重繪的時候重新獲得新的驗證碼 context.Session["CreateTime"] = null; if (context.Session["CreateTime"] == null) { context.Session["CreateTime"] = DateTime.Now; } else { DateTime startTime = Convert.ToDateTime(context.Session["CreateTime"]); DateTime endTime = Convert.ToDateTime(DateTime.Now); TimeSpan ts = endTime - startTime; // 超時則獲得新的驗證碼 if (ts.Minutes > 15) { isCreate = true; context.Session["CreateTime"] = DateTime.Now; } else { isCreate = false; } } context.Response.ContentType = "image/gif"; //繪制圖象 Bitmap basemap = new Bitmap(200, 60); Graphics graph = Graphics.FromImage(basemap); graph.FillRectangle(new SolidBrush(Color.White), 0, 0, 200, 60); Font font = new Font(FontFamily.GenericSerif, 48, FontStyle.Bold, GraphicsUnit.Pixel); Random r = new Random(); //會出現的字符，需要的可以加上字母 ：ABCDEFGHIJKLMNPQRSTUVWXYZabcdefghijklmnpqrstuvwxyz0123456789 string letters = "0123456789"; string letter; StringBuilder s = new StringBuilder(); if (isCreate) { // 隨機生成4個字母或者數字 for (int x = 0; x < 4; x++) { letter = letters.Substring(r.Next(0, letters.Length - 1), 1); s.Append(letter); // 繪制文字 graph.DrawString(letter, font, new SolidBrush(Color.Black), x * 38, r.Next(0, 15)); } } else { // 創建失敗則繪制先前存在的驗證碼 string currentCode = context.Session["ValidateCode"].ToString(); s.Append(currentCode); foreach (char item in currentCode) { letter = item.ToString(); // 繪制文字 graph.DrawString(letter, font, new SolidBrush(Color.Black), currentCode.IndexOf(item) * 38, r.Next(0, 15)); } } // 混淆背景 Pen linePen = new Pen(new SolidBrush(Color.Black), 2); for (int x = 0; x < 10; x++) { graph.DrawLine(linePen, new Point(r.Next(0, 199), r.Next(0, 59)), new Point(r.Next(0, 199), r.Next(0, 59))); } // 保存圖片 basemap.Save(context.Response.OutputStream, ImageFormat.Gif); // 傳遞驗證碼的值 context.Session["ValidateCode"] = s.ToString(); context.Response.End(); } public bool IsReusable { get { return false; } } } }
2，在html頁面參考，我這里把圖片存在另一個頁面，因為點擊圖片要重繪驗證碼，為了不重繪整個頁面，如果直接在頁面引入的話重繪驗證碼整個頁面都會重繪，不太友好，還有就是后臺生成的驗證碼是存入session的，我這里不這樣引入就不能保持session屬于同一個會話，一定還有更好的解決方式，，，
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <link rel="stylesheet" href=https://www.cnblogs.com/ljmm/p/"../cn2019/css/purchase.css" /> <link rel="stylesheet" href=https://www.cnblogs.com/ljmm/p/"../cn2019/css/footer.css" /> <style> body{ background:#fff } #form1 > div > input{ height: 30px; width: 100px; float: right; } </style> <script> function relo() { location.reload(); } </script> </head> <body> <div class=""> <div class="main"> <form id="form1" runat="server"> <div> <asp:ImageButton ID="img_validCode" ImageUrl="../cn2016/mobile/ImageCodeHandler.ashx" runat="server"/> </div> </form> </div> </div> </body> </html>
3，在需要的頁面加入
<iframe name="myFrame" style="width: 100px;height:30px;" src=https://www.cnblogs.com/ljmm/p/"../cn2019/yzm.html" frameborder="0"></iframe>
4，頁面最終效果，點擊數字就能重繪驗證碼
5，驗證碼在后臺進行校驗，如果驗證碼輸入錯誤，在提示后呼叫：myFrame.window.relo()進行頁面驗證碼重繪，myFrame是引入圖片時自定義的一個name值，relo()是自定義的一個重繪當前頁面方法，在yzm.html頁面，呼叫失敗請聯系前端~~~
6，后臺校驗代碼，從session取出驗證碼，介面使用session需要繼承System.Web.UI.Page和 IReadOnlySessionState
String code = Session["ValidateCode"].ToString().ToLower();
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/40659.html
標籤：C#
下一篇：C#實作FTP上傳資料