网站前台验证码(源代码)的实现点击刷新

11 篇文章 0 订阅

为了方便想学习网站前台方向读者刚睁开眼睛就决定将自己写的验证码的实现写下来供大家参考 在此基础上其实可以实现运算的验证码、或者是图片展示的验证码、其他样式的验证码。请大家多多评价提供自己的想法这样能够集思广益提供更加多的思路。好了下面发代码:

login.jsp页面的代码主要看中间验证码部分是怎么实现的:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
     <base href="<%=basePath%>">
    
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Book Store</title>
     <link rel="stylesheet" type="text/css" href="style.css" />


  </head>
  
  <body>
  <jsp:include  page="head.jsp"/> 
    
    <div id="wrap">
    <div class="center_content">
    <div class="left_content">
      <div class="title"><span class="title_icon"><img src="images/bullet1.gif" alt="" title="" /></span>登陆 </div>
      <div class="feat_prod_box_details">
        <p class="details"> 我们是专门做书籍的网站,您想要的书籍我们这里都有只有你想不到,没有我们做不到这就是我们想要的网上书店。我们同时也是一家做特卖的网站。只不过我们做的特卖都是书籍。因为我们相信书籍可以改变世界改变你的人生! </p>
        <div class="contact_form">
          <div class="form_subtitle">登陆 以查看清单</div>
          <form name="register" method="post" action="UserDAO">
            <div class="form_row">
              <label class="contact"><strong>用户名:</strong></label>
              <input type="text" class="contact_input" name="userName" />
            </div>
            <div class="form_row">
              <label class="contact"><strong>密  码:</strong></label>
              <input type="password" class="contact_input" name="password" />
            </div>
             <div class="form_row">
              <label class="contact"><strong>验证码:</strong></label>
              <input type="text" class="contact_input" name="validateCode"  value="请输入正确的验证码"/><img src=ValidateCodeServlet οnclick="this.src='ValidateCodeServlet';" class="s1" title="点击更换">
            </div> 
            <div class="form_row">
              <div class="terms"><input type="checkbox" name="terms" />记住密码 </div>
            </div>
            <div class="form_row">
              <input type="submit" class="register" value="登陆" />
            </div>
          </form>
        </div>
         </div>
      <div class="clear"></div>
    </div>
    <jsp:include  page="broadside.jsp"/> 
    </div>
    </div>
  </body>
</html>

然后就是我们的验证码实现的servlet:

package userUtil;

import javax.imageio.ImageIO;
import javax.servlet.*;
import javax.servlet.http.*;

import java.io.*;



import java.awt.*;
import java.awt.image.BufferedImage;
import java.util.*;



public class ValidateCodeServlet extends HttpServlet {

 

  /**
	 * 
	 */
	private static final long serialVersionUID = 1L;

/** 响应客户请求*/
  public void service(HttpServletRequest request,HttpServletResponse response)
    throws ServletException, IOException {
	 
	 //创建内存画板对象
	  BufferedImage image= new BufferedImage(100,30,BufferedImage.TYPE_INT_RGB);
	  Graphics g=image.getGraphics();
	  
	  //产生背景色
	  Random r=new Random();
	  g.setColor(new Color(r.nextInt(255),r.nextInt(255),r.nextInt(255)));
	  
	  //用背景色填充矩形框
	  g.fillRect(0, 0, 100,30);
	  
	  //调用自定义的方法,获取长度为5的字母数字组合的字符串
	  String number=getNumber(5);
	  
	  //将所产生的随机码加入会话
	  HttpSession session=request.getSession();
	  session.setAttribute("code", number);
	  
	  //设置字的颜色与字体,以图形方式画出
	  g.setColor(new Color(0,0,0));
	  g.setFont(new Font(null,Font.BOLD,24));
	  g.drawString(number,5,25);
	  
	  //绘制干扰线
	  for(int i=0;i<8;i++)
	  {
		  g.setColor(new Color(r.nextInt(255),r.nextInt(255),r.nextInt(255)));
		  g.drawLine(r.nextInt(100),r.nextInt(30),r.nextInt(100),r.nextInt(30));
	  }

	  //响应用户请求,绘制图形
	  response.setContentType("image/jpeg");
	  OutputStream ops=response.getOutputStream();
	  ImageIO.write(image, "jpeg",ops);
	  ops.close();
    
  }
  
  private String getNumber(int size)
  {
	  String str="ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";//要注意的是我这里只提供了大写的A-Z如果想实现小写的自己加进去还有就是本应该将用户的输入不管大写小写都要转化为小写我没做有兴趣的自己实现很简单的
	  String  number="";
	  Random r=new Random();
	  for(int i=0;i<size;i++)
	  {
		  number+=str.charAt(r.nextInt(str.length()));
		  
	  }
	  return number;
  }
  
	
  
}



然后就是配置自己的web.xml这样就实现了简单的验证码:

      <servlet>
        <servlet-name>ValidateCodeServlet</servlet-name>
        <servlet-class>userUtil.ValidateCodeServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>ValidateCodeServlet</servlet-name>
        <url-pattern>/ValidateCodeServlet</url-pattern>
    </servlet-mapping>

效果如下:



  • 6
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
好的,这里是一个简单的ASP.NET成绩网站前台源代码示例,您可以参考它来编写自己的网站: ```aspx <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="ScoreWebsite.Default" %> <!DOCTYPE html> <html> <head> <title>成绩查询</title> <meta charset="utf-8" /> </head> <body> <h1>欢迎来到成绩查询网站!</h1> <p>请输入您的学号和密码:</p> <form method="post" action="Default.aspx"> <label for="student_id">学号:</label> <input type="text" id="student_id" name="student_id" /><br /> <label for="password">密码:</label> <input type="password" id="password" name="password" /><br /> <input type="submit" value="查询" /> </form> <% if (IsPostBack && !string.IsNullOrEmpty(Request.Form["student_id"]) && !string.IsNullOrEmpty(Request.Form["password"])) { string student_id = Request.Form["student_id"]; string password = Request.Form["password"]; // 在此处添加与数据库交互的代码,查询学生的成绩 // 显示查询结果 Response.Write("<h2>您的成绩如下:</h2>"); Response.Write("<table><tr><th>科目</th><th>成绩</th></tr>"); Response.Write("<tr><td>语文</td><td>90</td></tr>"); Response.Write("<tr><td>数学</td><td>85</td></tr>"); Response.Write("<tr><td>英语</td><td>92</td></tr>"); Response.Write("</table>"); } %> </body> </html> ``` 这个示例网站包含一个表单,用户可以输入学号和密码,然后单击“查询”按钮来查询他们的成绩。如果用户在表单中输入了学号和密码并提交表单,则会显示他们的成绩。 请注意,这只是一个简单的示例,实际的成绩网站需要更多的代码来处理用户输入并从数据库中检索成绩。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值