赞
踩
目 录
1 总体概述 3
2 系统需求分析 3
3 系统设计 3
4 系统实现 3
5 总结 3
参考文献 3
附录 3
1 总体概述
本设计主要通过HTML、CSS、JavaScript网页开发技术,会话及其会话技术,过滤器技术,Java语言以及连接mysql数据库来实现一个具有登录注册功能,且登录页面使用验证码技术来实现用户验证、未登录用户仅能访问主页的餐厅点餐系统。
主要的思路是与mysql数据库建表连接来管理用户名密码信息,判断登录时用户名密码是否正确,注册时向数据库中的表新增信息;通过会话及其会话技术来管理用户登录的状态、验证码用户验证、顾客的点餐订单加入购物车;通过过滤器技术来管理未登录的用户的访问权限。
相关理论介绍:
会话及其会话技术:在Web开发中,服务器跟踪用户信息的技术称为会话技术。包含cookie和session对象。在本系统设计中,主要运用的是session对象。Session对象是一种将会话数据保存到服务器端的技术。Cookie技术可以将用户的信息保存在各自的浏览器中,并且可以在多次请求下实现数据的共享。但是如果传递的信息比较多,使用Cookie技术显然会增大服务器端程序处理的难道,这时可以使用Session技术。
过滤器技术(Filter):过滤器实际上就是对web资源进行拦截,做一些处理后再交给下一个过滤器或servlet处理。在doFilter()中判断用户是否登录系统,只有合法登录后才能访问系统。首先分析session中是否有用户的信息,有则放行,没有,判断是否是登录请求或者是登录提交请求,是则放行,不是则跳转回主页。
2 系统需求分析
由设计要求及对餐厅点餐系统的需求分析可知,网站首先拥有一个首页,该首页所有用户均可访问,首页拥有登录、注册、点餐、购物车等多个子页,但游客用户仅能访问登录、注册及主页,无法访问点餐页面。想要点餐时需要先登录,没有用户名密码的用户可以进行注册。进入点餐页面后,下单之后点击我的订单可查看购物车内的已点的菜单。
<%-- Created by IntelliJ IDEA. User: 233cm Date: 2020/12/2 Time: 21:18 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>Home</title> <!---Font Icon--> <link href="font/flaticon.css" rel="stylesheet"> <!-- / --> <!-- Plugin CSS --> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/slick.css"> <link rel="stylesheet" href="css/pogoslider.css"> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/responsive.css"> </head> <body> <!--============= Preloader Part HTML Start ===================--> <div id="preloader"> <div id="loading-center"> <img src="images/loader.gif" alt=""> </div> </div> <!--============= Preloader Part HTML End ===================--> <!--=================== Navbar Part HTML Start =====================--> <header> <nav id="nav-part" class="navbar header-nav custom_nav sticky-top navbar-expand-md"> <div class="container p-0"> <div class="heading"> <span><a class="navbar-brand" href="index.jsp" style="color: red;">cmの小餐馆</a></span> </div> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span></span> <span></span> <span></span> </button> <div class="collapse navbar-collapse justify-content-end" id="navbarSupportedContent"> <ul class="navbar-nav"> <li class="nav-item"><a class="nav-link active" href="#tg-homeslider">主页<span class="sr-only">(current)</span></a></li> <li class="nav-item"><a class="nav-link" href="#about">关于我们</a></li> <li class="nav-item"><a class="nav-link" href="#menu">菜单</a></li> <li class="nav-item"><a class="nav-link" href="shopping.jsp">去订购</a></li> <li class="nav-item"><a class="nav-link" href="#contact">更多信息</a></li> <li class="dropdown nav-item"><a href="" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">登录&注册</a> <ul class="dropdown-menu maindrop_menu"> <li><a href="user_login.jsp">登录</a></li> <li><a href="user_register.jsp">注册</a></li> </ul> </li> </ul> </div> </div> </nav> </header> <!--=================== Navbar Part HTML End =====================--> <!-- ============================= Start: Header Slider ============================= --> <div class="tg-sliderholder"> <div id="tg-homeslider" class="tg-homeslider tg-haslayout"> <div class="pogoSlider-slide" data-transition="expandReveal" data-duration="600" style="background:url(images/banner-image-2.jpg) no-repeat scroll center center;"> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div class="tg-slidercontent t-center" data-transition="blocksReveal"> <h6 class="pogoSlider-slide-element" data-in="slideDown" data-out="flipX" data-duration="700">这 里 有</h6> <h2 class="pogoSlider-slide-element" data-in="expand" data-out="flipX" data-duration="1500">美味的 <br>烤肉</h2> </div> </div> </div> </div> </div> <div class="pogoSlider-slide" data-transition="expandReveal" data-duration="1000" style="background:url(images/banner-image-1.jpg) no-repeat scroll center center;"> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div class="tg-slidercontent t-right"> <h6 class="pogoSlider-slide-element" data-in="slideDown" data-out="flipX" data-duration="700">这 里 有</h6> <h2 class="pogoSlider-slide-element" data-in="expand" data-out="flipX" data-duration="1500">可口的<br>食物</h2> </div> </div> </div> </div> </div> <div class="pogoSlider-slide" data-transition="expandReveal" data-duration="1000" style="background:url(images/banner-image-3.jpg) no-repeat scroll center center;"> <div class="container"> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div class="tg-slidercontent t-center"> <h6 class="pogoSlider-slide-element" data-in="slideDown" data-out="flipX" data-duration="700">还有</h6> <h2 class="pogoSlider-slide-element" data-in="expand" data-out="flipX" data-duration="1500">舒适的<br>环境</h2> </div> </div> </div> </div> </div> </div> <a class="tg-btnscrol tg-btnsectionscroll" href="javascript:void(0);"><i class="icon-chevron-down"></i></a> </div> <!-- ============================= End: Header Slider ============================= --> <!--================== About Part HTML Start ===================--> <section id="about" class="about section"> <div class="container"> <div class="row"> <div class="col-lg-6 about-text"> <div class="heading"> <span>our story</span> <p>关于我们</p> </div> <div class="about-inner"> <p>cmの小餐馆是一家由海怀A624赞助,陈铭先生冠名的五星级餐馆,于2030年11月11日正式开业,开业之初受到了外界的广泛关注,顾客回头率高达80%,编不下去了,凑凑字数叭。</p> <p></p> </div> </div> <div class="col-lg-3 col-md-6"> <div class="about-photo"> <img src="images/about-1.jpg" alt="About Person" class="img-fluid person"> </div> </div> <div class="col-lg-3 col-md-6"> <div class="row"> <div class="col-lg-12 about-side-1"> <img src="images/about-5.jpg" alt="About food" class="img-fluid person"> </div> </div> <div class="row"> <div class="col-lg-12"> <img src="images/about-4.jpg" alt="About food" class="img-fluid person"> </div> </div> </div> </div> </div> </section> <!--================== About Part HTML End ===============--> <!--===================== Menu Part HTML Start =======================--> <section id="menu" class="menu section"> <div class="container"> <div class="row"> <div class="col-md-12 text-center"> <div class="heading-center-2"> <span>Our Menu</span> <p>下面是好吃的~</p> </div> </div> </div> <div class="row justify-content-center text-center pro-row"> <div class="col-lg-9 m-auto col-12 text-center button-group"> <ul class="nav nav-pills" id="pills-tab1" role="tablist"> <li class="nav-item"> <a class="nav-menu active" id="pills-all-tab1" data-toggle="pill" href="#pills-all1" role="tab" aria-controls="pills-all1" aria-selected="true">早餐</a> </li> <li class="nav-item"> <a class="nav-menu" id="pills-illustrations-tab1" data-toggle="pill" href="#pills-busi-card1" role="tab" aria-selected="false">午餐</a> </li> <li class="nav-item"> <a class="nav-menu midl-btn" id="pills-logo-tab1" data-toggle="pill" href="#pills-logo1" role="tab" aria-selected="false">晚餐</a> </li> <li class="nav-item"> <a class="nav-menu" id="pills-web-tem-tab1" data-toggle="pill" href="#pills-web-tem1" role="tab" aria-selected="false">甜品</a> </li> <li class="nav-item"> <a class="nav-menu last-btn" id="pills-flyer-tab1" data-toggle="pill" href="#pills-flyer1" role="tab" aria-selected="false">饮料</a> </li> </ul> </div> </div> <div class="row mx-0"> <div class="col-lg-12 px-0"> <div class="tab-content" id="pills-tabContent1"> <div class="tab-pane fade show active" id="pills-all1" role="tabpanel" aria-labelledby="pills-all-tab1"> <div class="row work-cont-1"> <div class="col-lg-6"> <div class="work-image"> <img src="images/menu1.jpg" class="img-fluid" alt="breakfast"> <h4>Breakfast</h4> </div> </div> <div class="col-lg-6"> <div class="work-cont"> <ul> <li> <h3>法式吐司</h3><span> .................................................... </span><em>¥15</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> <li> <h3>三明治</h3> <span> .................................................... </span><em>¥10</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> <li> <h3>紫米面包</h3> <span> .................................................... </span><em>¥15</em> <p>现做的~</p> </li> <li> <h3>豆浆</h3> <span> .................................................... </span><em>¥5</em> <p>现热的~</p> </li> <li> <h3>巧克力海螺面包</h3> <span> .................................................... </span><em>¥18</em> <p>现做的~</p> </li> </ul> </div> <div class="g-btn"> <div class="sim-button button26 btn-right pogoSlider-slide-element" data-in="slideUp" data-out="flipX" data-duration="700"> <a href="shopping.jsp"><span>去订购</span></a> </div> </div> </div> </div> </div> <div class="tab-pane fade" id="pills-logo1" role="tabpanel" aria-labelledby="pills-logo-tab1"> <div class="row work-cont-1"> <div class="col-lg-6"> <div class="work-image"> <img src="images/menu3.jpg" class="img-fluid" alt="breakfast"> <h4>Dinner</h4> </div> </div> <div class="col-lg-6"> <div class="work-cont"> <ul> <li> <h3>韩式石锅拌饭</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>苦瓜炒蛋</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>小炒肉</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>酸菜鱼</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>鸡扒饭</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> </ul> </div> <div class="g-btn"> <div class="sim-button button26 btn-right pogoSlider-slide-element" data-in="slideUp" data-out="flipX" data-duration="700"> <a href="shopping.jsp"><span>去订购</span></a> </div> </div> </div> </div> </div> <div class="tab-pane fade" id="pills-busi-card1" role="tabpanel" aria-labelledby="pills-illustrations-tab1"> <div class="row"> <div class="col-lg-6"> <div class="work-cont"> <ul> <li> <h3>韩式拌饭</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>苦瓜炒蛋</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>小炒肉</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>酸菜鱼</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> <li> <h3>鸡扒饭</h3><span> .................................................... </span><em>¥10</em> <p>好吃好吃</p> </li> </ul> </div> <div class="g-btn"> <div class="sim-button button26 btn-right pogoSlider-slide-element" data-in="slideUp" data-out="flipX" data-duration="700"> <a href="shopping.jsp"><span>去订购</span></a> </div> </div> </div> <div class="col-lg-6"> <div class="work-image"> <img src="images/menu2.png" class="img-fluid" alt="breakfast"> <h4>Lunch</h4> </div> </div> </div> </div> <div class="tab-pane fade" id="pills-web-tem1" role="tabpanel" aria-labelledby="pills-web-tem-tab1"> <div class="row"> <div class="col-lg-6"> <div class="work-cont"> <ul> <li> <h3>焦糖布丁</h3><span> .................................................... </span><em>¥15</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> <li> <h3>冰激凌华夫饼</h3><span> .................................................... </span><em>¥15</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> <li> <h3>布丁</h3><span> .................................................... </span><em>¥15</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> <li> <h3>马德拉蛋糕</h3><span> .................................................... </span><em>¥15</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> <li> <h3>瑞士卷</h3><span> .................................................... </span><em>¥15</em> <p>现做的&可配胡桃果仁,奶油酥皮~</p> </li> </ul> </div> <div class="g-btn"> <div class="sim-button button26 btn-right pogoSlider-slide-element" data-in="slideUp" data-out="flipX" data-duration="700"> <a href="shopping.jsp"><span>去订购</span></a> </div> </div> </div> <div class="col-lg-6"> <div class="work-image"> <img src="images/ice-cream.jpg" class="img-fluid" alt="breakfast"> <h4>Desert</h4> </div> </div> </div> </div> <div class="tab-pane fade" id="pills-flyer1" role="tabpanel" aria-labelledby="pills-flyer-tab1"> <div class="row work-cont-1"> <div class="col-lg-6"> <div class="work-image"> <img src="images/juice.png" class="img-fluid" alt="juice"> <h4>Drink</h4> </div> </div> <div class="col-lg-6"> <div class="work-cont"> <ul> <li> <h3>宇治抹茶</h3><span> .................................................... </span><em>¥10</em> <p>现做的~</p> </li> <li> <h3>烧仙草</h3><span> .................................................... </span><em>¥10</em> <p>现做的~</p> </li> <li> <h3>日照红茶</h3><span> .................................................... </span><em>¥10</em> <p>现做的~</p> </li> <li> <h3>红豆奶茶</h3><span> .................................................... </span><em>¥10</em> <p>现做的~</p> </li> <li> <h3>热可可</h3><span> .................................................... </span><em>¥10</em> <p>现做的~</p> </li> </ul> </div> <div class="g-btn"> <div class="sim-button button26 btn-right pogoSlider-slide-element" data-in="slideUp" data-out="flipX" data-duration="700"> <a href="#"><span>去订购</span></a> </div> </div> </div> </div> </div> </div> </div> </div> </div> </section> <!--================== Menu Part HTML End ====================--> <!--======================== Chef Part HTML Start ==========================--> <!--======================== Chef Part HTML End =========================--> <!--======================== gallery Part HTML Start ==========================--> <section id="gallery" class="gallery section"> <div class="container"> <div class="row"> <div class="col-md-12 text-center"> <div class="heading-center-4"> <span>Our gallery</span> <p>这里看菜式呀</p> </div> </div> </div> <div class="row gallery-details"> <div class="col-lg-3 col-md-6"> <div class="gallery-photo"> <img src="images/bread.jpg" class="img-fluid person" alt="About Person"> <a href="images/bread.jpg" data-fancybox> <div class="overlay"> <div class="overlay_shape"></div> </div> </a> </div> </div> <div class="col-lg-3 col-md-6"> <div class="row"> <div class="col-lg-12 about-side-2"> <div class="gallery-photo"> <img src="images/noodles.jpg" class="img-fluid person" alt="About Person"> <a href="images/noodles.jpg" data-fancybox> <div class="overlay"> <div class="overlay_shape"></div> </div> </a> </div> </div> </div> <div class="row"> <div class="col-lg-12"> <div class="gallery-photo"> <img src="images/sharma.jpg" class="img-fluid person" alt="About Person"> <a href="images/sharma.jpg" data-fancybox> <div class="overlay"> <div class="overlay_shape"></div> </div> </a> </div> </div> </div> </div> <div class="col-lg-3 col-md-6"> <div class="gallery-photo"> <img src="images/burger.jpg" class="img-fluid person" alt="About Person"> <a href="images/burger.jpg" data-fancybox> <div class="overlay"> <div class="overlay_shape"></div> </div> </a> </div> </div> <div class="col-lg-3 col-md-6"> <div class="row"> <div class="col-lg-12 about-side-2"> <div class="gallery-photo"> <img src="images/cream.jpg" class="img-fluid person" alt="About Person"> <a href="images/cream.jpg" data-fancybox> <div class="overlay"> <div class="overlay_shape"></div> </div> </a> </div> </div> </div> <div class="row"> <div class="col-lg-12"> <div class="gallery-photo"> <img src="images/sub-sandwitch.jpg" class="img-fluid person" alt="About Person"> <a href="images/sub-sandwitch.jpg" data-fancybox> <div class="overlay"> <div class="overlay_shape"></div> </div> </a> </div> </div> </div> </div> </div> </div> </section> <!--======================== gallery Part HTML End =========================--> <!--==================== Contact Part HTML Start ======================--> <section id="contact" class="contact section"> <div class="container"> <div class="row"> <div class="col-lg-12 contact-logo"> cm </div> </div> <div class="row"> <div class="col-lg-3 col-md-6"> <div class="contact-address"> <h5>Address</h5> <p> A624宿舍 <br> 电话: 18898564523 </p> </div> </div> <div class="col-lg-3 col-md-6"> <div class="contact-address"> <h5>Opening Hours</h5> <p> 周一到周六<br> 10.00am -11.00pm<br> 12.00pm-11.00pm(周六) </p> </div> </div> <div class="col-lg-2 col-md-6"> <div class="contact-links"> <h5>Important Links</h5> <ul> <li><a href="#">主页</a></li> <li><a href="#about">关于我们</a></li> <li><a href="shopping.jsp">去订购</a></li> <li><a href="#"></a></li> </ul> </div> </div> </div> </div> </section> <!--=========================== Contact Part HTML End ============================--> <!-- jQuery --> <script src="js/jquery-3.2.1.min.js"></script> <script src="js/jquery-migrate-3.0.0.min.js"></script> <!-- Plugins --> <script src="js/bootstrap.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/slick.min.js"></script> <script src="js/pogoslider.js"></script> <script src="js/jquery.fancybox.min.js"></script> <script src="js/jquery-ui.min.js"></script> <script src="js/counter.js"></script> <script src="js/waypoints.js"></script> <script src="js/custom.js"></script> </body> </html>
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。