MVC 验证码实现( 简易版)

现在网站上越来越多的验证码,使用场景也是越来越多,登陆、注册、上传、下载。。。等等地方,都有可能大量使用到验证码,那么制作验证码到底有多简单呢?我们一起来看下最简易版的验证码实现过程~

验证码的基本步骤

添加一个控制器

1.在MVC框架中,则需添加一个控制器,代码如下

 1   /// <summary>
 2         /// 验证码
 3         /// </summary>
 4         public ContentResult CheckCode()
 5         {
 6             ContentResult cr = new ContentResult();
 7             cr.ContentType = "image/JPEG";//定义图片类型
 8             Random r = new Random();
 9             string code = r.Next(1000, 9999).ToString();//取随机数
10             Session["check"] = code;
11             Bitmap map = new Bitmap(60, 30);//定义大小
12             Graphics g = Graphics.FromImage(map);//画图
13             g.FillRectangle(Brushes.White, 1, 1, 58, 28);//定义矩形
14             g.DrawString(code, new Font("微软雅黑", 16), Brushes.Black, new PointF(1, 1));//向矩形中绘入文字以及定义字体和大小
15             for (int i = 0; i < 300; i++)
16             {
17                 map.SetPixel(r.Next(1, 58), r.Next(1, 28), Color.Gray);
18             }
19             map.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);//保存到流中
20             return cr;
21         }

页面

前端页面代码也简单,这里我做示范直接在Home里面写

1 <p>MVC验证码示例</p>
2 <div>
3     <p><img src="Home/CheckCode" alt="看不清,切换图片" onclick="Change(this)" style="cursor:pointer;" /></p>
4 </div>

JS控制

1 <script type="text/javascript">
2     function Change(node) {
3         node.src = "/Home/CheckCode?id=" + new Date();
4     }
5 </script>

效果

 

posted @ 2016-10-25 14:14  潇十一郎  阅读(689)  评论(0编辑  收藏  举报