验证码(一)

[b]Pair.java[/b]
public class Pair<K, E> {
private K key;
private E value;

public Pair() {
}

public Pair(K key, E value) {
this.key = key;
this.value = value;
}

public K getKey() {
return key;
}

public void setKey(K key) {
this.key = key;
}

public E getValue() {
return value;
}

public void setValue(E value) {
this.value = value;
}
}


[b]ImageOut.java[/b]
import java.awt.Color;  
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.util.Random;

public class ImageOut {

private static final int WIDTH = 62;
private static final int HEIGHT = 20;

private static Color getRandomColor() {
Random random = new Random();
return new Color(50 + random.nextInt(100), 50 + random.nextInt(100),
50 + random.nextInt(100));
}

private static int getRandomBgInt() {
Random random = new Random();
return 180 + random.nextInt(60);
}

private static Font getRandomFont() {
Random random = new Random();
return new Font("Times New Roman", Font.PLAIN, 10 + random.nextInt(8));
}

public static char getRandomChar() {
Random random = new Random();
if (random.nextInt(6) < 3) {
return (char) (65 + random.nextInt(26));
}
if(random.nextInt(6) < 3){
return (char) (48 + random.nextInt(10));
}
return (char) (97 + random.nextInt(26));
}

public static Pair<String, BufferedImage> getImage() {

BufferedImage image = new BufferedImage(WIDTH, HEIGHT,
BufferedImage.TYPE_INT_RGB);
Graphics2D g = image.createGraphics();
g.setColor(new Color(255, getRandomBgInt(), 255));
g.fillRect(0, 0, WIDTH, HEIGHT);
StringBuilder s = new StringBuilder();
for (int i = 0; i < 4; i++) {
String t = String.valueOf(getRandomChar());
s.append(t);
g.setColor(getRandomColor());
g.setFont(getRandomFont());
g.drawString(t, 3 + 16 * i, 18);
}
g.dispose();
return new Pair<String, BufferedImage>(s.toString(), image);
}
}


[b]validateImage.jsp[/b]
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page import="java.awt.image.BufferedImage,javax.imageio.ImageIO" %>
<%@page import="com.lhz.util.Pair,com.lhz.util.ImageOut" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%
response.setContentType("image/jpeg");
response.setHeader("Pragma", "No-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
Pair<String, BufferedImage> p = ImageOut.getImage();
ImageIO.write(p.getValue(), "JPEG", response.getOutputStream());
out.clear();
out = pageContext.pushBody();
session.setAttribute("valid", p.getKey());
%>


[b]login.jsp[/b]

<script type="text/javascript">
function changeValidateCode(obj) {
var timenow = new Date().getTime();
obj.src = "<%=path%>/validateImage.jsp?d=" + timenow;
}
</script>


<td>
<span style="color: red;">*</span>验证码
</td>
<td>
<input style="ime-mode: disabled" class="inputValidate" type="text" name="yanzhm" />
<img alt="看不清?单击更换!" src="<%=path%>/validateImage.jsp" onclick="changeValidateCode(this)" />
</td>
在Cocos Creator中实现一个6位数验证码的输入框,可以使用Creator提供的UI组件。以下是一个基本的实现方法: 1. 创建UI输入框:首先,在场景中添加六个InputField组件,每个InputField代表一个验证码数字的输入位置。 2. 控制输入长度:为每个InputField添加事件监听器,监听输入事件。当用户输入字符时,只允许输入6个字符。可以使用InputField的`onValueChanged`事件来检查当前输入长度,并在达到6个字符时阻止进一步输入。 3. 连续输入和删除功能:允许用户使用键盘进行输入,也可以通过触摸屏幕上的数字键盘来输入。为了实现删除功能,可以在每个InputField旁边放置一个删除按钮,当点击删除按钮时,调用InputField的`stringValue`属性来清空内容。 4. 复制粘贴功能:虽然标准的InputField不支持直接粘贴,但可以通过模拟键盘输入的方式来实现复制粘贴功能。用户可以选中输入框并使用设备的复制粘贴功能,然后在你的应用中监听这些动作,并将复制的文本粘贴到InputField中。 5. 完整性验证:为了验证用户输入的验证码是否正确,你需要设置一个按钮用于提交验证码。当用户点击提交按钮时,获取所有InputField的文本内容,将它们拼接成一个完整的验证码字符串,并进行验证。 以下是一个伪代码示例: ```javascript // 伪代码,不是实际的Cocos Creator代码 for (let inputField of inputFields) { inputField.onValueChanged.add((newText) => { if (newText.length > 6) { // 如果输入超过6位,截断文本 inputField.stringValue = newText.substring(0, 6); } }); } // 当用户点击提交按钮时 submitButton.onClick.add(() => { let captcha = ""; for (let inputField of inputFields) { captcha += inputField.stringValue; } // 这里可以将captcha与服务器返回的验证码进行比对 if (captcha === serverCaptcha) { // 验证码正确 } else { // 验证码错误 } }); ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值