我们在项目中的NewWeb.Common类库里面建立一个类用来存放生成验证码的代码。
这里我类的名字叫 ValidateCode
生成验证码(ValidateCode)类的代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
|
using System; using System.Collections.Generic; using System.Drawing; using System.Drawing.Drawing2D; using System.Drawing.Imaging; using System.IO; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Web; namespace NewWeb.Common { public class ValidateCode { public ValidateCode() { } /// <summary> /// 验证码的最大长度 /// </summary> public int MaxLength { get { return 10; } } /// <summary> /// 验证码的最小长度 /// </summary> public int MinLength { get { return 1; } } /// <summary> /// 生成验证码 /// </summary> /// <param name="length">指定验证码的长度</param> /// <returns></returns> public string CreateValidateCode( int length) { int [] randMembers = new int [length]; int [] validateNums = new int [length]; string validateNumberStr = "" ; //生成起始序列值 int seekSeek = unchecked (( int )DateTime.Now.Ticks); Random seekRand = new Random(seekSeek); int beginSeek = ( int )seekRand.Next(0, Int32.MaxValue - length * 10000); int [] seeks = new int [length]; for ( int i = 0; i < length; i++) { beginSeek += 10000; seeks[i] = beginSeek; } //生成随机数字 for ( int i = 0; i < length; i++) { Random rand = new Random(seeks[i]); int pownum = 1 * ( int )Math.Pow(10, length); randMembers[i] = rand.Next(pownum, Int32.MaxValue); } //抽取随机数字 for ( int i = 0; i < length; i++) { string numStr = randMembers[i].ToString(); int numLength = numStr.Length; Random rand = new Random(); int numPosition = rand.Next(0, numLength - 1); validateNums[i] = Int32.Parse(numStr.Substring(numPosition, 1)); } //生成验证码 for ( int i = 0; i < length; i++) { validateNumberStr += validateNums[i].ToString(); } return validateNumberStr; } /// <summary> /// 创建验证码的图片 /// </summary> /// <param name="context">要输出到的page对象</param> /// <param name="validateNum">验证码</param> public void CreateValidateGraphic( string validateCode, HttpContext context) { Bitmap image = new Bitmap(( int )Math.Ceiling(validateCode.Length * 12.0), 22); Graphics g = Graphics.FromImage(image); try { //生成随机生成器 Random random = new Random(); //清空图片背景色 g.Clear(Color.White); //画图片的干扰线 for ( int i = 0; i < 25; 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); } Font font = new Font( "Arial" , 12, (FontStyle.Bold | FontStyle.Italic)); LinearGradientBrush brush = new LinearGradientBrush( new Rectangle(0, 0, image.Width, image.Height), Color.Blue, Color.DarkRed, 1.2f, true ); g.DrawString(validateCode, font, brush, 3, 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 stream = new MemoryStream(); image.Save(stream, ImageFormat.Jpeg); //输出图片流 context.Response.Clear(); context.Response.ContentType = "image/jpeg" ; context.Response.BinaryWrite(stream.ToArray()); } finally { g.Dispose(); image.Dispose(); } } /// <summary> /// 得到验证码图片的长度 /// </summary> /// <param name="validateNumLength">验证码的长度</param> /// <returns></returns> public static int GetImageWidth( int validateNumLength) { return ( int )(validateNumLength * 12.0); } /// <summary> /// 得到验证码的高度 /// </summary> /// <returns></returns> public static double GetImageHeight() { return 22.5; } //C# MVC 升级版 /// <summary> /// 创建验证码的图片 /// </summary> /// <param name="containsPage">要输出到的page对象</param> /// <param name="validateNum">验证码</param> public byte [] CreateValidateGraphic( string validateCode) { Bitmap image = new Bitmap(( int )Math.Ceiling(validateCode.Length * 12.0), 22); Graphics g = Graphics.FromImage(image); try { //生成随机生成器 Random random = new Random(); //清空图片背景色 g.Clear(Color.White); //画图片的干扰线 for ( int i = 0; i < 25; 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); } Font font = new Font( "Arial" , 12, (FontStyle.Bold | FontStyle.Italic)); LinearGradientBrush brush = new LinearGradientBrush( new Rectangle(0, 0, image.Width, image.Height), Color.Blue, Color.DarkRed, 1.2f, true ); g.DrawString(validateCode, font, brush, 3, 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 stream = new MemoryStream(); image.Save(stream, ImageFormat.Jpeg); //输出图片流 return stream.ToArray(); } finally { g.Dispose(); image.Dispose(); } } } } |
这时需要在程序中引入两个命名空间 System.Drawing和System.Web。
完成之后到LoginController控制器里面去新建一个ActionResult 就叫ValidateCode 用于生成验证码。(这里要先对NewWeb.Common引用)
生成验证码代码如下:
1
2
3
4
5
6
7
8
|
public ActionResult ValidateCode() { Common.ValidateCode validateCode = new Common.ValidateCode(); string code = validateCode.CreateValidateCode(4); //生成的验证码4个长度 Session[ "validateCode" ] = code; byte [] buffer = validateCode.CreateValidateGraphic(code); //创建验证码图片 return File(buffer, "image/jpeg" ); //返回图片 } |
到Login视图里面的index页面去把img的src补充为:
1
2
3
4
5
|
< tr > < td style = "width:20px" ></ td > < td >< img id = "image" src = "/Login/ValidateCode/?id=1" style = "float: left; height: 24px;" /></ td > < td >< a href = "javascript:void(0)" onclick = "changeCheckCode();return false;" >看不清,换一张</ a ></ td > </ tr > |
就可以看到页面上面显示出来验证码
下面要做的就是点击切换验证码,这是通过js实现的代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
<script type= "text/javascript" > $( function () { initWin(); //初始化登录窗体 changeCheckCode(); //切换验证码 }); function initWin() { $( "#win" ).window({ title: "登录" , width: 400, height: 270, collapsible: false , minimizable: false , maximizable: false , closable: false , modal: true , resizable: false , }); } //切换验证码 function changeCheckCode() { $( "#changeVcode" ).click( function () { $( "#image" ).attr( "src" , $( "#image" ).attr( "src" ) + 1); }); } </script> |
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。