当前位置: 代码迷 >> 综合 >> java_web 快速入门之第四章 验证码新闻增加
  详细解决方案

java_web 快速入门之第四章 验证码新闻增加

热度:65   发布时间:2023-12-05 09:37:33.0

一:验证码的基本概念:

        验证码是一种区分用户是计算机还是人的公共全自动程序,验证码问题由计算机生成并评判,只有人类才能解答,可以防止恶意破解密码、刷票、论坛灌水等问题,分为Gif动画验证码、手机短信验证码、手机语音验证码和视频验证码。

       由于验证码是随机产生的,有很大几率会出现无法清楚识别的验证码图片,一般会有【看不清,换一张】的提示,直接点击当前的验证码图片可以完成验证码的更换,一般注册用户ID的地方以及各大论坛都要输入验证码,常见的验证码为四位数字或字母,6位数字的验证码也是很常见的。

  • 验证码的作用:

      在系统登录或者注册时,为防止有人恶意注册账号或者尝试暴力破解用户密码,常需要使用验证码来验证用户是否是人为操作。

  • 案例:演示带验证码的登录操作(login.jsp)

%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>用户登录</title>
<!-- 引入jquery -->
<script src="js/jquery-3.5.1.js"></script>
<link href="images/login.css" rel="stylesheet" type="text/css" />
<style>*{user-select:none;}</style>
<script>//刷新验证码function setYZM() {//数组里面那就是需要随机的组合的字var sc = new Array(2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');//随机的范围应该是数组的下标 0~数组的长度-1//因为随机的是小数  所以要向下取整//验证码是4位var str=""for (var i = 0; i < 4; i++) {var f=Math.floor(Math.random()*sc.length)str+=sc[f]}//将验证码丢到span中// text() 取元素的内容// val() 取的是表单元素的内容$("#mys").text(str)}$(function() {setYZM()//设置mys的点击触发刷新验证码的方法$("#mys").click(setYZM)})function checkForm() {//1.判断名字是否位空var name=$("#ba").val()if(name.length==0){alert("用户名必须填写")return false}//2.判断密码是否位空var pwd=$("#bb").val()if(pwd.length==0){alert("密码必须填写")return false}//3.验证码是否一致var y1=$("#bc").val()var y2=$("#mys").text()if(y1.toLowerCase()!=y2.toLowerCase()){alert("验证码不一致")setYZM()return false}return true //提交表单}
</script>
</head>
<body>
<form action="dologin.jsp" method="post" onsubmit="return checkForm()"><div id="login"><div id="top"><div id="top_left"><img src="images/login_03.gif" /></div><div id="top_center"></div></div><div id="center"><div id="center_left"></div><div id="center_middle"><div id="user">用 户<input type="text" name="uname" id="ba"/></div><div id="password">密   码<input type="password" name="upwd"  id="bb"/></div><div id="password1">验证码<input type="text" style="width:50px;"  id="bc"/><span id="mys" style="font-size:19px;">XXXX</span></div><div id="btn"><input type="submit" value="登录"><input type="reset" value="取消"></div></div><div id="center_right"></div>		 </div><div id="down"><div id="down_left"><div id="inf"><span class="inf_text">版本信息</span><span class="copyright">管理信息系统 2008 v2.0</span></div></div><div id="down_center"></div>		 </div></div>
</form>
</body>
</html>
  •  中转页面   

     中转页面是注册页面提交数据的中转站,常以do开头,加上需要进行数据库交互的项目名。   

  • 作用:

  1. 获取页面提交的数据
  2. 进行数据库交互
  3. 判断是否提交到指定的页面去 

案例:演示带验证码的登录中转页面操作(dologin.jsp)

?
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@page import="oracle.jdbc.driver.OracleDriver"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<% //1.将编码格式变为utf-8request.setCharacterEncoding("utf-8");//取表单提交的值String name=request.getParameter("uname");String pwd=request.getParameter("upwd");//到数据库做验证//准备工作(导包)//1.加载驱动Class.forName("oracle.jdbc.driver.OracleDriver");//2.获得连接String url="jdbc:oracle:thin:@localhost:1521:orcl";Connection con=DriverManager.getConnection(url, "scott", "123");//3.编写sql语句String sql="select * from tb_user where name=? and pwd=?";//4.获得执行对象PreparedStatement ps=con.prepareStatement(sql);//5.设置?的值ps.setString(1, name);ps.setString(2, pwd);//6.开始执行// 增删改都返回int// 查询返回结果集 resultSetResultSet rs=ps.executeQuery();//7.判断是否登录成功  查看结果几里面是否有数据if(rs.next()){//登录成功 跳首页request.getRequestDispatcher("admin/index.jsp").forward(request, response);}else{response.sendRedirect("login.jsp");}//8.关闭资源  con  ps  rsif(con!=null&&!con.isClosed()){con.close();}if(ps!=null){ps.close();}if(rs!=null){rs.close();}%>?

二:新闻增加操作

?
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>新闻发布--管理后台</title><link rel="stylesheet" type="text/css" href="css/admin.css" /></head><body><div id="header"><div id="welcome">欢迎使用新闻管理系统!</div><div id="nav"><div id="logo"><img src="images/logo.jpg" alt="新闻中国" /></div><div id="a_b01"><img src="images/a_b01.gif" alt="" /></div></div></div><div id="admin_bar"><div id="status">管理员: 登录 &#160;&#160;&#160;&#160;<a href="#">退出</a></div><div id="channel"> </div></div><div id="main"><div id="opt_list"><ul><li><a href="admin.html">管&nbsp;&nbsp;理&nbsp;&nbsp;首&nbsp;&nbsp;页</a></li><li><a href="admin_addNews.html">新&nbsp;&nbsp;闻&nbsp;&nbsp;发&nbsp;&nbsp;布</a></li><li><a href="admin_themeMaintain.html">主&nbsp;&nbsp;题&nbsp;&nbsp;维&nbsp;&nbsp;护</a></li><li><a style="color: red;" href="#">系统账号管理</a></li><li><a style="color: red;" href="#">注册用户管理</a></li></ul></div><div id="opt_area"><h1 id="opt_type"> 添加新闻: </h1><form action="doAddNews.jsp" method="post"><p><label> 主题 </label><select name="ntid"><option value="1">国际</option><option value="2">美女</option><option value="3">游戏</option><option value="4">娱乐</option><option value="5">体育</option></select></p><p><label> 标题 </label><input name="ntitle" type="text" class="opt_input" /></p><p><label> 作者 </label><input name="nauthor" type="text" class="opt_input" /></p><p><label> 摘要 </label><textarea name="nsummary" cols="40" rows="3"></textarea></p><p><label> 内容 </label><textarea name="ncontent" cols="70" rows="10"></textarea></p><p><label> 上传图片 </label><input name="file" type="file" class="opt_input" /></p><input name="action" type="hidden" value="addnews"><input type="submit" value="提交" class="opt_sub" /><input type="reset" value="重置" class="opt_sub" /></form></div></div><div id="site_link"> <a href="#">关于我们</a><span>|</span> <a href="#">Aboue Us</a><span>|</span> <a href="#">联系我们</a><span>|</span><a href="#">广告服务</a><span>|</span> <a href="#">供稿服务</a><span>|</span> <a href="#">法律声明</a><span>|</span> <a href="#">招聘信息</a><span>|</span><a href="#">网站地图</a><span>|</span> <a href="#">留言反馈</a> </div><div id="footer"><p class="">24小时客户服务热线:010-68988888 &#160;&#160;&#160;&#160; <a href="#">常见问题解答</a> &#160;&#160;&#160;&#160;新闻热线:010-627488888<br />文明办网文明上网举报电话:010-627488888 &#160;&#160;&#160;&#160; 举报邮箱:<a href="#">jubao@jb-aptech.com.cn</a></p><p class="copyright">Copyright &copy; 1999-2009 News China gov, All Right Reserver<br />新闻中国 版权所有</p></div></body>
</html>?

中转数据库验证页面操作:

?
<%@page import="java.sql.ResultSet"%>
<%@page import="java.sql.PreparedStatement"%>
<%@page import="java.sql.DriverManager"%>
<%@page import="java.sql.Connection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><%//作用:获取新增表单的数据进行数据库交互//1.编码格式request.setCharacterEncoding("utf-8");//2.获取表单提交的数据//编号int nid = 0;//定义一个变量保存最终的id//链接数据库查询到最大的id   最后+1//加载驱动Class.forName("oracle.jdbc.driver.OracleDriver");//建立连接String url = "jdbc:oracle:thin:@localhost:1521:orcl";Connection conn = DriverManager.getConnection(url, "scott", "123");String sql = "select nvl(max(nid),0) from tb_news";PreparedStatement ps = conn.prepareStatement(sql);ResultSet rs = ps.executeQuery();if(rs.next()){nid = rs.getInt(1)+1;}//新闻分类idString tid = request.getParameter("ntid");int ntid = Integer.valueOf(tid);//标题String ntitle = request.getParameter("ntitle");//作者String nauthor = request.getParameter("nauthor");//摘要String nsummary = request.getParameter("nsummary");//内容String ncontent = request.getParameter("ncontent");//图片 (默认  到时再说)//日期 (获取系统时间)//点击量  默认0//新增新闻sql = "insert into tb_news(nid,ntid,ntitle,nauthor,nsummary,ncontent,ndate,ncount) values (?,?,?,?,?,?,sysdate,0)";ps = conn.prepareStatement(sql);ps.setInt(1, nid);ps.setInt(2,ntid);ps.setString(3,ntitle);ps.setString(4,nauthor);ps.setString(5,nsummary);ps.setString(6,ncontent);int n = ps.executeUpdate();if(n>0){out.print("<script>alert('发布成功');location.href='admin.jsp'</script>");}else{out.print("<script>alert('发布失败');location.href='add_news.jsp'</script>");}%>?