添加歌曲
歌曲名称: |
歌手名字: |
歌曲封面: |
歌曲地区: |
歌曲时长: |
上传用户: |
jsp动态页面,css样式,struts2,hibernate,sql server
1.在myelipse里发布项目,并启动tomcat。
2.打开chrome,在地址栏输入http://localhost:8080/项目名/
3.输入数据库内预存的用户名密码,以及当前生成的验证码即可登录。
1.新建项目
2.构建struts2环境。将struts2所需的jar包拷入WebRoot->WEB-INF->lib中
在src目录下创建struts.xml
内容如下:
将WebRoot->WEB-INF->web.xml内容修改如下:
aa
action
org.apache.struts2.dispatcher.filter.StrutsPrepareAndExecuteFilter
action
/*
login.jsp
3.将sql server驱动拷入WebRoot->WEB-INF->lib中。(sqljdbc42.jar)
4.建立数据库
右键数据库->新建数据库
打开数据库AA,点击新建查询。
输入如下sql语句。
create table userTable
(
id int identity(1,1) primary key not null,
username varchar(20) not null,
password varchar(50) not null,
email varchar(20) not null,
birthday date not null,
idnumber varchar(20) not null,
sex varchar(10) not null,
qualify varchar(50) not null
)
create table musicTable
(
id int identity(1,1) primary key not null,
uploader varchar(20) not null,
songtitle varchar(30) not null,
singer varchar(30) not null,
songimg varchar(20) not null,
audiolength varchar(20) not null,
songarea varchar(20) not null
)
insert into userTable values('root','root0000','[email protected]','1995-01-06','140211199701253265','男','大学本科')
insert into userTable values('root1','root10000','[email protected]','1995-02-06','140211199801253265','女','大学本科')
insert into userTable values('root2','root20000','[email protected]','1995-03-06','140211199901253265','男','专科')
insert into userTable values('root3','root30000','[email protected]','1995-04-06','140211199001253265','女','大学本科')
insert into userTable values('root4','root40000','[email protected]','1995-05-06','140211199701253265','男','大学本科')
insert into musicTable values('root','圣诞又至','鹿晗','1.jpg','04:40','内地')
insert into musicTable values('root1','狐狸','薛之谦','2.jpg','03:40','内地')
insert into musicTable values('root2','绒花','韩红','3.jpg','04:40','内地')
insert into musicTable values('root3','感觉自己是巨星','毛不易','4.jpg','04:30','内地')
insert into musicTable values('root4','易燃易爆炸','陈粒','5.jpg','04:40','内地')
insert into musicTable values('root','我在未来等你','齐秦','6.jpg','03:40','港台')
insert into musicTable values('root1','灰色 ','徐佳莹','7.jpg','04:40','港台')
insert into musicTable values('root2','叙述','毛不易','8.jpg','04:30','港台')
insert into musicTable values('root3','他不知道','陈志朋','9.jpg','03:40','港台')
insert into musicTable values('root4','凤凰于飞','林俊杰','10.jpg','04:43','港台')
insert into musicTable values('root','We Are The Brave','Lenka','11.jpg','04:40','欧美')
insert into musicTable values('root1','Thuunder','Dragons','12.jpg','03:40','欧美')
insert into musicTable values('root2','Perfect Duct','Beyonce','13.jpg','04:43','欧美')
insert into musicTable values('root3','Again Noah','Cyrus ','14.jpg','04:40','欧美')
insert into musicTable values('root4','Stir Fry','Migos','15.jpg','03:40','欧美')
insert into musicTable values('root','道','宇多田','16.jpg','04:30','日本')
insert into musicTable values('root1','Welcome To Tokyo','三代目','17.jpg','04:40','日本')
insert into musicTable values('root2','恋','星野源','18.jpg','04:40','日本')
insert into musicTable values('root3','极乐净土','GarniDelia','19.jpg','04:40','日本')
insert into musicTable values('root4','GoodBye Happiness','宇多田','20.jpg','04:40','日本')
insert into musicTable values('root','苦恼','Gary','21.jpg','04:40','韩国')
insert into musicTable values('root1','Birthday Remix','朴宰范','22.jpg','04:40','韩国')
insert into musicTable values('root2','Do My Thing','Beon','23.jpg','04:40','韩国')
insert into musicTable values('root3','Hello','SecenTeen','24.jpg','04:40','韩国')
insert into musicTable values('root4','I Just Red ','Velvet','25.jpg','04:40','韩国')
单击执行
右键登录名->新建登录名
单击确定
连接对象资源管理器
5.myeclipse连接数据库
右键->new
在src目录下建立四个包:action、bean、config、method
6.配置hibernate环境
7.hibernate自动关联数据库
结束之后,目录是这样。
8.在WebRoot目录下建立jsp页面:
add.jsp,del.jsp,error.jsp,hongkong.jsp,japan.jsp,korea,jsp,local.jsp,login.jsp,main.jsp,prelogout.jsp,register.jsp,registersucc.jsp,result.jsp,update.jsp,usa.jsp等页面。
各页面内容如下:
add.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
主页
添加歌曲
歌曲名称:
歌手名字:
歌曲封面:
歌曲地区:
歌曲时长:
上传用户:
del.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
主页
是否确定删除歌曲?
error.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
error
error!
hongkong.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
hongkong
japan.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
japan
korea,jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
korea
local.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
local
login.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
login
注册
main.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
主页
prelogout.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
register
3秒后,跳转到登录页面。
register.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
register
registersucc.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
跳转
注册成功!3秒后跳转到登录页面。
result.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
主页
搜索结果 找到 首歌曲
修改
删除
update.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
主页
修改歌曲
usa.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
usa
在WebRoot目录建立css文件夹,新建css文件,style.css,style1.css,style2.css,style3.css。
style.css
[genuitec-file-id="wc1-1"],[genuitec-lp-path="/ss/WebRoot/css/style.css"],[genuitec-lp-enabled=false]{
/* for codelive */
}
body {
background: rgb(250,250,250);
margin: 0px;
padding: 0px;
font-size: 15px;
font-family: 'Microsoft Yahei', Tahoma, Helvetica, Arial, sans-serif;
}
.head {
width: 100%;
height: 60px;
min-width: 1000px;
background: #222;
text-align: center;
}
.headcenter {
width: 1000px;
margin: 0 auto;
background: #222;
}
.logo-box {
margin: 0px;
padding: 0px;
width: 97px;
height: 60px;
float: left;
}
.search-box {
width: 360px;
height: 60px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.center-box {
width: 483px;
height: 60px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
div.search {
padding:10px 0;
}
form {
position:relative;
width:262px;
margin:0 auto;
}
input,button {
border:none;
outline:none;
}
input {
width:100%;
height:32px;
color: rgb(252,250,232);
}
button {
height:0px;
width:0px;
color: rgb(252,250,232);
cursor:pointer;
position:absolute;
}
.bar7 form {
height:20px;
}
.bar7 input {
width:250px;
border-radius:42px;
border:1px solid rgb(102,204,0);
background:#222;
transition:.3s linear;
float:right;
}
.bar7 input:focus {
width:300px;
}
.bar7 button {
background:none;
right: 45px;
top: 7px;
}
.bar7 button:before {
content:"Search";
font-family:FontAwesome;
color:rgb(252,250,232);
}
.reset {
width: 60px;
height: 60px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.banner {
width: 100%;
height: 38px;
min-width: 1000px;
background: #222;
text-align: center;
}
.banner-center {
width: 1000px;
margin: 0 auto;
background: #222;
}
.banner-li-box {
width: 480px;
height: 38px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.banner-li-box ul li a {
display: block;
padding: 9px 6px 11px 6px;
margin: 0px;
}
.banner-li-box a:link,
.banner-li-box a:visited {
color: #fff;
text-decoration: none;
}
.banner-li-box a:hover {
color: rgb(102,204,0);
text-decoration: none;
background: url(../img/hover.png) no-repeat;
}
.banner-li-box-center {
width: 360px;
height: 38px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.downandadd {
width: 160px;
height: 38px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.downandadd ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.downandadd ul li {
float: left;
text-align: center;
width: 80px;
}
.downandadd ul li a {
display: block;
padding: 9px 6px 11px 6px;
margin: 0px;
}
.downandadd a:link,
.downandadd a:visited {
color: #fff;
text-decoration: none;
}
.downandadd a:hover {
color: rgb(102,204,0);
text-decoration: none;
background: url(../img/hover.png) no-repeat;
}
.reset ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.reset ul li {
float: left;
text-align: center;
width: 60px;
}
.reset ul li a {
display: block;
padding: 20px 6px 11px 6px;
margin: 0px;
}
.reset a:link,
.reset a:visited {
color: #fff;
text-decoration: none;
}
.reset a:hover {
color: rgb(102,204,0);
text-decoration: none;
}
.banner-li-box ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.banner-li-box ul li {
float: left;
text-align: center;
width: 80px;
}
.main {
width: 100%;
height: 580px;
min-width: 1000px;
background: rgba(250, 250, 250,0);
text-align: center;
}
.main-center {
width: 1000px;
margin: 0 auto;
background: rgba(255, 255, 255,0);
}
.center-up-up {
width: 1000px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgb(250, 250, 250);
float: left;
}
.center-up-up h2{
float: left;
}
.center-up {
width: 1000px;
height: 480px;
margin: 0px;
padding: 0px;
background: url(../img/bac.png);
border-radius: 5px 5px 5px 5px;
float: left;
}
.center-down {
width: 1000px;
height: 40px;
margin: 0px;
padding: 0px;
background: #222;
color: #fff;
float: left;
border-radius: 5px 5px 5px 5px;
}
.center-down ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.center-down ul li {
float: left;
text-align: center;
width: 60px;
}
.center-down ul li a {
display: block;
padding: 9px 6px 11px 6px;
margin: 0px;
}
.center-down a:link,
.center-down a:visited {
color: #fff;
text-decoration: none;
}
.center-down a:hover {
color: rgb(102,204,0);
text-decoration: none;
background: url(../img/hoverdown.png) no-repeat;
}
.footer {
width: 100%;
height: 60px;
min-width: 1000px;
background: #222;
text-align: center;
}
.footer h4{
color: #fff;
}
.song-box {
width: 990px;
height: 470px;
margin: 5px 5px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.song {
margin: 3.5px 2.5px 3px 3.5px;
padding: 0px;
width: 487px;
height: 150px;
border:0.1px solid #222;
background: url(../img/songbac.png) no-repeat;
float: left;
border-radius: 5px;
}
.one {
width: 150px;
height: 150px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0.7);
float: left;
border-radius: 5px 0px 0px 5px;
}
.one img {
width: 150px;
height: 150px;
border-radius: 5px 0px 0px 5px;
}
.two {
width: 187px;
height: 150px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0.7);
float: left;
}
.three {
width: 150px;
height: 150px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0.7);
float: left;
border-radius: 0px 5px 5px 0px;
}
.two-1 {
width: 187px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.two-2 {
width: 187px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.two-3 {
width: 187px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.three-1 {
width: 150px;
height: 75px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
border-radius: 0px 5px 0px 0px;
}
.three-2 {
width: 150px;
height: 75px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
border-radius: 0px 0px 5px 0px;
}
.update{
margin: 20px 25px 20px 25px;
padding: 0px;
width: 100px;
height: 35px;
border:1px solid #222;
background-color: rgba(255,255,255,0);
line-height: 30px;
text-align: center;
border-radius: 5px 5px 5px 5px;
}
.delete{
margin: 20px 25px 20px 25px;
padding: 0px;
width: 100px;
height: 35px;
border:1px solid #222;
background-color: rgba(255,255,255,0);
line-height: 30px;
text-align: center;
border-radius: 5px 5px 5px 5px;
}
.update a {
display: block;
padding: 2.5px 2.5px 2.5px 2.5px;
margin: 0px;
border-radius: 3px 3px 3px 3px;
}
.update a:link,
.update a:visited {
color: #222;
text-decoration: none;
}
.update a:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
.delete a {
display: block;
padding: 2.5px 2.5px 2.5px 2.5px;
margin: 0px;
border-radius: 3px 3px 3px 3px;
}
.delete a:link,
.delete a:visited {
color: #222;
text-decoration: none;
}
.delete a:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
style1.css
[genuitec-file-id="wc1-2"],[genuitec-lp-path="/ss/WebRoot/css/style1.css"],[genuitec-lp-enabled=false]{
/* for codelive */
}
body {
background: rgb(250,250,250);
margin: 0px;
padding: 0px;
font-size: 15px;
font-family: 'Microsoft Yahei', Tahoma, Helvetica, Arial, sans-serif;
}
.head {
width: 100%;
height: 60px;
min-width: 1000px;
background: #222;
text-align: center;
}
.headcenter {
width: 1000px;
margin: 0 auto;
background: #222;
}
.logo-box {
margin: 0px;
padding: 0px;
width: 97px;
height: 60px;
float: left;
}
.search-box {
width: 360px;
height: 60px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.center-box {
width: 483px;
height: 60px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
div.search {
padding:10px 0;
}
form {
position:relative;
width:262px;
margin:0 auto;
}
input,button {
border:none;
outline:none;
}
input {
width:100%;
height:32px;
color: #222;
}
button {
height:0px;
width:0px;
color: rgb(252,250,232);
cursor:pointer;
position:absolute;
}
.bar7 form {
height:20px;
}
.bar7 input {
width:250px;
border-radius:42px;
border:1px solid rgb(102,204,0);
background:#222;
transition:.3s linear;
float:right;
}
.bar7 input:focus {
width:300px;
}
.bar7 button {
background:none;
right: 45px;
top: 7px;
}
.bar7 button:before {
content:"Search";
font-family:FontAwesome;
color:rgb(252,250,232);
}
.reset {
width: 60px;
height: 60px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.banner {
width: 100%;
height: 38px;
min-width: 1000px;
background: #222;
text-align: center;
}
.banner-center {
width: 1000px;
margin: 0 auto;
background: #222;
}
.banner-li-box {
width: 480px;
height: 38px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.banner-li-box ul li a {
display: block;
padding: 9px 6px 11px 6px;
margin: 0px;
}
.banner-li-box a:link,
.banner-li-box a:visited {
color: #fff;
text-decoration: none;
}
.banner-li-box a:hover {
color: rgb(102,204,0);
text-decoration: none;
background: url(../img/hover.png) no-repeat;
}
.banner-li-box-center {
width: 360px;
height: 38px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.downandadd {
width: 160px;
height: 38px;
margin: 0px;
padding: 0px;
background: #222;
float: left;
}
.downandadd ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.downandadd ul li {
float: left;
text-align: center;
width: 80px;
}
.downandadd ul li a {
display: block;
padding: 9px 6px 11px 6px;
margin: 0px;
}
.downandadd a:link,
.downandadd a:visited {
color: #fff;
text-decoration: none;
}
.downandadd a:hover {
color: rgb(102,204,0);
text-decoration: none;
background: url(../img/hover.png) no-repeat;
}
.reset ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.reset ul li {
float: left;
text-align: center;
width: 60px;
}
.reset ul li a {
display: block;
padding: 20px 6px 11px 6px;
margin: 0px;
}
.reset a:link,
.reset a:visited {
color: #fff;
text-decoration: none;
}
.reset a:hover {
color: rgb(102,204,0);
text-decoration: none;
}
.banner-li-box ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.banner-li-box ul li {
float: left;
text-align: center;
width: 80px;
}
.main {
width: 100%;
height: 580px;
min-width: 1000px;
background: rgba(250, 250, 250,0);
text-align: center;
}
.main-center {
width: 1000px;
margin: 0 auto;
background: rgba(255, 255, 255,0);
}
.center-up-up {
width: 1000px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgb(250, 250, 250);
float: left;
}
.center-up-up h2{
float: left;
}
.center-up {
width: 1000px;
height: 480px;
margin: 0px;
padding: 0px;
background: url(../img/bac.png);
border-radius: 5px 5px 5px 5px;
float: left;
}
.center-down {
width: 1000px;
height: 40px;
margin: 0px;
padding: 0px;
background: #222;
color: #fff;
float: left;
border-radius: 5px 5px 5px 5px;
}
.center-down ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}
.center-down ul li {
float: left;
text-align: center;
width: 60px;
}
.center-down ul li a {
display: block;
padding: 9px 6px 11px 6px;
margin: 0px;
}
.center-down a:link,
.center-down a:visited {
color: #fff;
text-decoration: none;
}
.center-down a:hover {
color: rgb(102,204,0);
text-decoration: none;
background: url(../img/hoverdown.png) no-repeat;
}
.footer {
width: 100%;
height: 60px;
min-width: 1000px;
background: #222;
text-align: center;
}
.footer h4{
color: #fff;
}
.song-box {
width: 990px;
height: 470px;
margin: 5px 5px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.song {
margin: 3.5px 2.5px 3px 3.5px;
padding: 0px;
width: 487px;
height: 150px;
border:0.1px solid #222;
background: url(../img/songbac.png) no-repeat;
float: left;
border-radius: 5px;
}
#submit{
margin:20px 0px 1px 0px;
height:38px;
display: block;
border:1px solid #222;
border-radius: 5px;
}
#submit:link,
#submit:visited {
color: #222;
text-decoration: none;
}
#submit:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
#inp{
border:1px solid #222;
border-radius: 5px;
width: 185px;
height: 35px;
}
#formf{
margin:50px auto auto 350px;
}
.one {
width: 150px;
height: 150px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0.7);
float: left;
border-radius: 5px 0px 0px 5px;
}
.one img {
width: 150px;
height: 150px;
border-radius: 5px 0px 0px 5px;
}
.two {
width: 187px;
height: 150px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0.7);
float: left;
}
.three {
width: 150px;
height: 150px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0.7);
float: left;
border-radius: 0px 5px 5px 0px;
}
.two-1 {
width: 187px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.two-2 {
width: 187px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.two-3 {
width: 187px;
height: 50px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
}
.three-1 {
width: 150px;
height: 75px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
border-radius: 0px 5px 0px 0px;
}
.three-2 {
width: 150px;
height: 75px;
margin: 0px;
padding: 0px;
background: rgba(255,255,255,0);
float: left;
border-radius: 0px 0px 5px 0px;
}
.update{
margin: 20px 25px 20px 25px;
padding: 0px;
width: 100px;
height: 35px;
border:1px solid #222;
background-color: rgba(255,255,255,0);
line-height: 30px;
text-align: center;
border-radius: 5px 5px 5px 5px;
}
.delete{
margin: 20px 25px 20px 25px;
padding: 0px;
width: 100px;
height: 35px;
border:1px solid #222;
background-color: rgba(255,255,255,0);
line-height: 30px;
text-align: center;
border-radius: 5px 5px 5px 5px;
}
.update a {
display: block;
padding: 2.5px 2.5px 2.5px 2.5px;
margin: 0px;
border-radius: 3px 3px 3px 3px;
}
.update a:link,
.update a:visited {
color: #222;
text-decoration: none;
}
.update a:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
.delete a {
display: block;
padding: 2.5px 2.5px 2.5px 2.5px;
margin: 0px;
border-radius: 3px 3px 3px 3px;
}
.delete a:link,
.delete a:visited {
color: #222;
text-decoration: none;
}
.delete a:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
.areabutton{
margin: 0px 6px 0px -5px;
width: 142px;
height: 35px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
}
style2.css
[genuitec-file-id="wc1-3"],[genuitec-lp-path="/ss/WebRoot/css/style2.css"],[genuitec-lp-enabled=false]{
/* for codelive */
}
.body {
background: blue;
margin: 0px;
padding: 0px;
font-size: 15px;
font-family: 'Microsoft Yahei', Tahoma, Helvetica, Arial, sans-serif;
}
.head {
width: 100%;
height: 100px;
min-width: 1000px;
background: #fff;
text-align: center;
}
.head-center {
width: 1000px;
margin: 0 auto;
background: #fff;
}
.logo-box {
margin: 0px;
padding: 0px;
width: 97px;
height: 60px;
float: left;
}
.middle {
width: 100%;
height: 330px;
min-width: 1000px;
background: #A6D4AF;
text-align: center;
}
.middle-center {
width: 1000px;
margin: 0 auto;
background: url(../img/kk.png) no-repeat;
}
.welcom {
margin: 0px;
padding: 0px;
width: 1000px;
height: 330px;
background: url(../img/TIM截图20171226230438.png);
}
.form {
/* margin: 0px 0px 0px 0px; */
/* padding: 0px; */
width: 344px;
height: 330px;
/* float:float;
border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
background:rgba(250,250,250,0.4);
}
.footer {
width: 100%;
height: 60px;
min-width: 1000px;
background: #fff;
text-align: center;
}
.foot {
width: 1000px;
margin: 0 auto;
background: #fff;
}
.foot-two {
margin: 0px;
padding: 0px;
width: 1000px;
height: 60px;
background: #fff;
}
.error-left{
width: 300px;
height: 60px;
float:left;
}
.one {
margin: 5px 0px 5px 20px;
padding: 25px 0px 0px 0px;
width: 304px;
height: 38px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
}
.one-left {
margin: 5px 5px 5px 5px;
width: 142px;
height: 38px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
float: left;
}
#submit{
width: 145px;
height: 40px;
display: block;
border:1px solid #222;
border-radius: 3px 3px 3px 3px;
font-size: 18px;
font-family: 'Microsoft Yahei';
}
#submit:link,
#submit:visited {
color: #222;
text-decoration: none;
}
#submit:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
.one-right {
margin: 5px 5px 5px 5px;
width: 142px;
height: 38px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
float: left;
}
.one-button {
width: 304px;
height: 38px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
}
.one-left-button {
margin: 0px 6px 0px -5px;
width: 142px;
height: 38px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
}
.one-right-button {
margin: 0px 0px 0px 6px;
width: 142px;
height: 38px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
float: left;
}
.one-rr{
margin: 5px 5px 5px 5px;
width: 142px;
height: 30px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
float: left;
font-size: 18px;
font-family: 'Microsoft Yahei';
}
.one-rr a:link,
.one-rr a:visited {
color: #222;
background:url(../img/registerb.png) np-repeat;
text-decoration: none;
}
.one-rr a:hover {
color: #222;
text-decoration: none;
background: url(../img/register.png) no-repeat;
}
.error{
list-style-type: none;
color:red;
}
style3.css
[genuitec-file-id="wc1-4"],[genuitec-lp-path="/ss/WebRoot/css/style4.css"],[genuitec-lp-enabled=false]{
/* for codelive */
}
.body {
background: blue;
margin: 0px;
padding: 0px;
font-size: 15px;
font-family: 'Microsoft Yahei', Tahoma, Helvetica, Arial, sans-serif;
}
.head {
width: 100%;
height: 100px;
min-width: 1000px;
background: #fff;
text-align: center;
}
.head-center {
width: 1000px;
margin: 0 auto;
background: #fff;
}
.logo-box {
margin: 0px;
padding: 0px;
width: 97px;
height: 60px;
float: left;
}
.middle {
width: 100%;
height: 330px;
min-width: 1000px;
background: #A6D4AF;
text-align: center;
}
.middle-center {
width: 1000px;
margin: 0 auto;
background: url(../img/kk.png) no-repeat;
}
.welcom {
margin: 0px;
padding: 0px;
width: 1000px;
height: 330px;
background: url(../img/TIM截图20171226230438.png);
}
.form {
/* margin: 0px 0px 0px 0px; */
/* padding: 0px; */
width: 344px;
height: 330px;
/* float:float;
border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
background:rgba(250,250,250,0.4);
}
.footer {
width: 100%;
height: 60px;
min-width: 1000px;
background: #fff;
text-align: center;
}
.foot {
width: 1000px;
margin: 0 auto;
background: #fff;
}
.foot-two {
margin: 0px;
padding: 0px;
width: 1000px;
height: 60px;
background: #fff;
}
.error-left{
width: 300px;
height: 60px;
float:left;
}
.one {
margin: 3px 0px 3px 20px;
padding: 8px 0px 0px 0px;
width: 304px;
height: 35px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
}
.one-left {
margin: 5px 5px 5px 5px;
width: 142px;
height: 35px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
float: left;
}
#submit{
width: 145px;
height: 40px;
display: block;
border:1px solid #222;
border-radius: 3px 3px 3px 3px;
font-size: 18px;
font-family: 'Microsoft Yahei';
}
#submit:link,
#submit:visited {
color: #222;
text-decoration: none;
}
#submit:hover {
color: rgb(255,255,255);
text-decoration: none;
background: #222;
}
.one-right {
margin: 5px 5px 5px 5px;
width: 142px;
height: 35px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
float: left;
}
.one-button {
width: 304px;
height: 35px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
}
.one-left-button {
margin: 0px 6px 0px -5px;
width: 142px;
height: 35px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
}
.one-right-button {
margin: 0px 0px 0px 6px;
width: 142px;
height: 35px;
border-radius: 3px 3px 3px 3px;
border: 1px solid #222;
background: rgba(2, 2, 2, 0);
float: left;
}
.one-rr{
margin: 5px 5px 5px 5px;
width: 142px;
height: 30px;
background: rgba(2, 2, 2, 0);
/* border-radius: 3px 3px 3px 3px;
border:1px solid #222; */
float: left;
font-size: 18px;
font-family: 'Microsoft Yahei';
}
.one-rr a:link,
.one-rr a:visited {
color: #222;
background:url(../img/registerb.png) np-repeat;
text-decoration: none;
}
.one-rr a:hover {
color: #222;
text-decoration: none;
background: url(../img/register.png) no-repeat;
}
.error{
list-style-type: none;
color:red;
}
新建text目录、img目录。
在src目录下创建三个java类,CreateImageAction.java,MusicTableAction.java,UserTable.java。
CreateImageAction.java
package action;
import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.ByteArrayInputStream;
import java.io.ByteArrayOutputStream;
import java.util.Random;
import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;
public class CreateImageAction extends ActionSupport {
private ByteArrayInputStream inputStream;
private static int WIDTH = 142;
private static int HEIGHT = 38;
public ByteArrayInputStream getInputStream() {
return inputStream;
}
public void setInputStream(ByteArrayInputStream inputStream) {
this.inputStream = inputStream;
}
private static String createRandom() {
String str = "0123456789qwertyuiopasdfghjklzxcvbnm";
char[] rands = new char[4];
Random random = new Random();
for (int i = 0; i < 4; i++) {
rands[i] = str.charAt(random.nextInt(36));
}
return new String(rands);
}
private void drawBackground(Graphics g) {
// 画背景
g.setColor(new Color(166,212,175));
g.fillRect(0, 0, WIDTH, HEIGHT);
// 随机产生 120 个干扰点
for (int i = 0; i < 120; i++) {
int x = (int) (Math.random() * WIDTH);
int y = (int) (Math.random() * HEIGHT);
int red = (int) (Math.random() * 255);
int green = (int) (Math.random() * 255);
int blue = (int) (Math.random() * 255);
g.setColor(new Color(red, green, blue));
g.drawOval(x, y, 1, 0);
}
}
private void drawRands(Graphics g, String rands) {
g.setColor(new Color(42,76,43));
g.setFont(new Font(null, Font.BOLD, 40));
// 在不同的高度上输出验证码的每个字符
g.drawString("" + rands.charAt(0), 5, 30);
g.drawString("" + rands.charAt(1), 35, 30);
g.drawString("" + rands.charAt(2), 65, 30);
g.drawString("" + rands.charAt(3), 95, 30);
System.out.println(rands);
}
public String execute() throws Exception {
HttpServletResponse response = ServletActionContext.getResponse();
// 设置浏览器不要缓存此图片
response.setHeader("Pragma", "no-cache");
response.setHeader("Cache-Control", "no-cache");
response.setDateHeader("Expires", 0);
String rands = createRandom();
BufferedImage image = new BufferedImage(WIDTH, HEIGHT, BufferedImage.TYPE_INT_RGB);
Graphics g = image.getGraphics();
// 产生图像
drawBackground(g);
drawRands(g, rands);
// 结束图像 的绘制 过程, 完成图像
g.dispose();
ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
ImageIO.write(image, "jpeg", outputStream);
ByteArrayInputStream input = new ByteArrayInputStream(outputStream.toByteArray());
this.setInputStream(input);
HttpSession session = ServletActionContext.getRequest().getSession();
session.setAttribute("checkCode", rands);
input.close();
outputStream.close();
return SUCCESS;
}
}
MusicTableAction.java
package action;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.Iterator;
import java.util.List;
import org.apache.struts2.ServletActionContext;
import org.hibernate.Query;
import org.hibernate.Session;
import com.opensymphony.xwork2.ActionSupport;
import bean.MusicTable;
import config.HibernateSessionFactory;
import method.CreateTxt;
import method.ListToString;
public class MusicTableAction extends ActionSupport {
private MusicTable music;
private List list;
private List
UserTable.java
package action;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpSession;
import org.apache.struts2.ServletActionContext;
import org.hibernate.Query;
import org.hibernate.Session;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;
import bean.UserTable;
import config.HibernateSessionFactory;
public class UserTableAction extends ActionSupport {
private UserTable user;
private List list2;
private String checkCode;
// 登录
public String login() {
System.out.println("进入login成功!");
HttpSession session2 = ServletActionContext.getRequest().getSession();
boolean validated = false;
String usr = user.getUsername();
String pwd = user.getPassword();
String checkCode2 = (String) session2.getAttribute("checkCode");
Session session = HibernateSessionFactory.getSession();
session.beginTransaction();
String hql = "from UserTable WHERE username = ? AND password = ?";
try {
System.out.println(checkCode2);
List listx = session.createQuery(hql).setString(0, usr).setString(1, pwd).list();
if (usr.equals(listx.get(0)) && pwd.equals(listx.get(1)) && checkCode.equals(checkCode2))
validated = true;
ActionContext actionContext = ActionContext.getContext();
Map map = actionContext.getSession();
map.put(usr, user);
session.getTransaction().commit();
session.close();
return SUCCESS;
} catch (Exception e) {
return INPUT;
}
}
// 注册
public String register() {
System.out.println("进入register成功!");
Session session = HibernateSessionFactory.getSession();
session.beginTransaction();
Query query = session.createQuery("select id from UserTable");
UserTable user1 = new UserTable();
user1.setUsername(user.getUsername());
user1.setPassword(user.getPassword());
user1.setSex(user.getSex());
user1.setEmail(user.getEmail());
user1.setBirthday(user.getBirthday());
user1.setIdnumber(user.getIdnumber());
user1.setQualify(user.getQualify());
session.save(user1);
session.getTransaction().commit();
session.close();
return SUCCESS;
}
//登出
public String logout(){
System.out.println("进入logout成功!");
ActionContext actionContext = ActionContext.getContext();
Map map = actionContext.getSession();
map.remove(user);
return SUCCESS;}
// getters and setters
public UserTable getUser() {
return user;
}
public void setUser(UserTable user) {
this.user = user;
}
public List getList2() {
return list2;
}
public void setList2(List list2) {
this.list2 = list2;
}
public String getCheckCode() {
return checkCode;
}
public void setCheckCode(String checkCode) {
this.checkCode = checkCode;
}
}
在同目录下创建验证xml文件:UserTableAction-login-validation.xml,UserTableAction-register-validation.xml。
UserTableAction-login-validation.xml
true
请输入姓名
您输入的姓名只能是字母和数字,且长度在4到20之间
true
请输入密码
您输入的密码必须为六位数字
请输入验证码
#session.checkCode
验证码不正确
UserTableAction-register-validation.xml
true
请输入姓名
4
16
true
用户名必须为${minLength}至${maxLength}个字符!,当前为${user.username}
true
请输入密码
true
6
20
密码必须为${minLength}至${maxLength}个字符,当前为${user.password}
true
请输入邮箱地址!
必须输入有效的电子邮件地址!
18
18
身份证号必须为18位!
修改struts.xml如下
find
application/octet-stream
fileInputStream
attachment;filename="${downloadfileName}"
1024
download
/del.jsp
${music.id}
find
${music.id}
/update.jsp
find
find
${username}
/error.jsp
/login.jsp
/registersucc.jsp
/register.jsp
/login.jsp
/main.jsp
/local.jsp
/hongkong.jsp
/usa.jsp
/japan.jsp
/korea.jsp
/result.jsp
image/jpeg
inputStream
在method目录下新建两个类,CreateTxt.java,ListToString.java。
CreateTxt.java
package method;
import java.io.BufferedReader;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.PrintWriter;
import org.apache.struts2.ServletActionContext;
import action.MusicTableAction;
public class CreateTxt {
private String textpath;
private static String filenameTemp;
public boolean creatTxtFile(String name) throws IOException {
boolean flag = false;
filenameTemp = getTextpath() + name + ".txt";
File filename = new File(filenameTemp);
if (!filename.exists()) {
filename.createNewFile();
flag = true;
}
return flag;
}
public static boolean writeTxtFile(String newStr) throws IOException {
// 先读取原有文件内容,然后进行写入操作
boolean flag = false;
String filein = newStr + "\r\n";
String temp = "";
FileInputStream fis = null;
InputStreamReader isr = null;
BufferedReader br = null;
FileOutputStream fos = null;
PrintWriter pw = null;
try {
// 文件路径
File file = new File(filenameTemp);
// 将文件读入输入流
fis = new FileInputStream(file);
isr = new InputStreamReader(fis);
br = new BufferedReader(isr);
StringBuffer buf = new StringBuffer();
// 保存该文件原有的内容
for (int j = 1; (temp = br.readLine()) != null; j++) {
buf = buf.append(temp);
// System.getProperty("line.separator")
// 行与行之间的分隔符 相当于“\n”
buf = buf.append(System.getProperty("line.separator"));
}
buf.append(filein);
fos = new FileOutputStream(file);
pw = new PrintWriter(fos);
pw.write(buf.toString().toCharArray());
pw.flush();
flag = true;
} catch (IOException e1) {
// TODO 自动生成 catch 块
throw e1;
} finally {
if (pw != null) {
pw.close();
}
if (fos != null) {
fos.close();
}
if (br != null) {
br.close();
}
if (isr != null) {
isr.close();
}
if (fis != null) {
fis.close();
}
}
return flag;
}
public String getTextpath() {
System.out.println("这里是getTextpath!");
String p = ServletActionContext.getServletContext().getRealPath("/");
String q = p+"text/";
System.out.println(q);
return q;
}
public void setTextpath(String textpath) {
this.textpath = textpath;
}
}
ListToString.java
package method;
import java.util.List;
public class ListToString {
public String listToString(List list, char separator) {
StringBuilder sb = new StringBuilder();
for (int i = 0; i < list.size(); i++) {
sb.append(list.get(i));
if (i < list.size() - 1) {
sb.append(separator);
}
}
return sb.toString();
}
}
至此,项目建立完成,可发布至tomcat,并启动chrome查看。