JSP制作简单登陆

JSP制作简单登陆界面

运行环境

eclipse+tomcat+MySQL 不知道的可以参考Jsp运行环境——Tomcat

项目列表

这里我先把jsp文件先放在Web-INF外面访问

  1. 需要建立的几个文件在图上.jsp
  2. 还要导入MySQL的jar包mysql-5.0.5.jar,导到WEB-INF中的lib文件夹就可以不需要Bulid Path
  3. 开始编写代码:

代码演示:

index.jsp就好像一般网站的首页一样感觉,将header.jsp和footer.jsp引入其中

<%@ 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>
<style>
    #nav>ul>li{
        float:left;
        margin-left:50px;
    }
    #login{
        clear:both;
    }
</style>
</head>
<body>
<!-- 引入header.jsp的头部文件 -->
<%@ include file="header.jsp" %>
<div id="login">
    <a href="login.jsp"><button>登陆</button></a>
</div>
<!-- 引入footer.jsp的脚部文件 -->
<%@include file="footer.jsp" %>
</body>
</html>

header.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<div id="nav">
    <ul>
        <li ><a href="">导航1</a></li>
        <li><a href="">导航2</a></li>
        <li><a href="">导航3</a></li>
        <li><a href="">导航4</a></li>
        <li><a href="">导航5</a></li>
        <li><a href="">导航6</a></li>
    </ul>
</div>

footer.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <div>
<p>xxxxxxxxxxx可以试试|xxxxxxxxxxxx技术有限公司</p>
 <p>京 ICP 证 1234567 号|Copyright ? 1999-2017, All Rights Reserved </p>
 </div>
页面内容展示:

login.jsp登陆用户名密码填写界面

<%@ 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>
</head>
<body>
<%--表单--%>
    <fieldset>
    <legend>登陆界面</legend>
    <form action="test.jsp" method="post">
    <input type="text" name="username"><br>
    <input type="password" name="password"><br>
    <input type="submit" value="登陆">
    <!-- EL语句,后面验证表单时,验证错误反回信息-->
    ${error}
    </form>
</fieldset>
</body>
</html>

内容显示:

test.jsp 是对表单login.jsp 的提交的内容与数据库中的数据对比验证,再相应的跳转

<%@page import="java.sql.*"%>

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
//请求获取login.jsp的用户名username的值
 String username=request.getParameter("username");
//请求获取login.jsp的密码password的值
String password=request.getParameter("password");
//数据库MySQL的地址
String DBURL="jdbc:mysql://localhost:3306/zhou?useUnicode=true&characterEncoding=utf-8";
String DBName="root"; //登入用户名
String DBPwd="123456";//登入密码
//加载mysql驱动
Class.forName("com.mysql.jdbc.Driver");
//连接数据库
Connection conn=DriverManager.getConnection(DBURL,DBName,DBPwd);
//创建Statement对象
Statement st=conn.createStatement();
//sql语句,搜索这个username和password在数据库是否存在
String sql="select * from user where name=‘"+username+"‘and pwd=‘"+password+"‘";
//运行sql语句,并把得到的结果放入结果集ResultSet中
ResultSet rs=st.executeQuery(sql);
//判断这个结果集是否存在,一般username只有一个
if(rs.next()){
    //设置一个username,将后面username其内容赋值给前面一个username,可以以便下一个页面使用
    request.setAttribute("username", username);
    //跳转页面到userpage.jsp
    request.getRequestDispatcher("userpage.jsp").forward(request, response);
}else{
    //设置一个error,将后面的字赋给这个error,以便先一个跳转页面的使用,request的作用域有限
    request.setAttribute("error", "用户名或密码错误!!!");
    request.getRequestDispatcher("login.jsp").forward(request, response);
}
%>

登陆错误显示的页面内容:

userpage.jsp这个页面就是登陆成功之后显示的页面

<%@page import="javafx.scene.chart.PieChart.Data"%>
<%@page import="java.util.Date"%>
<%@ 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>
</head>
<body>
<div>
<!-- ${username}是获取到test.jsp 中判断中重新设置的username,知道是谁登陆了,这个是谁的页面 -->
<p>${username},你好,登陆成功!!</p>
</div>
<%
//session的作用域问题,可以记录一个网站的浏览量。先得到一个count
    Object obj=session.getAttribute("count");
//判断这个对象是否为空
    if(obj==null){
        //空则重新设置一下count的值
        session.setAttribute("count", 0);
    }else{
        //否则将得到的对象强转加1,就可以记录浏览量
        int i=(int)obj+1;
        session.setAttribute("count", i);
        %>
        <div>你是第<%=i %>位登陆的用户</div>
    <%
    }
    //获取当前时间
    Date date=new Date();
    out.print("现在时间:"+date);
%>
<div>你的IP地址:<%=request.getRemoteAddr()%></div>
</body>
</html>

页面内容:localhost就是127.0.0.1,有时候地址栏是local host时会显示8个0:

 

整个简单的登陆就完事了

想了解EL语言的具体感觉可以看这个 JSP中的EL表达式详细介绍

时间: 2024-10-29 10:46:54

JSP制作简单登陆的相关文章

Eclipse通过jdbc连接数据库制作简单登陆界面

一.前言: 做网站开发,要求有多种搭配方式,前台技术可以使用PHP.ASP.JSP.ASP.NET.CGI等任何一种: 需要用到的基础语言用的最多的就是HTML/CSS.JS.JAVA.XML这些了,HTML/CSS+JS可以实现对界面的描绘渲染,而JAVA则可以做后台数据处理,XML也是可以当作传输数据的介质(思考:XML比HTML强大这么多,为什么它没能替代HTML?): 这篇文章通过简单的JSP文件实现登陆界面,所以只用到了以下技术: HTML/CSS,简单演示就不做CSS样式了,可自行学

用java制作简单登陆窗口,求大神教导

import java.awt.Container; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.util.Random; import javax.swing.JButton; import javax.swing.JFrame; import javax.swing.JLabel; import javax.swing.JOptionPane; import java

对于使用javaweb技术制作简单管理系统的学习

近期在老师的引导下我们学习了利用Javaweb技术制作简单的管理系统,其中涉及到的技术很多,由于大多都是自学 对这些技术的理解还太浅显但能实现一些相关功能的雏形. (一).登录功能 在登陆功能中通过与数据库的连接实现了验证用户账号与密码是否正确的功能,并添加了简易的权限设置使 不同用户登录成功后所呈现的主界面是不同的:同时还有验证码功能能检测验证码是否输入正确. 数据库: jsp: 1 <%@ page language="java" contentType="text

Jsp制作验证码

验证码 验证码(CAPTCHA)是"Completely Automated Public Turing test to tell Computers and Humans Apart"(全自动区分计算机和人类的图灵测试)的缩写,是一种区分用户是计算机还是人的公共全自动程序.可以防止:恶意破解密码.刷票.论坛灌水,有效防止某个黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试,实际上用验证码是现在很多网站通行的方式,我们利用比较简易的方式实现了这个功能.这个问题可以由计算

JSP验证码简单例子

原文:JSP验证码简单例子 源代码下载地址:http://www.zuidaima.com/share/1550463705320448.htm 几年前用servlet写的一个简单验证码功能.还有许多要完善的,但是验证码已经完善了. 包含登陆界面,可以自己修改下验证码代码把验证码的代码写进后台,生成图片后再输出到页面.也可以把验证码生成更复杂些. 登陆成功  验证失败

【Servlet】Servlet简单登陆验证实例

林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 本文要实现Servlet简单登陆验证实例.结构如下 1.LoginCheck.java package com.mucfc; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.annota

ArcGIS利用DEM制作简单三维

利用DEM数据镶嵌后,矢量数据裁剪得到研究范围的DEM数据,在ARCScene中进行三维制作 ArcGIS利用DEM制作简单三维 点击学习我的系统教程哦

如何制作简单的 3D 打印模型

Hi 大家好! 了解一个方兴未艾,但极为有趣的话题 - 3D 打印 . 为了帮助大家对3D打印有一个初步的感性认识,我在线制作了一款可用于3D打印的model, 大家可以先通过体验这个在线 model 的3D 效果,体验一下让我们耳目为之一新的感觉 J ~ 首先打开URL : http://www.123dapp.com/Catch/2014-4-1-21-5-35/2258051 .首次进入时先看到的是一张2维的平面图片,然后请点选左下 3D VIEW . 待图像加载结束,就可以通过鼠标的拖曳

利用replaceChild制作简单的吞噬效果【jsDEMO】

[功能说明] 利用replaceChild制作简单的吞噬效果 [HTML代码说明] <ul class="list" id="list"> <li class="in">1</li> <li class="in">2</li> <li class="in">3</li> <li class="in"