实验二 服务器端简单程序设计

实验项目名称：实验二  服务器端简单程序设计

 

一、实验目的

通过一个小型网站的开发，掌握JSP基础知识，加深对session，request，response，cookie等对象的理解，掌握其使用方法，进一步深入掌握HTML、CSS和JavaScript等知识。

二、实验内容和基本要求

1) 编写index.jsp文件，展示某一类物品或知识的介绍，可以是歌曲、人物、名胜古迹等。要求至少有三个条目，用户登录后才能浏览这三个条目的内容。如果用户尚未登录，需要显示用户为“游客”，否则显示用户名。页面下端设置超链接，指向login.jsp。如果用户尚未登录，单击了某一条目的内容，则系统自动转向login.jsp。

2) 编写login.jsp文件，该页面包含一个表单，表单中有两个input标记，分别让用户输入用户名和密码，还有一个登录按钮。当用户单击“登录”后，将表单数据以post的方式提交给check.jsp。

3) 编写check.jsp，该页面使用request对象获取客户端发送过来的用户名和密码，并对用户的合法性进行验证。如果用户输入的用户名和密码不相同，则提示用户登录失败，2秒钟之后自动转向login.jsp页面。如果用户输入的用户名和密码相同，则提示用户登录成功，2秒钟之后转入登录前页面。（提示：登录前页面的记录可以在用户单击的每个网页中，使用session对象的某个属性记录用户访问的当前网页）。

4) 编写三个条目的内容网页。每个网页的上端都需要展示登录的用户名。下端需要“回到首页”的超链接。这三个条目的内容网页只有用户登录后才能浏览。

5) 当用户合法登录后，客户端保留5分钟的Cookie。当用户关闭浏览器后，5分钟之内再次访问时可以免登陆。

6) 将网页源代码和浏览器截图写入实验报告。

三、实验步骤

1) 打开Eclipse软件，新建一个名为untitled的Web项目，并设置其部署程序为Tomcat。

2) 在untitled中添加文件，编写代码。

3) index.jsp文件代码

<%--
  Created by IntelliJ IDEA.
  User: licc
  Date: 2023/4/14
  Time: 16:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>主页</title>
</head>
<style>
  body
  {
    background-image: url(images.webp);
    background-size:100% 100% ;
    background-attachment: fixed ;
  }
  table
  {
    border-spacing: 10px 20px;
    border : solid 1px red;
    margin-top:300px;
  }
  .font
  {
    letter-spacing:6px;
  }
</style>
<script type="text/jscript">
    request.setCharacterEncoding("utf-8");
    function jump(adress,a)
    {
        if(adress=='s1')
        {
            if (a=="1")
            window.location.href='login.jsp';
            if (a=="2")
            window.location.href='s1.jsp';
        }
        if(adress=='s2')
        {
            if (a=="1")
            window.location.href='login.jsp';
            if (a=="2")
            window.location.href='s2.jsp';
        }
        if(adress=='s3')
        {
        if (a=="1")
            window.location.href='login.jsp';
        if (a=="2")
            window.location.href='s3.jsp';
        }
    }
</script>
<body class = "font">
<%! String a="1";%>
<%! String b="亲爱的游客"; %>
<%
  Cookie[] cookies = request.getCookies();
  if(cookies != null && cookies.length > 0)
  {
    for(Cookie c: cookies)
    {
      if(c.getName().toString().equals("username"))
      {
        b = c.getValue().toString();
      }
      if(c.getName().toString().equals("id"))
      {
        a = c.getValue().toString();
      }
    }}

%>
<marquee  scrollAmount="20" direction="left" scrollDelay="90" behavior="alternate" loop="-1" onmouseover="this.stop()"
          onmouseout="this.start()"   hspace="20%">
  <a  style="color: red; font-family: 黑体; font-size: 15pt; text-align: center;"><%=b  %>,欢迎访问本网站</a>
</marquee>
<table align="center" valign="middle">
  <tr> <td align="center"><a href="first.jsp"a href="javascript:jump('s1',<%=a %>)">山河无恙在我胸</a></td></tr>
  <tr> <td align="center"><a href="second.jsp"a href="javascript:jump('s2',<%=a %>)">Hard To Get</a></td></tr>
  <tr> <td align="center"><a href="third.jsp"a href="javascript:jump('s3',<%=a %>)">重生</a></td></tr>
  <tr> <td align="center" > <a href="login.jsp">登录</a></td></tr>
</table>
</body>
</html>

4) Check.jsp文件代码

<%--
  Created by IntelliJ IDEA.
  User: licc
  Date: 2023/4/14
  Time: 16:42
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>主页</title>
</head>
<style>
  body
  {
    background-image: url(images.webp);
    background-size:100% 100% ;
    background-attachment: fixed ;
  }
  table
  {
    border-spacing: 10px 20px;
    border : solid 1px red;
    margin-top:300px;
  }
  .font
  {
    letter-spacing:6px;
  }
</style>
<script type="text/jscript">
    request.setCharacterEncoding("utf-8");
    function jump(adress,a)
    {
        if(adress=='s1')
        {
            if (a=="1")
            window.location.href='login.jsp';
            if (a=="2")
            window.location.href='s1.jsp';
        }
        if(adress=='s2')
        {
            if (a=="1")
            window.location.href='login.jsp';
            if (a=="2")
            window.location.href='s2.jsp';
        }
        if(adress=='s3')
        {
        if (a=="1")
            window.location.href='login.jsp';
        if (a=="2")
            window.location.href='s3.jsp';
        }
    }
</script>
<body class = "font">
<%! String a="1";%>
<%! String b="亲爱的游客"; %>
<%
  Cookie[] cookies = request.getCookies();
  if(cookies != null && cookies.length > 0)
  {
    for(Cookie c: cookies)
    {
      if(c.getName().toString().equals("username"))
      {
        b = c.getValue().toString();
      }
      if(c.getName().toString().equals("id"))
      {
        a = c.getValue().toString();
      }
    }}

%>
<marquee  scrollAmount="20" direction="left" scrollDelay="90" behavior="alternate" loop="-1" onmouseover="this.stop()"
          onmouseout="this.start()"   hspace="20%">
  <a  style="color: red; font-family: 黑体; font-size: 15pt; text-align: center;"><%=b  %>,欢迎访问本网站</a>
</marquee>
<table align="center" valign="middle">
  <tr> <td align="center"><a href="first.jsp"a href="javascript:jump('s1',<%=a %>)">山河无恙在我胸</a></td></tr>
  <tr> <td align="center"><a href="second.jsp"a href="javascript:jump('s2',<%=a %>)">Hard To Get</a></td></tr>
  <tr> <td align="center"><a href="third.jsp"a href="javascript:jump('s3',<%=a %>)">重生</a></td></tr>
  <tr> <td align="center" > <a href="login.jsp">登录</a></td></tr>
</table>
</body>
</html>

5) Login.jsp文件代码

<%--
  Created by IntelliJ IDEA.
  User: licc
  Date: 2023/4/14
  Time: 16:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>登录</title>
</head>
<style>
  body
  {
    background: url(images.webp);
    background-size:100% 100% ;
    background-attachment: fixed

  }
</style>
<script type="text/javascript">
  window.onload = function check( )
  {
    document.getElementById("submit_login").onclick = function()
    {
      var str1 = form1.username.value;
      var str2 = form1.password.value;
      if (str1 == ""||str2 == "") {
        alert("用户名或者密码为空！");
        form1.username.focus();
      }
      return;
    };
  };
</script>
<body>

<form action="check.jsp" method="post" id="form1" name = "form1" onsubmit="">
  <table align="center" valign="middle">
    <tr><td id="top">用户登录 </td></tr>
    <tr>
      <td>用户名:</td>
      <td><input type="text" name="username"  id = "username"value=""> </td>
    </tr>
    <tr>
      <td> 密码：</td>
      <td><input type="password"  name="password" id = "password"> </td>
    </tr>
    <tr>
      <td  colspan="2" align="center"><input type="submit" value="确定" name="submit_login" id="submit_login">
        <input type="reset" > </td>
    </tr>
  </table>
</form>
</body>
</html>

6) first.jsp

<%--
  Created by IntelliJ IDEA.
  User: licc
  Date: 2023/4/14
  Time: 16:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>登录</title>
</head>
<style>
  body
  {
    background: url(images.webp);
    background-size:100% 100% ;
    background-attachment: fixed

  }
</style>
<script type="text/javascript">
  window.onload = function check( )
  {
    document.getElementById("submit_login").onclick = function()
    {
      var str1 = form1.username.value;
      var str2 = form1.password.value;
      if (str1 == ""||str2 == "") {
        alert("用户名或者密码为空！");
        form1.username.focus();
      }
      return;
    };
  };
</script>
<body>

<form action="check.jsp" method="post" id="form1" name = "form1" onsubmit="">
  <table align="center" valign="middle">
    <tr><td id="top">用户登录 </td></tr>
    <tr>
      <td>用户名:</td>
      <td><input type="text" name="username"  id = "username"value=""> </td>
    </tr>
    <tr>
      <td> 密码：</td>
      <td><input type="password"  name="password" id = "password"> </td>
    </tr>
    <tr>
      <td  colspan="2" align="center"><input type="submit" value="确定" name="submit_login" id="submit_login">
        <input type="reset" > </td>
    </tr>
  </table>
</form>
</body>
</html>

7)second.jsp

 

<%--
  Created by IntelliJ IDEA.
  User: licc
  Date: 2023/4/20
  Time: 19:57
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Hard To Get</title>
</head>
<body background="images.webp">
<div align="center" style="background: white" >
  <h1 style="color: black;">Hard To Get</h1>

  <h5 style="color: black;">歌词</h5>
  <p>
    You you you play hard to get You you you play hard to get And I don't know how much I can give Cuz you you you play hard to get Did you ever think about us U been playing this game too tough Tried to give ya love Now I'm trying not to get fed up
  </p>
  <p>
    Tell me did you ever think about us Worked a long time just to earn ya trust I don't wanna make no fuss But I got a thousand bad batch lined up You the only girl that ain't signed up Got a lot of baijiu in my cup Tryna make a bae of you wussup Sending drunk texts when I'm in the club
  </p>

  <p>
    Did you understand what it was Do I gotta clear it up Swear I ain't in a rush I can only play with you so much You you you play hard to get You you you play hard to get And I don't know how much I can give Cuz you you oh you play hard to get
  </p>
  <p>
    该词气象磅礴，格调雄浑，高唱入云，境界宏大，前所未有，因此被称为此词须关西大汉手持铜琵琶、铁绰板进行演唱，是对传统词的一大突破，因而成为了豪放词的定鼎之作。胡仔《苕溪渔隐丛话》说：“大江东去赤壁词，语意高妙，真古今绝唱。”
  </p>
  <p>
    想说的话太多总被收回 又是喝到烂醉断片了为止 每到夜晚思念填满我的胃 假装无所谓却天生一对 去没人的岛 摸鲨鱼的角 写童谣和chase & I'd love to wait
  </p>
  <p>
    But I got a thousand bad batch lined up You the only girl that ain't signed up Got a lot of baijiu in my cup Tryna make a bae of you wussup Sending drunk texts when I'm in the club Did you understand what it was Do I gotta clear it up Swear I ain't in a rush
  </p>
  <p>
    I can only play with you so much You you you play hard to get You you you play hard to get And I don't know how much I can give Cuz you you you play hard to get
  </p>
</div>
<div style="text-align: center">
  <a href="check.jsp">
    <button>回到首页</button>
  </a>
</div>
</body>
</html>

       8)third.jsp

<%--
  Created by IntelliJ IDEA.
  User: licc
  Date: 2023/4/20
  Time: 19:58
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>重生</title>
</head>
<body background="images.webp">
<div align="center" style="background: white" >
    <h1 style="color: black;">重生</h1>

    <h5 style="color: black;">歌词</h5>
    <p>
        oh 这凡人的躯壳 注定毁灭后重塑一个新的我 当一针一线缝合了伤痕 将要斩断了所有的谜底 向世界宣告我的美丽 起死回生后疯了渡成了妖 起死回生后疯了渡成了妖 疯了渡成了妖

    </p>
    <p>
        起死回生后疯了渡成了妖 当仪式结束散场后 又重蹈覆辙 众说纷纭的规律 随日子朝来暮去 这汹汹涌动的人群 对此漠不关心 最后只剩下热爱
    </p>

    <p>
        带我迎接未来 oh 这凡人的躯壳 注定毁灭后重塑一个新的我 当一针一线缝合了伤痕 将要斩断了所有的谜底 向世界宣告我的美丽
    </p>
    <p>
        起死回生后疯了渡成了妖 起死回生后疯了渡成了妖 疯了渡成了妖 疯了渡成了妖 起死回生后疯了渡成了妖
    </p>

</div>
<div style="text-align: center">
    <a href="check.jsp">
        <button>回到首页</button>
    </a>
</div>
</body>
</html>

9)程序截图

 

posted @   STDU_DREAM  阅读(275)  评论(2)  编辑  收藏  举报
相关博文：
· 实验三 Web数据库程序设计
· 软件设计实验2：简单工厂模式
· web实验2
· Web实验二 服务器端简单程序设计
· web实验二1
阅读排行：
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布：重大改进与新特性概览！
· AI与.NET技术实操系列（二）：开始使用ML.NET
· .NET10 - 预览版1新功能体验（一）
点击右上角即可分享
微信分享提示
AI FOR CODE 大赛