一般处理程序生成简单的图片验证码并通过html验证用户输入的验证码是否正确
一般处理程序生成简单的图片验证码并通过html验证用户输入的验证码是否正确
最近没事研究了下验证码的的动态生成及通过cookie实现HTML页面对用户输入的验证码的校验,简要如下:
1、写了一个简单的验证码后台生成页面,代码如下:
using System;
using System.Collections.Generic;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Web;
using System.Drawing.Imaging;
namespace Asp.Net的学习
{
/// <summary>
/// ValidateImg 的摘要说明
/// </summary>
public class ValidateImg : IHttpHandler
{
//需要随机生成的字符
char[] chars = null;
Random ran = new Random();
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "image/jpeg";
//实例化需要随机产生的字符数组
chars = new char[10] { 'a','B','D','f','R','I','L','1','7','9'};
//获得随机生成的字符串
string s = GetRandomStr(5);
//定义一个画布对象,来实现验证码图片的画画
using (Image img = new Bitmap(90, 35))
{
using (Graphics g = Graphics.FromImage(img))
{
//清除白色背景
g.Clear(Color.White);
//画一个边框
g.DrawRectangle(new Pen(Brushes.Black),new Rectangle(0,0,img.Width-1,img.Height-1));
//画干扰线或者点
g.DrawString(s, new Font("微软雅黑", 14), Brushes.Red, 2, 5);
//画干扰线
DrawGanRao(g, 150, img);
}
//将img图片画到页面上来,以jepg的格式画
img.Save(context.Response.OutputStream, ImageFormat.Jpeg);
HttpCookie cookie = new HttpCookie("code", s);
context.Response.Cookies.Add(cookie);
context.Response.Write("testaa");
//测试cookie
//context.Response.Cookies.Add(new HttpCookie("test","wahah"));
}
}
#region 产生随机字符串
private string GetRandomStr(int count)
{
StringBuilder sb = new StringBuilder(5);
for (int i = 0; i < count; i++)
{
//得到随机数
int index = ran.Next(chars.Length);
sb.Append(chars[index]);
}
return sb.ToString();
}
#endregion
#region 画干扰点
/// <summary>
/// 画干扰点
/// </summary>
/// <param name="g">画布</param>
/// <param name="count">干扰点的数目</param>
private void DrawGanRao(Graphics g,int count,Image img)
{
for (int i = 0; i < count; i++)
{
Point p1 = new Point(ran.Next(img.Width-1), ran.Next(img.Height-1));
Point p2 = new Point(p1.X-3,p1.Y-3);
g.DrawLine(new Pen(Brushes.Blue), p1, p2);
}
}
#endregion
public bool IsReusable
{
get
{
return false;
}
}
}
}
2、前台的html代码如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>登陆界面</title>
<script type="text/javascript">
window.onload = function () {
//加载cookie
loadCookie();
//加载提交事件的方法
getDom("btnLogin").onclick = function () {
//重新加载cookie
loadCookie();
//获取图片验证码
var hidCode = getDom("hidCode").value.toLowerCase();
//判断当前用户输入的验证码和图片中的验证码是否一致,不一致则提示
var validCode = getDom("txtValidCode").value.toLowerCase();
if (validCode != hidCode) {
alert("验证码错误!请重新输入!")
}
else {
alert("验证码输入正确!");
}
}
//刷新验证码第一版本(采用url地址随时变化来刷新)
getDom("imgCode").onclick = function () {
this.src = "ValidateImg.ashx?time=" + new Date().toString();
//注意加载cookie页面不能放在这个位置,否则获取到的后台的验证码字符串就不是最新的了
//loadCookie();
}
}
function changeImg()
{
getDom("imgCode").src = "ValidateImg.ashx?time=" + new Date().toString();
}
//获得当前页面的cookie并加载到页面的隐藏域中
function loadCookie()
{
//获得当前cookie键值对的形式
var cookies = document.cookie;
var arrCookies = cookies.split(';');
for (var i = 0; i < arrCookies.length; i++) {
//遍历cookies
var arr = arrCookies[i].split('=');
if (arr[0] == "code") {
//将当前找到的cookie里面的验证码的值加到隐藏域中
getDom("hidCode").value = arr[1];
}
}
}
//获取dom的方法
function getDom(domId)
{
return document.getElementById(domId);
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td>用户名:</td>
<td><input type="text" name="txtUserName" /></td>
<td></td>
</tr>
<tr>
<td>密 码:</td>
<td><input type="password" name="txtPwd" /></td>
<td></td>
</tr>
<tr>
<td>验证码:</td>
<td><input type="text" name="txtValidCode" /></td>
<td><img src="ValidateImg.ashx" alt="单击刷新" id="imgCode" /><a href="javascript:changeImg();" id="reflush" >单击刷新</a></td>
</tr>
<tr>
<td colspan="3">
<input type="button" value="登陆" id="btnLogin" />
</td>
</tr>
</table>
<input type="hidden" id="hidCode" />
</form>
</body>
</html>
以上是用js实现的验证,菜鸟学习用哈哈
一般处理程序生成简单的图片验证码并通过html验证用户输入的验证码是否正确的更多相关文章
- 使用SpringSecurity3用户验证(异常信息,验证码)
1. 自定义user-service后,封装自定义异常信息返回 通常情况下,抛UsernameNotFoundException异常信息是捕捉不了,跟踪源码后发现 try { user = retri ...
- .NET Core实战项目之CMS 第十六章 用户登录及验证码功能实现
前面为了方便我们只是简单实现了基本业务功能的增删改查,但是登录功能还没有实现,而登录又是系统所必须的,得益于 ASP.NET Core的可扩展性因此我们很容易实现我们的登录功能.今天我将带着大家一起来 ...
- 获取验证码随机字符串@return string $captcha,随机验证码文字
<?php//验证码工具类class Captcha{//属性private $width;private $height;private $fontsize;private $pixes;pr ...
- Expression Blend4经验分享:制作一个简单的图片按钮样式
这次分享如何做一个简单的图片按钮经验 在我的个人Silverlight网页上,有个Iphone手机的效果,其中用到大量的图片按钮 http://raimon.6.gwidc.com/Iphone/de ...
- jquery简单的图片切换效果,支持pc端、移动端的banner图片切换开发
详细内容请点击 无意中看见了两年前写的一个图片切换,那会儿刚刚学习网页制作,可以说是我的第一个处女座的jquery图片切换效果.无聊之余对它的宽度稍稍做了一下修改,变成了支持pc端.手机端全屏的ban ...
- Objective-C ,ios,iphone开发基础:快速实现一个简单的图片查看器
新建一个single view 工程: 关闭ARC , 在.xib视图文件上拖放一个UIImageView 两个UIButton ,一个UISlider ,布局如图. 并为他们连线, UIImage ...
- 简单实现图片间的切换动画 主要用到ViewPager
简单实现图片间的切换动画 主要用到ViewPagerViewPager是android扩展包v4包中的类,这个类可以让用户左右切换当前的view.ViewPager类需要一个PagerAdapter适 ...
- UEditor之实现配置简单的图片上传示例
UEditor之实现配置简单的图片上传示例 原创 2016年06月11日 18:27:31 开心一笑 下班后,阿华到楼下小超市买毛巾,刚买完出来,就遇到同一办公楼里另一家公司的阿菲,之前与她远远的有过 ...
- 潭州课堂25班:Ph201805201 django 项目 第九课 图片验证码前台实现,判断用户是否注册功能实现 (课堂笔记)
u胎代码实现 : 针对每一个 app 写个 js 脚本, 先给 users 的 app 应用创建个 js:在指定目录下的 js 文件夹下,创建 users 文件夹,下创建 suth.js ,图片验证 ...
随机推荐
- 题解西电OJ (Problem 1007 -做一名正气的西电人 )--长整型计算
Description 一天,wm和zyf想比比谁比较正气,但正气这种东西无法量化难以比较,为此,他们想出了一个方法,两人各写一个数字,然后转化为二进制,谁的数字中二进制1多谁就比较正气! Input ...
- 宿主进程 vshost.exe
Hosting Process (vshost.exe) 宿主进程是VS的一个特性.可以提高调试的性能,可以进行部分信任调试(partial trust debugging),可以进行设计时表达式计算 ...
- PopupWindow 问题集锦
1.响应返回键/响应键盘事件(onKeyListener) 最近在做PopupWindow, 发现使用PopupWindow一出现,不会响应popup外面的事件,经过资料查找,发现有两种方法可以响应外 ...
- Java正则表达式--网页爬虫
网页爬虫:其实就一个程序用于在互联网中获取符合指定规则的数据 爬取邮箱地址,爬取的源不同,本地爬取或者是网络爬取 (1)爬取本地数据: public static List<String> ...
- Linux Pmap 命令:查看进程用了多少内存
Pmap 提供了进程的内存映射,pmap命令用于显示一个或多个进程的内存状态.其报告进程的地址空间和内存状态信息.Pmap实际上是一个Sun OS上的命令,linux仅支持其有限的功能.但是它还是对查 ...
- Keil uCos 2.52 stm32 【worldsing笔记】
1.uCOSii V2.52 a.加了7个可以配置的钩子函数宏 #define OS_TASK_CREATE_HOOK_EN 0 /* 任务创建时调用钩子函数 使能 ...
- SpringMVC(一)
开始学习SpringMVC了,就写下每次学习的内容,以及自己的理解.方便以后回顾知道自己哪里好哪里不好~~~ 一.目录 1.主目录如此: 2.target目录 二.文件 1.主要用到的几个文件夹(如主 ...
- ELK beats通用配置说明(12th)
Beats配置文件是以YAML语法,该文件包含用于所有的beats的通用配置选项,以及其特点的选项.下面说说通用的配置,特定的配置要看各自beat文档. 通用的配置如下几部分: Shipper Out ...
- JS实现项目查找功能
又是好久没有更新文章了,技术差,人又懒是重罪啊!! 在工作中每天都要查找目前正在接手的项目,而如果项目一多起来怎么办呢? 最近主管突然说要找一下以前的项目改一点BUG,然后我就找了半天才找到对应的文件 ...
- zoj 3820 Building Fire Stations 树的中心
Building Fire Stations Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.zju.edu.cn/onlinejudge ...