1. 程式人生 > >登入註冊樣例(附帶輸入資訊檢驗) springmvc

登入註冊樣例(附帶輸入資訊檢驗) springmvc

1 註冊介面

<%@ 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 charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content
="IE=edge">
<title>買家註冊</title> <!-- Tell the browser to be responsive to screen width --> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- Font Awesome --> <link rel="stylesheet" href="${pageContext.request.contextPath}/conf1/css/font-awesome.min.css"
>
<!-- Ionicons --> <link rel="stylesheet" href="${pageContext.request.contextPath}/conf1/css/ionicons.min.css"> <!-- Theme style --> <link rel="stylesheet" href="${pageContext.request.contextPath}/conf1/dist/css/adminlte.min.css"> <!-- Google Font: Source Sans Pro -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" > </head> <script type="text/javascript"> function checkForm(){ if($.trim($("#name").val())==""){ alert("請填寫名字"); $("#name").focus(); return false; } if($("#name").val().length>50){ alert("名字長度不得大於50個字元"); $("#name").focus(); return false; } if($.trim($("#username").val())==""){ alert("請填寫使用者名稱"); $("#username").focus(); return false; } if($("#username").val().length>50){ alert("使用者名稱長度不得大於50個字元"); $("#username").focus(); return false; } if($.trim($("#password").val())==""){ alert("請填寫密碼"); $("#password").focus(); return false; } if($("#password").val().length>50){ alert("密碼長度不得大於50個字元"); $("#password").focus(); return false; } if($.trim($("#studentId").val())==""){ alert("請填寫學號"); $("#studentId").focus(); return false; } if($("#studentId").val().length>50){ alert("學號長度不得大於50個字元"); $("#studentId").focus(); return false; } if($.trim($("#className").val())==""){ alert("請填寫班級名字"); $("#className").focus(); return false; } if($("#className").val().length>50){ alert("班級名字長度不得大於50個字元"); $("#className").focus(); return false; } if($.trim($("#dormitoryNumber").val())==""){ alert("請填寫宿舍號"); $("#dormitoryNumber").focus(); return false; } if($("#dormitoryNumber").val().length>50){ alert("宿舍號長度不得大於50個字元"); $("#dormitoryNumber").focus(); return false; } if($.trim($("#signature").val())==""){ alert("請填寫個性簽名"); $("#signature").focus(); return false; } if($("#signature").val().length>50){ alert("個性簽名長度不得大於50個字元"); $("#signature").focus(); return false; } if($.trim($("#introduction").val())==""){ alert("請填寫自我介紹"); $("#introduction").focus(); return false; } if($("#introduction").val().length>5000){ alert("自我介紹長度不得大於5000個字元"); $("#introduction").focus(); return false; } if($.trim($("#pic").val())==""){ alert("請上傳校園卡照片"); $("#pic").focus(); return false; } return true; } </script> <% if ((String)request.getAttribute("status") == "success") { %> <script> alert("${info}"); </script> <%}%> <body> <div class="wrapper"> <jsp:include page="side_buyer.jsp"></jsp:include> <!-- Content Wrapper. Contains page content --> <div class="content-wrapper"> <!-- Content Header (Page header) --> <section class="content-header"> <div class="container-fluid"> <div class="row mb-2"> <div class="col-sm-6"> <h1>買家註冊</h1> </div> </div> </div><!-- /.container-fluid --> </section> <!-- Main content --> <section class="content"> <div class="container-fluid"> <div class="row"> <!-- left column --> <div class="col-12"> <!-- general form elements --> <div class="card card-primary"> <div class="card-header"> <h3 class="card-title">自身資訊</h3> </div> <!-- /.card-header --> <!-- form start --> <form role="form" method="post" enctype="multipart/form-data" onSubmit="return checkForm()" action="${pageContext.request.contextPath}/buyer/register.do"> <div class="card-body"> <div class="form-group"> <label for="exampleInputEmail1">名字</label> <input type="text" class="form-control" id="name" name="name" placeholder="Enter ..."> </div> <div class="form-group"> <label for="exampleInputEmail1">使用者名稱</label> <input type="text" class="form-control" id="username" name="username" placeholder="Enter ..."> </div> <div class="form-group"> <label for="exampleInputEmail1">密碼</label> <input type="text" class="form-control" id="password" name="password" placeholder="Enter ..."> </div> <div class="form-group"> <label>性別</label> <select class="form-control" id="sex" name="sex"> <option value="男"></option> <option value="女"></option> </select> </div> <div class="form-group"> <label for="exampleInputEmail1">學號</label> <input type="text" class="form-control" id="studentId" name="studentId" placeholder="Enter ..."> </div> <div class="form-group"> <label for="exampleInputEmail1">班級</label> <input type="text" class="form-control" id="className" name="className" placeholder="Enter ..."> </div> <div class="form-group"> <label for="exampleInputEmail1">宿舍號</label> <input type="text" class="form-control" id="dormitoryNumber" name="dormitoryNumber" placeholder="Enter ..."> </div> <div class="form-group"> <label for="exampleInputEmail1">個性簽名</label> <input type="text" class="form-control" id="signature" name="signature" placeholder="Enter ..."> </div> <div class="form-group"> <label>自我介紹</label> <textarea class="form-control" id="introduction" name="introduction" rows="10" placeholder="Enter ..."></textarea> </div> <div class="form-group"> <label for="pic">校園卡圖片</label> <div class="input-group"> <div class="custom-file"> <input type="file" class="" size="80" id="pic" name="pic"/> </div> </div> </div> </div> <div class="card-footer"> <button type="submit" class="btn btn-primary">提交</button> </div> </form> </div> <!-- /.card --> </div> <!-- /.row --> </div><!-- /.container-fluid --> </section> <!-- /.content --> </div> <!-- /.content-wrapper --> <footer class="main-footer"> <div class="float-right d-none d-sm-block"> <b></b> </div> <strong>Copyright &copy; 2018 <a href="#">中央財經大學</a>.</strong> All rights reserved. </footer> <!-- Control Sidebar --> <aside class="control-sidebar control-sidebar-dark"> <!-- Control sidebar content goes here --> </aside> <!-- /.control-sidebar --> </div> <!-- ./wrapper --> <!-- jQuery --> <script src="${pageContext.request.contextPath}/conf1/plugins/jquery/jquery.min.js"></script> <!-- Bootstrap 4 --> <script src="${pageContext.request.contextPath}/conf1/plugins/bootstrap/js/bootstrap.bundle.min.js"></script> <!-- FastClick --> <script src="${pageContext.request.contextPath}/conf1/plugins/fastclick/fastclick.js"></script> <!-- AdminLTE App --> <script src="${pageContext.request.contextPath}/conf1/dist/js/adminlte.min.js"></script> <!-- AdminLTE for demo purposes --> <script src="${pageContext.request.contextPath}/conf1/dist/js/demo.js"></script> </body> </html>

2 登入介面

<%@ 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 href="${pageContext.request.contextPath}/conf2/css/login.css" rel="stylesheet" rev="stylesheet" type="text/css" media="all" />
<script type="text/javascript" src="${pageContext.request.contextPath}/conf2/js/jQuery1.7.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/conf2/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/conf2/js/jquery1.42.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/conf2/js/jquery.SuperSlide.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/conf2/js/Validform_v5.3.2_min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    var $tab_li = $('#tab ul li');
    $tab_li.hover(function(){
        $(this).addClass('selected').siblings().removeClass('selected');
        var index = $tab_li.index(this);
        $('div.tab_box > div').eq(index).show().siblings().hide();
    }); 
});
</script>

<script type="text/javascript">
$(function(){
    $(".screenbg ul li").each(function(){
        $(this).css("opacity","0");
    });
    $(".screenbg ul li:first").css("opacity","1");
    var index = 0;
    var t;
    var li = $(".screenbg ul li"); 
    var number = li.size();
    function change(index){
        li.css("visibility","visible");
        li.eq(index).siblings().animate({opacity:0},3000);
        li.eq(index).animate({opacity:1},3000);
    }
    function show(){
        index = index + 1;
        if(index<=number-1){
            change(index);
        }else{
            index = 0;
            change(index);
        }
    }
    t = setInterval(show,8000);
    //根據視窗寬度生成圖片寬度
    var width = $(window).width();
    $(".screenbg ul img").css("width",width+"px");
});
</script>
</head>
</script>
<%
if ((String)request.getAttribute("status") == "success") { %>
    <script>
    alert("${info}");
    </script>

<%}%>

<body>
<div id="tab">
  <ul class="tab_menu">
    <li class="selected">買家登入</li>
    <li>賣家登入</li>
    <li>管理員登入</li>
  </ul>
  <div class="tab_box"> 
    <div>
      <div class="stu_error_box"></div>
      <form action="${pageContext.request.contextPath}/buyer/login.do" method="post" class="stu_login_error">
        <div id="username">
          <label>使用者名稱:</label>
          <input type="text" id="stu_username_hide" name="username" placeholder="輸入使用者名稱" />
        </div>
        <div id="password">
          <label>密&nbsp;&nbsp;&nbsp;碼:</label>
          <input type="password" id="stu_password_hide" name="password" placeholder="輸入密碼" />
        </div>
        <div id="username">
            <a href="${pageContext.request.contextPath}/buyer/index.do" >
            <span style="float:right;font-weight: bold;color: #3d96c9;">
                返回首頁&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            </span></a>
          <a href="${pageContext.request.contextPath}/views/buyer/register.jsp" >
            <span style="float:right;font-weight: bold;color: #3d96c9;">
                買家註冊&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            </span></a>
        </div>

        <div id="login">
          <button type="submit">登入</button>
        </div>
      </form>
    </div>

    <div class="hide">
     <div class="tea_error_box"></div>
      <form action="${pageContext.request.contextPath}/seller/login.do" method="post" class="tea_login_error">
        <div id="username">
          <label>使用者名稱:</label>
          <input type="text" id="tea_username_hide" name="username" placeholder="輸入使用者名稱" />
        </div>
        <div id="password">
          <label>密&nbsp;&nbsp;&nbsp;碼:</label>
          <input type="password" id="tea_password_hide" name="password" placeholder="輸入密碼" />
        </div>
        <div id="username">
        <a href="${pageContext.request.contextPath}/buyer/index.do" >
            <span style="float:right;font-weight: bold;color: #3d96c9;">
                返回首頁&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            </span></a>
          <a href="${pageContext.request.contextPath}/views/seller/register.jsp" >
            <span style="float:right;font-weight: bold;color: #3d96c9;">
                賣家註冊&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            </span></a>
        </div>
        <div id="login">
          <button type="submit">登入</button>
        </div>
      </form>
    </div>

    <div class="hide">
    <div class="sec_error_box"></div>
      <form action="${pageContext.request.contextPath}/admin/login.do" method="post" class="sec_login_error">
        <div id="username">
          <label>使用者名稱:</label>
          <input type="text" id="sec_username_hide" name="username" placeholder="輸入使用者名稱" />
        </div>
        <div id="password">
          <label>密&nbsp;&nbsp;&nbsp;碼:</label>
          <input type="password" id="sec_password_hide" name="password" placeholder="輸入密碼" />
        </div> 
        <div id="username">
        <a href="${pageContext.request.contextPath}/buyer/index.do" >
            <span style="float:right;font-weight: bold;color: #3d96c9;">
                返回首頁&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
            </span></a>

        </div>    
        <div id="login">
          <button type="submit">登入</button>
        </div>
      </form>
    </div>
  </div>
</div>
<div class="bottom">©2018 中央財經大學</div>
<div class="screenbg">
  <ul>
    <li><a href="javascript:;"><img src="${pageContext.request.contextPath}/conf2/images/0.jpg"></a></li>
    <li><a href="javascript:;"><img src="${pageContext.request.contextPath}/conf2/images/1.jpg"></a></li>
    <li><a href="javascript:;"><img src="${pageContext.request.contextPath}/conf2/images/2.jpg"></a></li>
  </ul>
</div>
</body>
</html>

3 登入註冊的controller,附帶退出登入

package com.ssh.controller;
import java.io.File;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;

import org.apache.catalina.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.support.RedirectAttributes;

import com.ssh.po.Activity;
import com.ssh.po.Buyer;
import com.ssh.po.Cart;
import com.ssh.po.Category;
import com.ssh.po.Collection;
import com.ssh.po.DetailedOrder;
import com.ssh.po.Order;
import com.ssh.po.Product;
import com.ssh.po.Seller;
import com.ssh.service.BuyerService;

@Controller
@RequestMapping("/buyer")
public class BuyerController
{

    @Autowired
    private BuyerService buyerService;


    public BuyerService getBuyerService()
    {
        return buyerService;
    }

    public void setBuyerService(BuyerService buyerService)
    {
        this.buyerService = buyerService;
    }

    @RequestMapping(value="/login") 
    public ModelAndView login(String username,String password,HttpServletRequest request){
        Buyer buyer=buyerService.login(username,password);
        if(buyer==null){
            ModelAndView modelAndView = new ModelAndView("/login"); 
            modelAndView.addObject("status", "success");
            modelAndView.addObject("info", "買家使用者名稱和密碼不正確");  
            return modelAndView; 
        }
        request.getSession().setAttribute("buyer", buyer);
        ModelAndView modelAndView = new ModelAndView("/buyer/info_show");  
        modelAndView.addObject("status", "success");
        modelAndView.addObject("info", "使用者"+buyer.getName()+"登入成功");
        return modelAndView;  
    }

     @RequestMapping(value = "/logout")
     public String logout(HttpServletRequest request){
         HttpSession session=request.g