jsp+postgresql学习笔记(1)用户登录与注册
前期准备:
- tomcat的安装与配置(略)
- jdk的安装与配置(略)
- eclipse软件安装与配置(略)
- webstrom软件或IDEA的安装与配置(大概用了IDEA就不需要eclipse了,但是怎么都没办法调试jsp所以还是放弃了,哈哈哈,tomcat部署https://segmentfault.com/a/1190000006130006)
- postgresql+QGIS+uDig+GeoServe安装与配置(略)
- tomcat配置postgresql(略)
- 土方计算的算法整理(见随笔)
- 构建项目测试数据库(用户表users如下所示)注意事项:数据库名、表名、字段名等尽量使用英文字符

登录界面-详细过程
1登录界面,jsp连接postgresql数据库
Html中使用表单提交用户名、登录密码等数据,<from>标签中的action表示数据提交给LoadFile.jsp,因为注册按钮需要另外提交给Lodin.jsp,所以注册按钮应在<from>标签之外。
(界面做的比较丑,还没进行美化,此处只附登录<div>代码,至于样式自己设置就好啦,不再上传了)
Html 登录 代码:
<!-- -3.1-登录-->
<div id="load" align="center">
<br><p align="center"><strong>用户登录 </strong></p>
<form name="form" action="../jsp/LoadFile.jsp" method="post">
<br><p><strong>工号:</strong><input class="inputText" name="num" type="text" placeholder="请输入您的工号!"/></p>
<br><p><strong>密码:</strong><input class="inputText" name="userpassword" type="password" placeholder="请输入您的密码!"/></p>
<br><p><input type="submit" class="log" name="submit" value="登录"></p>
</form>
<br>
<p><input class="log" name="login" type="button" value="注册" onclick=login();></p>
<br>
</div>
LoadFile.jsp中主要定义了登录行为。
首先连接数据库,url为 jdbc:postgresql://localhost:5432(接口)/EC System (数据库名称);username为数据库所有者(下图为数据库属性页面);password为数据库登录密码。

其次,用户登录。先检测用户输入的用户名是否正确,使用sql语句在数据库表中查询用户名字段,如果用户名正确再检查密码,否则,就输出用户名错误。检查密码时应为逻辑与,即用户名密码同时存在才可以。
本表工号为主键,因此登录时用户名为工号。
LoadFile.jsp 登录 代码
<%@ page contentType = "text/html; charset=utf-8"%>
<%@ page import="java.sql.*"%>
<html>
<head>
</head>
<body>
<div style=text-align:center>
<%
Class.forName("org.postgresql.Driver");
Connection connect = DriverManager.getConnection("jdbc:postgresql://localhost:5432/EC System","postgres","123569");
/* //登录JDBC链接数据库 */ /* load */
String num = request.getParameter("num");
session.setAttribute("username",num);
String userpassword = request.getParameter("userpassword"); Statement pme = connect.createStatement(ResultSet.TYPE_SCROLL_SENSITIVE,ResultSet.CONCUR_UPDATABLE);
/* //createStatement()创建一个 Statement对象来将 SQL语句发送到数据库。从数据库里面取东西对比 */
String rs = "select * from users where workid = '"+num+"'";
ResultSet s = pme.executeQuery(rs);
if(s.next()){
Statement stmt = connect.createStatement(ResultSet.TYPE_SCROLL_SENSITIVE,ResultSet.CONCUR_UPDATABLE);
String sql = "select * from users where workid='"+num+"'and password='"+userpassword+"'";
ResultSet i = stmt.executeQuery(sql);
/* //查询返回的结果集 */
if(i.next()){
out.println("<script language = 'javaScript'> alert('登录成功!');</script>");
response.setHeader("refresh","1;url = ../html/NewFile1.html");/* //刷新,一秒跳到其他页面 */
}/* 登录 */
else{
out.println("ERROR");
out.println("<script language = 'javaScript'> alert('密码错误,请重新登录!');</script>");
response.setHeader("refresh","1;url = ../html/EC-Home.html");
}
stmt.close();
}else{
out.println("ERROR");
out.println("<script language = 'javaScript'> alert('用户名不存在,请重新输入!');</script>");
response.setHeader("refresh","1;url = ../html/EC-Home.html");
} pme.close();
connect.close();
%>
</div>
</body>
<html>
注册界面Html代码
<!-- -3.1-登录-->
<div id="login" align="center">
<p align="center"><strong>用户注册 </strong></p>
<form action="../jsp/Login.jsp" method="post" onsubmit = "return validate();">
<table frame=void width=800px border="1" align="center">
<tr>
<td class="td1"><strong>姓名:</strong></td>
<td class="td2"><input id="name" name="name" type="text" class="inputText" placeholder="请输入您的真实姓名!" onfocus="YHMonfocu()" onblur="YHMonblus()" required/><span id="YHMerror"></span></td>
</tr>
<tr>
<td class="td1"><strong>工号:</strong></td>
<td class="td2"><input id="workid" name="workid" type="text" class="inputText" placeholder="请输入您的工号!" onfocus="GHMonfocu()" onblur="GHMonblus()" required/><span id="GHMerror"></span></td>
</tr>
<tr>
<td class="td1"><strong>职务:</strong></td>
<td class="td2">
<select id="position" name="position" onfocus="ZWMonfocu()" onblur="ZWMonblus()" required>
<option value="" style="display: none;color: #555">请选择您的职务!</option>
<option value="VIP" >负责人</option>
<option value="GIP" >普通成员</option>
</select>
<span id="ZWMerror"></span>
</td>
</tr>
<tr>
<td class="td1"><strong>密码:</strong></td>
<td class="td2"><input id="password" name="password" type="password" class="inputText" placeholder="请输入您的密码!" onfocus="MMonfocu()" onblur="MMonblus()" required/><span id="MMerror"></span></td>
</tr>
<tr>
<td class="td1"><strong>再次输入密码:</strong></td>
<td class="td2"><input id="confirmPassword" name="confirmPassword" type="password" class="inputText" placeholder="请确认您的密码!" onfocus="QRMMonfocu()" onblur="QRMMonblus()" required/><span id="QRMMerror"></span></td>
<!-- //建立表格显示登录界面 -->
</tr>
<tr>
<td class="td1"> </td>
<td class="td2">
<input type="submit" name="submit" class="submitBtn" value="注册" >
</td>
<!-- //设置登录的按钮跳转界面 -->
</tr>
</table>
</form>
</div>
loadsql.js注册信息校检代码
/* JavaScript校验要求:
1.每一项都必须填写内容或者做出选择,不能存在空项;+++++++++
2.姓名:不为空+++++++
3.职业:GIP/VIP
3.工号:只能包含英文字母大小写和数字,长度为8个字符;++++++++
3.密码:必须包含英文字母大小写和数字,长度为8个字符;++++++
4.确认密码:必须与密码相同;
5.如果用户没有按照以上要求输入信息,则当光标离开该项时,在该项的右侧用红色字体给出相应的提示信息。++++++*/
// 姓名name
var registerbtn = document.getElementById("submit");
var Name_state = false;
var workid_state = false;
var position_state = false;
var password_state = false;
var confirmPassword_state = false; function YHMonblus(){
var name = document.getElementById("name");
if(name.value.length==0){
console.log(name.value);
document.getElementById('YHMerror').innerText="请输入您的真实姓名!";
Name_state = false;
}
else {
document.getElementById('YHMerror').innerText ="";
Name_state = true;
}
checkform();
}
function YHMonfocu(){
document.getElementById('YHMerror').innerText ="";
}
/*工号workid*/
function GHMonblus(){
var workid=document.getElementById("workid");
// var reN =/^\d{6,18}$/;
var re = /^(?=.*\d)(?=.*[a-zA-Z])[\da-zA-Z]{8}$/;
if(workid.value==""){
document.getElementById('GHMerror').innerText="请输入您的工号!";
workid_state = false;
}
else if(workid.value.length != 8){
console.log(workid.value);
document.getElementById('GHMerror').innerText="格式错误,长度应为8个字符!";
workid_state = false;
}
else if(!re.test(workid.value)){
document.getElementById('GHMerror').innerText="格式错误,必须包含英文字母和数字!";
workid_state = false;
}
else {
document.getElementById('GHMerror').innerText ="";
workid_state = true;
}
checkform();
}
function GHMonfocu(){
document.getElementById('GHMerror').innerText ="";
}
// 职务position
function ZWMonblus(){
var position = document.getElementById("position");
console.log(position.value);
if(position.value==""){
document.getElementById('ZWMerror').innerText="请选择您的职务!";
position_state = false;
}
else {
document.getElementById('ZWMerror').innerText ="";
position_state = true;
}
checkform();
}
function ZWMonfocu(){
document.getElementById('ZWMerror').innerText ="";
}
//密码password
function MMonblus(){
var password=document.getElementById("password");
var re = /^(?=.*\d)(?=.*[a-zA-Z])[\da-zA-Z]{8}$/;
// var reg=/[A-Za-z].*[0-9]|[0-9].*[A-Za-z]/;
if(password.value==""){
document.getElementById('MMerror').innerText="请输入密码!";
password_state = false;
}
else if(password.value.length != 8){
document.getElementById('MMerror').innerText="格式错误,密码长度为8位!";
password_state = false;
} else if(!re.test(password.value)){
document.getElementById('MMerror').innerText="格式错误,必须包含英文字母和数字!";
password_state = false;
}
else {
document.getElementById('MMerror').innerText ="";
password_state = true;
}
checkform();
}
function MMonfocu(){
document.getElementById('MMerror').innerText ="";
} // 确认密码confirmPassword
function QRMMonblus(){
var password=document.getElementById("password");
var confirmPassword=document.getElementById("confirmPassword");
if(confirmPassword.value==""){
document.getElementById('QRMMerror').innerText="请输入确认密码!";
confirmPassword_state = false;
}
else if(password.value != confirmPassword.value){
document.getElementById('QRMMerror').innerText="两次密码输入不一致!";
confirmPassword_state = false;
}
else {
document.getElementById('QRMMerror').innerText ="";
confirmPassword_state = true;
}
checkform();
}
function QRMMonfocu(){
document.getElementById('QRMMerror').innerText ="";
} function checkform() {
if (!(Name_state && workid_state && position_state && password_state && confirmPassword_state)) {
registerbtn.setAttribute("disabled", "");
$("#submit").removeClass("readySubmit");
} else {
registerbtn.removeAttribute("disabled");
$("#submit").addClass("readySubmit");
}
}
function validate() {
return confirm("确定提交注册信息?");
}
Login.jsp 注册 代码
原理,将注册信息在js中检查,符合标准后,传入jsp,插入数据库,检索成功即可注册成功,否则返回重新注册。
调试多次,发现,插入数据时与查询数据代码并不类似。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.sql.*"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
/* //createStatement()创建一个 Statement对象来将 SQL语句发送到数据库。从数据库里面取东西对比 */
/* login */ Class.forName("org.postgresql.Driver");
Connection connect = DriverManager.getConnection("jdbc:postgresql://localhost:5432/EC System","postgres","123569");
/* load */
String sql = "insert into users (name,password,workid,position) values (?,?,?,?)";
PreparedStatement stmt=connect.prepareStatement(sql);
request.setCharacterEncoding("UTF-8");
String name = request.getParameter("name");/* 使用 request.getParameter() 方法来获取表单参数的值 */
String password = request.getParameter("fipassword");
String workid = request.getParameter("workid");
String position = request.getParameter("position");
stmt.setString(1,name);
stmt.setString(2,password);
stmt.setString(3,workid);
stmt.setString(4,position);
int n=stmt.executeUpdate();
if(n==1){
out.println("TRUE");
out.println("<script language = 'javaScript'> alert('注册成功,请重新登录!');</script>");
response.setHeader("refresh","1;url = ../html/EC-Home.html");
}else{
out.println("ERROR");
out.println("<script language = 'javaScript'> alert('注册失败,请按要求填写信息,重新注册!');</script>");
response.setHeader("refresh","1;url = ../html/Login.html");
}
stmt.close();
connect.close();
%>
</body>
</html>
jsp+postgresql学习笔记(1)用户登录与注册的更多相关文章
- PostgreSQL学习笔记(九) 用户、角色、权限管理
PostgreSQL是一个多用户数据库,可以为不同用户指定允许的权限. 角色PostgreSQL使用角色的概念管理数据库访问权限. 根据角色自身的设置不同,一个角色可以看做是一个数据库用户,或者一组数 ...
- mysql颠覆实战笔记(三)-- 用户登录(二):保存用户操作日志的方法
版权声明:笔记整理者亡命小卒热爱自由,崇尚分享.但是本笔记源自www.jtthink.com(程序员在囧途)沈逸老师的<web级mysql颠覆实战课程 >.如需转载请尊重老师劳动,保留沈逸 ...
- mysql颠覆实战笔记(二)-- 用户登录(一):唯一索引的妙用
版权声明:笔记整理者亡命小卒热爱自由,崇尚分享.但是本笔记源自www.jtthink.com(程序员在囧途)沈逸老师的<web级mysql颠覆实战课程 >.如需转载请尊重老师劳动,保留沈逸 ...
- Django:学习笔记(9)——用户身份认证
Django:学习笔记(9)——用户身份认证 User
- Django实战(一)-----用户登录与注册系统5(图片验证码)
为了防止机器人频繁登录网站或者破坏分子恶意登录,很多用户登录和注册系统都提供了图形验证码功能. 验证码(CAPTCHA)是一种区分用户是计算机还是人的公共全自动程序. 可以防止恶意破解密码.刷票.论坛 ...
- 使用PHP实现用户登录和注册的功能
登陆界面 login.php <form action="logincheck.php" method="post"> 用户名:<input ...
- Django用户登录与注册系统
一.创建项目 1.1.创建项目和app python manage.py startproject mysite_login python manage.py startapp login 1.2.设 ...
- Django实战(一)-----用户登录与注册系统2(数据模型、admin后台、路由视图)
使用Django开发Web应用的过程中,很多人都是急急忙忙地写视图,写前端页面,把最根本的模型设计给忽略了. 模型中定义了数据如何在数据库内保存,再直白点说就是数据表的定义.这部分工作体现在Djang ...
- Java入门:用户登录与注册模块1(实践项目)——分析
任务描述:用户登录与注册是大多数软件都拥有的一个模块.请编写一个控制台程序,实现用户的登录与注册功能,并且用户能够修改自己信息. [需求分析]由于本程序是一个演示程序,用户的信息我们做简化处理,仅包括 ...
随机推荐
- 关于HTTP协议学习(三)
一,目录结构 HTTPS HTTP/2 HTTP 安全 HTTP 面试 HTTP 爬虫 HTTP 资源 HTTP 抓包工具及教程 Chrome HTTP 插件 HTTP 代理服务器 HTTP 图书 二 ...
- 严重:one or more listeners failed. Full details will be found in the appropriate container log file
one or more listeners failed. Full details will be found in the appropriate container log file 这句话 ...
- Redis的持久化之RDB方式
RDB方式 Redis是默认支持的 优势:只有一个文件,时间间隔的数据,可以归档为一个文件,方便压缩转移(就一个文件) 劣势:如果宕机,数据损失比较大,因为它是没一个时间段进行持久化操作的.也就是积攒 ...
- vue-cli +echarts-amap集成echarts和高德地图TypeError: Cannot read property 'dataToPoint' of null解决方案
由于项目的需求,需要做一种迁徙效果, 最后我们采用了组件化开发,可以说这个坑自己一个人踩,有点累,但也收获不少. vue-cli +echarts-amap集成echarts和高德地图,出现报错,错误 ...
- 出现error: command 'x86_64-linux-gnu-gcc' failed with exit status 1
查看自己python的版本,然后下载自己版本Python的devel,比如python3.6.8就是 sudo apt-get install python3.6-dev
- ESP8266 RTOS SDK烧写环境构建
简介 esptool是一个Python软件程序,适用于ESP8266等一系列芯片的烧写,灵活高效. 环境构建 在官网下载安装最新2.7版python (linux和os x一般会自带python2.7 ...
- 2018-2019-2 网络对抗技术 20165321 Exp6 信息搜集与漏洞扫描
1.实践目标 掌握信息搜集的最基础技能与常用工具的使用方法. 2.实践内容 (1)各种搜索技巧的应用 百度查找IP地址: 查了一下kali的IP地址 https://fofa.so/的使用: 查询了一 ...
- MongoDB3.2新特性之文档验证
官方参考: https://docs.mongodb.org/master/core/document-validation/ 文档验证是3.2的重要新特性,添加验证条件的情形无非两种,一是在创建集合 ...
- 再次聊一聊promise settimeout asycn awiat执行顺序---js执行机制 EVENT LOOP
首先js是单线程 分为同步和异步,异步又分为(macrotask 宏任务 和 microtask微任务 ), 这图还是很清晰嘛,再来一张 总结一下,就是遇到同步先执行同步,异步的丢到一边依次排队,先排 ...
- 混合开发使用Chrome Inspect调试WebView预览手机界面和定位元素
使用Chrome Inspect调试混合应用可以帮助我们排查问题.例如定位元素,快速修改CSS样式并实时查看效果.其实微信开发也是一种混合开发模式,微信可以看做一个原生的Android App搭配了一 ...