11.用户模块:验证码程序

注册时需要填写验证码,填写正确才能注册。

1、生成验证码的action,CheckImgAction

package cn.xdy.shop.user.action;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.util.Random;

import javax.imageio.ImageIO;

import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;

public class CheckImgAction extends ActionSupport{

	@Override
	public String execute() throws Exception {
		int width = 120;
		int height = 30;

		// 步骤一 绘制一张内存中图片
		BufferedImage bufferedImage = new BufferedImage(width, height,
				BufferedImage.TYPE_INT_RGB);

		// 步骤二 图片绘制背景颜色 ---通过绘图对象
		Graphics graphics = bufferedImage.getGraphics();// 得到画图对象 --- 画笔
		// 绘制任何图形之前 都必须指定一个颜色
		graphics.setColor(getRandColor(200, 250));
		graphics.fillRect(0, 0, width, height);

		// 步骤三 绘制边框
		graphics.setColor(Color.WHITE);
		graphics.drawRect(0, 0, width - 1, height - 1);

		// 步骤四 四个随机数字
		Graphics2D graphics2d = (Graphics2D) graphics;
		// 设置输出字体
		graphics2d.setFont(new Font("宋体", Font.BOLD, 18));

		String words ="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890";
		Random random = new Random();// 生成随机数
		// 定义StringBuffer
		StringBuffer sb = new StringBuffer();
		// 定义x坐标
		int x = 10;
		for (int i = 0; i < 4; i++) {
			// 随机颜色
			graphics2d.setColor(new Color(20 + random.nextInt(110), 20 + random
					.nextInt(110), 20 + random.nextInt(110)));
			// 旋转 -30 --- 30度
			int jiaodu = random.nextInt(60) - 30;
			// 换算弧度
			double theta = jiaodu * Math.PI / 180;

			// 生成一个随机数字
			int index = random.nextInt(words.length()); // 生成随机数 0 到 length - 1
			// 获得字母数字
			char c = words.charAt(index);
			sb.append(c);
			// 将c 输出到图片
			graphics2d.rotate(theta, x, 20);
			graphics2d.drawString(String.valueOf(c), x, 20);
			graphics2d.rotate(-theta, x, 20);
			x += 30;
		}

		// 将生成的字母存入到session中
		ServletActionContext.getRequest().getSession().setAttribute("checkcode", sb.toString());

		// 步骤五 绘制干扰线
		graphics.setColor(getRandColor(160, 200));
		int x1;
		int x2;
		int y1;
		int y2;
		for (int i = 0; i < 30; i++) {
			x1 = random.nextInt(width);
			x2 = random.nextInt(12);
			y1 = random.nextInt(height);
			y2 = random.nextInt(12);
			graphics.drawLine(x1, y1, x1 + x2, x2 + y2);
		}

		// 将上面图片输出到浏览器 ImageIO
		graphics.dispose();// 释放资源
		ImageIO.write(bufferedImage, "jpg", ServletActionContext.getResponse().getOutputStream());
		return NONE;
	}

	/**
	 * 取其某一范围的color
	 *
	 * @param fc
	 *            int 范围参数1
	 * @param bc
	 *            int 范围参数2
	 * @return Color
	 */
	private Color getRandColor(int fc, int bc) {
		// 取其随机颜色
		Random random = new Random();
		if (fc > 255) {
			fc = 255;
		}
		if (bc > 255) {
			bc = 255;
		}
		int r = fc + random.nextInt(bc - fc);
		int g = fc + random.nextInt(bc - fc);
		int b = fc + random.nextInt(bc - fc);
		return new Color(r, g, b);
	}
}

2、配置struts.xml

<!-- 验证码 -->
    	<action name="checkImg" class="checkImgAction">

    	</action>

3、配置applicationContext.xml

<!-- 验证码的action -->
	<bean id="checkImgAction" class="cn.xdy.shop.user.action.CheckImgAction" scope="prototype">

	</bean>

4、在regist.jsp页面中修改验证码的src,并增加onclick事件用以点击更换验证码。

<span class="fieldSet">
											<input type="text" id="checkcode" name="checkcode" class="text captcha" maxlength="4" autocomplete="off">
											<img id="checkImg" class="captchaImage" src="${pageContext.request.contextPath}/checkImg" onclick="changeImg();" title="点击更换验证码">
										</span>

更换验证码的JS

//切换验证码图片
	function changeImg(){
		var img = document.getElementById("checkImg");
		img.src="${pageContext.request.contextPath}/checkImg?"+new Date().getTime();
	}

5、若验证码输入错误,则不能注册返回注册页面,并提示错误信息以红色字体显示。

5.1、在UserAction中加入checkcode,提供set方法,用以接收页面传过来的验证码字符串。

private String checkcode;//接收页面传入的验证码

	public void setCheckcode(String checkcode) {
		this.checkcode = checkcode;
	}

在regist方法中,在保存信息之前先判断session中的验证码(即图片上的验证码)与页面传入的验证码是否相同(不区分大小写),如果相同则执行后面的保存信息代码,若不相同,则加入错误信息供页面显示,返回注册逻辑视图。

/**
	 * 注册
	 * @return
	 */
	public String regist(){
		//判断验证码与图片上验证码是否一致
		if(!checkcode.equalsIgnoreCase((String) ServletActionContext.getRequest().getSession().getAttribute("checkcode"))){
			addActionError("验证码错误!");
			return "registPage";
		}
		userService.save(user);
		MailUtil.sendMail(user.getEmail(), user.getCode());
		this.addActionMessage("注册成功!");
		return "msg";
	}

5.2、在regist.jsp中在验证码之后加入错误信息,为了使其红色字体显示,设置class,为了通用性,在common.css中加入css代码,代码如下:

<span class="actionerrsor"><s:actionerror/></span>
.actionerrsor{
	color:red;
	font-weight:bold;
	font:"微软雅黑";
}

6、效果图

时间: 2024-11-06 06:31:53

11.用户模块:验证码程序的相关文章

Python程序猿必知会的Django用户模块扩展方法

本文和大家分享的主要是Django用户模块的扩展相关知识,希望可以帮助大家更好的学习Django ,一起来看看吧. Django内置的用户验证系统十分强大.大多数情况下,它可以拿来就用,能帮我们省去很多开发.测试的工作.它能满足大多数的使用情况并且很安全.但是有时候,为满足我们的网络应用需求,需要对它进行一些微调. 一般来说,我们希望更多地存储与用户有关的数据.如果你的网络应用具有社交属性,你可能希望存储用户简介.地理位置以及其他相关的东西. 在此教程里,我将简单呈现扩展Django用户模型的方

9 用户模块开发

本小节,我们来完成最后一个模块--用户模块的开发. 用户模块一共有5个页面,分别是登录页面,注册页面,用户操作页面,收藏职位页面以及投递记录页面,先在src/view/目录下,创建这五个页面的视图文件login.html,register.html,my.html,favorite.html,post.html. 然后给视图添加路由,打开router.js文件: .state('login',{ url:'/login', templateUrl:'view/login.html', contr

验证码程序Demo

小伙伴都有这样的经历,册各种网站,总是输不对验证码,双十一那天狂买的小伙伴是不是对输入验证码有着不一样的感触呢,以前觉得验证码真是个麻烦鬼,一个不小心,一个眼拙,哎呦,没有输入正确,又是一阵子大眼瞪小眼,这个时候,突然想起做软件的不都是本着为人民服务的那颗滚烫的心么?怎么总让用户输入验证码,这不是给用户带来麻烦么?小编想应该没有哪个用户会愿意输入验证码,特别是对于视力不是太好的小伙伴,有时候很坑爹,明明记得是输对了,但是最后显示的是验证码输入错误,这是否跟咱们的软件为人民服务相违背呢呢?小编感触

Web应用程序系统的多用户权限控制设计及实现-用户模块【7】

前五章均是从整体上讲述了Web应用程序的多用户权限控制实现流程,本章讲述Web权限管理系统的基本模块-用户模块.用户模块涉及到的数据表为用户表. 1.1分组域 为了更规范和方便后期系统的二次开发和维护,对应特定的业务模块采用Area(域)的方式开发,用户模块的开发域如下图所示: 由于在Areas下还建立了一个新的目录SystemManage,故需要改变原来的路由.用户模块的路由文件名称为OperatorManageAreaRegistration.改变路由代码的文件名称为如下: using Sy

nodejs通过 智验科技API 向用户发送验证码

在学习上不肯钻研的人是不会提出问题的,在事业上缺乏突破力的人是不会有所创新的. 先简单说一下今天的事情,在一个订单页面的开发过程中,我突发奇想的希望能通过前端的技术向用户发送验证码. 于是我整个晚上都着力于这个需求的思路与实现方式: 1:验证码的数据肯定不能存在于html页面以及js文件中,我觉得这是一个安全性的问题,所以验证码数据应该由后台自动生成,那么在我应该使用哪种后端语言? 2:在日常生活中,发送短信肯定是有费用的,所以我们肯定是不可能通过一两段代码就免费的将验证码发送到用户手机的,那么

电子商务(电销)平台中用户模块(User)数据库设计明细

以下是自己在电子商务系统设计中的订单模块的数据库设计经验总结,而今发表出来一起分享,如有不当,欢迎跟帖讨论~ 用户基础表(user_base)|-- 自动编号 (user_id)|-- 用户名 (user_name)|-- 手机号码|-- 电子邮件|-- 登录密码 (password)|-- 用户状态 (status) 用户开放登录帐号表|-- 自动编号|-- 用户编号|-- 腾讯QQ号码 (qq)|-- 微信号码 (wechat)|-- 淘宝帐号 (taobao)|-- Skype (skyp

JavaWeb网上图书商城完整项目--21.用户模块各层相关类的创建

1.现在要为user用户模块创建类 用户模块功能包括:注册.激活.登录.退出.修改密码. User类对照着t_user表来写即可.我们要保证User类的属性名称与t_user表的列名称完全相同. 我们来创建User类 package com.weiyuan.goods.user.domian; public class User { private String uid; //主键 private String loginname;// 登陆名称 private String loginpass

Raspberry Pi 摄像头模块应用程序文档翻译

http://dreamcolor.net/archives/raspicam-documentation.html —————————————————————————————————————————————————————————————————————— Raspberry Pi 摄像头模块应用程序文档翻译 更新日志: 2014 年 3 月 24 日更新:根据 2013 年 12 月更新的文档,对原译文进行扩展翻译.翻译完毕. 2014 年 3 月 4 日更新:根据 2013 年 12 月更

以不同用户身份运行程序(使用CreateProcessAsUser函数)cool

http://blog.sina.com.cn/s/blog_65977dde0100s7tm.html -------------------------------------------------- 以不同用户身份运行程序 (2011-07-09 09:15:25) 一直想方便的处理CCProxy代理的帐号管理,所以梦想做一个比较好的管理工具.但一个最麻烦的问题就是帐号的更新,CCProxy有一个网页管理功 能,可以加帐号,但加的帐号就是不可以立即更新.中午上网的时候发现CCProxy有