*已解决 java写的简单验证码Servlet实践
- 目的:java写的简单验证码Servlet实践 总结项目中遇到的问题 提供遇到同样问题的一些(菜鸟的)思路
(代码在最后~)
- 项目参考:https://www.itdaan.com/blog/2018/03/28/afd6fa1e96cbac02fe791a47adafd465.html
https://www.cnblogs.com/xiaoyingzhanchi/p/9062769.html - 报错
初始缓存请求是没出错的(用了绝对路径)

·把a标签的省略了 发现


- 报错 找不到路径 404
2022/2/18 报错的问题就是路径的问题,但是我弄不清楚,所以我就从web项目中创建了一个新的项目 把servlet和html放在一起(控制变量法)
把tomcat的那个edit还是为/ Debug就是好 不用重启服务器 调试起来舒服得一匹
把文件路径改为项目目录下的就行(我的tomcat里启动时只有这一个项目,如果启动猫猫找不到 可以看一下是不是tomcat里启动了好几个项目,同名的猫猫找不到了!

- 参考的代码

1、(看不清,换一张),点击刷新验证码 <img id="image1" src="http://localhost:8080/om/Ik" border="1" class="verifyimg" height="30px" width="120 px" "/> <a href="#" onclick="changeCode();">看不清,换一张</a><br/> <script type="text/javascript">
function changeCode(){
var img=document.getElementById("image1");
img.src="http://localhost:8080/onlineExam/ImageChack?"+new Date().getTime();
}
</script> 2、点击验证码,即可刷新验证码的图片 <img id="image1" src="http://localhost:8080/om/Ik" border="1" class="verifyimg" height="30px" width="120 px" onClick="getcode(this)"/> <script type="text/javascript">
function getcode() {
var randomnum = Math.random();
var img = document.getElementById("image1");
img.src = "http://localhost:8080/om/Ik?d=" + randomnum; }
Referance Code
- 代码改进:
接下来 就是代码的改进问题:
点击a标签是直接刷新页面 而点击imag是图片改变而已


查了一下a标签怎么写onclick的详细情况(参考:https://blog.csdn.net/manmanwei/article/details/56835602)
写了一下一个新的function 本来的思路是能不能直接用window.onload的function直接调用 但是发现不行
所以就尝试用参考里的格式,写了一个新的js的function,(这里很猪猪的没声明对象- - 报错如下)


接下来上成功的运行图:

代码:

import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.awt.*;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random; @WebServlet("/checkCodeServlet")
public class CheckCodeServlet extends HttpServlet {
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
int width = 100;
int height = 50;
//1 创建一对象 ,在内存中画图(验证码图片对象
BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);//RGB表示三原色的图片 //2美化图片
//2.1 画笔对象填充 设置颜色 设置填充方法
Graphics g = image.getGraphics();
g.setColor(Color.pink);
g.fillRect(0,0,width,height);//填充
//2.2 画边框
g.setColor(Color.black);
g.drawRect(0,0,width-1,height-1);//因为本身线有1px宽度 所以要-1
//2.3写验证码 1
//生成随机角标
String str = "qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM1234567890";
Random ran = new Random();
for (int i=0;i<4;i++){
int index = ran.nextInt(str.length());
//获取字符 随机字符
char c = str.charAt(index);
//2.3写验证码 2
g.drawString(c+"",width/5*i,height/2);
}
//2.4 画干扰线
g.setColor(Color.green);
//随机生成坐标点
for(int i=0;i<50;i++){
int x1 = ran.nextInt(width); //设置上限制
int x2 = ran.nextInt(width); //设置上限制 int y1 = ran.nextInt(height); //设置上限制
int y2 = ran.nextInt(height); //设置上限制
g.drawLine(x1,x2,y1,y2);
} //3将图片输出到页面
ImageIO.write(image,"jpg",resp.getOutputStream());
}
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doPost(req,resp);
}
}
CheckCodeSevlet

<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
/*
chanageCheckCode
点击图片或a标签 实现换一张图片
1 绑点链接和图片绑定单机事件
2 重新设置图片的src属性值
*/ window.onload = function js_changeCode() {
//获取图片对象
var img = document.getElementById("checkCode");
//绑定单机事件
img.onclick = function change1() {
var data = new Date().getTime();
img.src = "/checkCodeServlet?"+data;
//加?1 是因为如果没有改这个地址的话 浏览器可能会加载缓存的图片 所以加?1 可以骗一下浏览器
//升级版方案:只有时间是永远不会重复的 所以加入时间戳
}
}
function js_changeCode(){
var img = document.getElementById("checkCode"); //声明一个对象
var data = new Date().getTime();
document.getElementById("change"); img.src = "/checkCodeServlet?"+data;
} </script>
</head>
<body>
<!--\Regin.html-->
<!--Project01/CheckCodeServlet-->
<img id="checkCode" src="/checkCodeServlet" />
<a href="javascript:void (0)" id="change" onclick="js_changeCode()">看不清换一张</a>
</body>
</html>
Regin.html
完结收工~~
- 总结
心得:本次的实践蛮好玩的,第一天晚上弄到凌晨1点多,就整一个怎么都报错的状态,时隔1天,重新打开,再次调试分析查资料,解决~!撒花!
项目收获:首先关于404的查错思路
1、查看浏览器的F12 有一些直接就可以知道是什么文件的哪里报错了,谷歌浏览器yyds
2、需要检查项目结构是否正确 比如html文件在哪啦,和什么文件同级(方便确定相对路径问题
3、查看tomcat的edit,看一下启动了啥,路径是啥
4、换浏览器,有一些时候,比如查看编码格式的时候,ie浏览器就右键可以看到
*已解决 java写的简单验证码Servlet实践的更多相关文章
- 使用JAVA写一个简单的日历
JAVA写一个简单的日历import java.text.DateFormat;import java.text.ParseException;import java.text.SimpleDateF ...
- Java写一个简单学生管理系统
其实作为一名Java的程序猿,无论你是初学也好,大神也罢,学生管理系统一直都是一个非常好的例子,初学者主要是用数组.List等等来写出一个简易的学生管理系统,二.牛逼一点的大神则用数据库+swing来 ...
- [已解决] java.net.ConnectException: Connection refused: no further information
程序抛出这个异常的原因多数是因为在此[host:port]没有监听,那么该如何解决这个问题呢,如下 第一个要做的是看你的host和port是否写错了,如 [ 127.00.1:8080 ] 第二个要看 ...
- [已解决] java.lang.ClassNotFoundException: org.apache.jsp.WEB_002dINF.com.yourproject.test_jsp
同事遇到了一个问题,开始项目运行的好好的,过了一段时间再访问页面会报出如下错误信息(只贴了部分), 这是为啥呢,可能是由于servlet-api版本jar包重复导致的,他项目本身使用了servlet- ...
- java写的简单通用线程池demo
首先声明,代码部分来自网络. 1.入口DabianTest: package com.lbh.myThreadPool; import java.util.ArrayList; import java ...
- [已解决] java.net.InetAddress.getHostName() 阻塞问题
在学习java nio的过程中发现某些情况下使用该方法会导致程序阻塞,(情况:服务器,Linux:客户端,WIN10) java.net.InetAddress.getHostName() 阻塞情况如 ...
- 用Java写的简单五子棋游戏(原创五子连珠算法)
源码jar包(已安装jdk环境可直接运行) 下载地址:http://download.csdn.net/detail/eguid_1/9532912 五子连珠算法为自创算法,对于五子棋该算法性能足以. ...
- 用JAVA写一个简单的英文加密器
package qhs; import java.util.Scanner; public class JiaM { public static void main(String[] args) { ...
- (已解决)java.lang.NoSuchMethodException: com.kevenwu.pojo.User.<init>()
搭建ssm框架时报了如下错误,原因是: mybatis在初始化bean的时候需要无参构造器, 如果写了有参构造器,将会把无参构造器覆盖掉,加上一个无参构造器就可以了
- [已解决] java 增加 ALPN支持
添加javaVM参数: -Xbootclasspath/p:lib/alpn-boot-8.1.10.v20161026.jar 文章来源:http://www.cnblogs.com/gifisan ...
随机推荐
- Go语言核心36讲35
到目前为止,我们已经一起学习了Go语言标准库中最重要的那几个同步工具,这包括非常经典的互斥锁.读写锁.条件变量和原子操作,以及Go语言特有的几个同步工具: sync/atomic.Value: syn ...
- Web安全Day1 - SQL注入、漏洞类型
Web安全Day1 - SQL注入.漏洞类型 1. SQL注入 1.1 漏洞简介 1.2 漏洞原理 1.3 漏洞危害 2. SQL漏洞类型 2.1 区分数字和字符串 2.2 内联SQL注入 2.3 报 ...
- C#winform使用NOPI读取Excel读取图片
需求:在Winform使用NOPI做导入时候,需要导入数据的同时导入图片. 虽然代码方面不适用(我好像也没仔细看过代码),但是感谢大佬给了灵感http://www.wjhsh.net/IT-Ramon ...
- hashlib加密模块、加密补充说明、subprocess模块、logging日志模块
目录 hashlib加密模块 加密补充说明 subprocess模块 logging日志模块 日志的组成 日志配置字典 hashlib加密模块 1.何为加密 将明文数据处理成密文数据 让人无法看懂 2 ...
- Base64 学习
base64是什么 Base64,就是包括小写字母a-z,大写字母A-Z,数字0-9,符号"+" "/ "一共64个字符的字符集,(另加一个"=&qu ...
- 深入浅出学习透析Nginx服务器的基本原理和配置指南「Keepalive性能分析实战篇」
Linux系统:Centos 7 x64 Nginx版本:1.11.5 Nginx 是一款面向性能设计的 HTTP 服务器,能反向代理 HTTP,HTTPS 和邮件相关(SMTP,POP3,IMAP) ...
- 解决Qt5 mouseMoveEvent事件不能直接触发
问题描述 mouseMoveEvent 需要鼠标点击(左右中),然后在按下的同时移动鼠标才会触发 mouseMoveEvent事件函数. 解决 setMouseTracking(true);
- vue阻止向上和向下冒泡
阻止向下冒泡 <div class="content" @click.self="cancelFunc"></div> 阻止向上冒泡 & ...
- DC-9靶场练习
Vulnhub靶场-DC-9 准备工作 kali和靶机都选择NAT模式(kali与靶机同网段) 下载链接:https://download.vulnhub.com/dc/DC-9.zip 一.主机发现 ...
- 架构设计(四):CDN
架构设计(四):CDN 作者:Grey 原文地址: 博客园:架构设计(四):CDN CSDN:架构设计(四):CDN CDN 全称 Content delivery network ,即:内容分发网络 ...