制作动态网页留言板

合集下载

web动态网站设计--留言板系统

动态 WEB 课程设计——留言板系统学院名称：计算机与电子信息学院专业名称：计算机科学技术班级：学号：姓名：完成时间：目录目录1．网站简介 (1)2．网站开发平台和工具 (1)3．网站结构设计 (1)4．网站功能模块 (3)5．数据库结构 (6)6．主要模块实现与代码摘要 (7)7．课程设计总结 (10)1网站简介留言板是一种可以用来记录，展示文字信息的载体，有比较强的时效性，一般能比较及时的集中反应信息。

随着互联网的迅猛的发展，网络留言板也随着诞生，比如说我们熟知的BBS，又比如说在每个网站的信息反馈系统。

此次课程设计，就是要制作一个有着普遍性能的留言版系统，类似于BBS的功能。

2开发平台和工具3网站结构设计网站实现功能如下：1）用户留言信息（留言内容的新增、删除、修改、查询）；2) 注册用户维护（用户信息的新增、删除、修改、查询）；3) 按姓名查询用户留言信息；4) 管理员可对用户注册的信息和所有用户的留言信息进行管理；5) 用户的注册；6) 判断用户标识和口令，并进行权限管理。

4网站功能模块如上所述，网站实现的功能主要有6个，根据用户权限不同可以将本系统分为2大模块，分别为：管理员用户权限、访客用户权限。

本系统各个部分及其包括的具体功能模块如下图所示：2.1.1、用户类型2.1.2、管理员2.1.3、普通访客2.1.4、用户登录判断图2 – 4用户登录判断2.1.5、用户检测及登录流程图2 - 5用户登录及注册模块程序逻辑图5数据库结构根据网站功能设计要求和模块划分，数据库主要用于存储用户信息、用户留言信息和管理员信息，。

数据库结构如下：1.管理员息表admin：图2 - 62、注册用户信息表user：图2 - 73、注册用户留言信息表：图5.2 视频信息表6主要模块实现与代码摘要6.1首页设计本系统的首页由图片，标题，和留言组成，根据访客的不同需求选择不同的界面。

代码如下：/******省略部分代码*************/<%!String DBDriver = "com.microsoft.sqlserver.jdbc.SQLServerDriver"; String DBUrl ="jdbc:sqlserver://127.0.0.1:1433;DatabaseName=userdb"; Connection conn =null;Statement stmt = null;ResultSet rs = null;%><table width="100%" border="1" cellpadding="0" cellspacing="3" height="100%"><%//连接数据库，读取类信息try{Class.forName(DBDriver);conn = DriverManager.getConnection(DBUrl,"sa","sa");/*if(conn!=null){System.out.println("Connection...");}else{System.out.println("not Connection...");}*/stmt = conn.createStatement();String sql ="select * from liuyan";rs = stmt.executeQuery(sql);}catch(Exception e){e.printStackTrace();}%><tr align="center" ><%while(rs.next()){%><%=rs.getString(2) %><%=rs.getString(2) %><%}%></tr><%try{if(rs!=null){rs.close();}if(stmt!=null){stmt.close(); }if(conn !=null){conn.close();}//数据库连接，都必须及时的关闭。

第18章+创建动态表单(留言板)

“转到详细信息页”对话框
转到特定记录(1)
• 绑定记录集。打开detail.asp，绑定记录集。每次制作新的动态网页都要先绑定记录集。 • 制作动态网页。首先确定要在detail.asp上显示的动态网页内容，如要显示id、姓名、性别、城市、邮箱五项内容，就在网页中插入一个五行两列的表，并在左列输入项目文字。 • 光标放在第二列第一个单元格，在“绑定”面板上选择id，单击面板上的“插入”按钮，使用同栏的方法插入其他动态文本，最后效果如图。
“记录集”对话框中的筛选设置
更新记录表单对话框及设置
网页上的更新记录表单
删除记录页
• 转到详细记录页 • 删除记录
转到详细记录页Leabharlann 1.打开loginok.asp，在此网页添加转到详细记录页行为。 2.打开“服务器行为”面板，选择表格中的“删除”，单击面板上的“+”，选择“转到详细记录页”，打开对话框，设置如图。 3.“详细信息页”选择delete.asp，“记录集”选择 message，“列”选择“编号”，“URL参数” 为“编号”，这是保证loginok.asp上选择的记录和delete.asp上删除的记录一致的关键。 4.单击“确定”按钮。
记录集对话框及设置
“转到详细信息页”对话框及设置
更新记录表单
• 在guestbook文件夹下新建网页文件edit.asp并打开。 • 打开“绑定”面板，单击“+”，在弹出的菜单中选择“记录集(查询)”，弹出记录集对话框。 • 在对话框中，“名称”填写message,“连接”选择数据库 guestbook.mdb，“表格”选择message. • 最重要的是筛选，要求edit.asp页面上更新的项目和 loginok.asp上选择的项目一致，就要筛选出id与 loginok.asp传递的URL参数中的id一致，设置如图。 • 插入更新记录表单。单击“插入”子面板“应用程序”中的“插入更新记录表单向导”按钮，弹出“更新记录表单” 对话框。“连接”选择数据库guestbook，“要更新的表格”选择message，“选取记录自”选择message，“惟一键列”选择“编号”，“更新后，转到”选择性 loginok.asp。 • 表单字段的设定。“标签”设定表单旁边提示文字，可改为中文“留言”，“显示为”设定为文本区域，“提交为” 设定为文本，最后还将表单字段中的“编号”和“date” 删除。如图 • 单击“确定”，更新记录表单出现在网页上，如图。

留言板制作步骤

留言板制作步骤：一、将源文件digiboard拷贝到c:\appserv\www文件夹中；二、在phpmyadmin中建立数据库“digiboard”并导入“digiboard.sql”文件；三、在Dreamweaver中建立动态站点“digiboard”；四、制作留言板主页面。

（digiboard.php）1、设置数据库连接1）打开digiboard.php，切换到【应用程序\数据库】面板，单击【+\mysql连接】命令；2）填写连接名称（conndigiboard），mysql服务器(localhost)，用户名（root）,密码（123）;3）单击【选取…】按钮，选择“digiboard”数据库后，确定；4）单击测试按钮，查看连接设置是否正确；2、绑定记录集1）切换到【应用程序\绑定】面板，单击【+\记录集（查询）】命令；2）在记录集窗口中填写名称（recdigiboard），连接（conndigiboard），表格（board），列（全部），排序（digiB_id，降序）；单击【确定】；3）在【绑定】面板中展开所设置的记录集，显示数据库字段名称；依次向页面中插入digib_name，digib_id，digib_subject，digib_potime字段；3、设置表情图片选择表情头像占位符，在【属性】面板【源文件】文本框中输入前置路径“images/face”，并单击【浏览】按钮，选择【数据源】单选按钮，选择【digib_face】选项，在url文本框<?php ?>代码前输入前置路径“images/face/”，单击【确定】；4、设置“电子邮件”及“网页”图标的链接1）选择【email】图片，在属性面板【链接】栏中输入“mailto:”，并点击浏览按钮，选择“数据源”，选择“digib_email”，在url栏<?php ?>代码前输入：“mailto:”,点【确定】按钮；2）选择【www】图片，点击属性面板链接栏的浏览按钮，选择【数据源】，选择“digib_web”，点击【确定】按钮。

DW留言板课程设计

目录第一章留言板介绍 (1)1.1设计思路 (1)1.2系统功能 (2)第二章开发环境 (2)2.1开发软件 (2)2.2 IIS的配置 (2)2.3其他环境设置 (2)第三章开发过程 (4)3.1新建站点 (4)3.2设置测试服务器 (4)3.3数据库设置 (5)3.4数据库连接 (5)3.5 页面设计 (7)3.5.1登录页面 (7)3.5.2新用户注册页面 (9)3.5.3用户首页 (11)3.5.4用户添加留言页面 (14)3.5.5管理员登录页面 (15)3.5.6管理员首页 (17)3.5.7管理员编辑页面 (19)3.5.8修改页面 (22)第四章总结 (25)留言板设计第一章留言板介绍1.1设计思路我设计的是一个简单的动态留言板，可以实现注册、登录、添加、删除、修改、查询等简单的操作。

其具体的设计思路如下：用户和管理员必须先注册然后才能登录，只有登陆成功之后才能够进入首页。

用户可以在用户首页中查看留言，如果需要添加留言，可以点击页面中的“添加留言”，页面就会跳转到添加留言页面，用户可以在这里添加留言；如果用户不需要做任何操作可以直接点击“退出登录”就会自动退出我的留言板。

管理员登录成功后可以在管理员首页对未进行回复的留言进行回复，也可以对其回复的内容进行修改。

管理员还可以对所有的留言进行编辑，实现删除、修改、查询等操作。

具体操作流图如下：1.2系统功能用户可以在“我的留言板”里查看留言，添加留言；管理员可以对用户的留言进行回复，并且可以对所有的留言进行删除、修改、查询等操作。

第二章开发环境2.1开发软件我使用的是Adobe Dreamweaver CS5 来进行动态网页的设计。

2.2 IIS的配置先从网上下载好IIS安装包，再点击“开始”选择控制面板，在控制面板中点开“添加或删除程序”，点击“添加/删除Windows组件”就会出现如下图所示的界面，选中Internet 信息服务，然后点击下一步，按照提示安装即可。

制作网络留言板

在第一行的 “字段名称” 中输入“id”，“数据类型”中选择“自动编号”。然后指着第一行单击右键，在弹出菜单中选择“主键”（旁边就出现一个钥匙图标）若要取消主键，只需再单击鼠标右键，选择菜单中的“主键”，这时字段前面的钥匙图标即会消失。
数据类型的选择
在表中，“姓名、标题、邮箱地址”的数据类型均为“文本”，因一般都不会超过50个字符，所以采用系统默认的50。 “内容”的数据类型设为“备注”。 “留言时间”的数据类型为“日期/时间”，在默认值一栏的右边输入“=Now()”即可在添加数据时，数据库系统自动以服务器当前时间作为字段的值。
显示数据记录
在list.asp页面中插入一个2行3列、宽为600像素的表格，并在第一行的各个单元格中分别输入：主题、留言者、发表时间。将“绑定”窗口中的三个字段用左键拖到与它们对应表格的第二行单元格中。在表格的下面输入“现在显示的是第 -第条记录，共有条记录” ，并将“绑定”窗口的后三个字段分别拖到上面的三个空格中。
admin表结构
数据表admin中添加记录
选择数据源
打开控制面板，点击“管理工具”，选择其中的“数据源”，随即打开“ODBC数据源管理器”。选择其中的“系统DSN” 项，然后单击右边的“添加”按钮，则打开“创建新数据源”对话框，选择其中的“Microsoft Access Drive （*.mdb）”，单击“完成”后将弹出“ODBC Microsoft Access安装”对话框，点击“选择”按钮选择已有的数据库，并在“数据源名”右边文本框中输入“dsn”即可。
制作删除记录页面
将list.asp另存为del.asp后进行修改。在页面的上端输入“单击选择要删除的留言，进入删除页面”。双击“服务器行为”面板中的“转到详细页面”行为，在弹出对话框的“详细信息页”中输入要转到的新页面—delok.asp

动态网页留言板的制作过程

Ｎａ４ｒｓｚｄｖｅｉｅ
＜／ｒｔｓｉ＞ｃｐ＜／ＥＤ＞ＨＡ
＜ＢＯＤＹＢＧＣＯＬＯＲ＝＃ＦＦＦＦ＂ＴＥＸＴ＝＃０００ＦＦ０００
ｉ（ｉ＝＝ｔｅｉ（ａｉａｏ）｛ｆｉｔｎｒ）ｗｔｎｖｇｔｒｉ（ｐＮｍｅ＝ｕｈｆ（ａｐａ＝
郑立文
（阳师专，辽宁朝阳１２０）朝２００
摘要：留言板是网站提供给访问者的留言工具．设计一种动态网页留言板，用ＡＰ制作完成，主要有Ｓ留言界面，处理留言，查看留言，存储留言，管理员登陆几部分，并介绍几个关键部分的程序代码．关键词：留言板；数据库；表单；代码
同，这里介绍一种用ＡＰ制作的留言板的过程．Ｓ
首先，提供给访问者留言的界面，使访问者能够在上面留言；其次留言可被提交到ＷＥＢ服务器，当
留言送到ＷＥＢ服务器时，服务器端应有一个相应的ＡＳＰ程序来把访问者的留言保存到数据库中，在需要时，留言板还可以被访问者浏览，让大家能够看到彼此的留言．所以留言板上含有以下几个部分内容：留言表单：接受访问者输入信息；处理留言的ＡＳＰ程序：处理访问者的留言，并且保存到数据库中；观看留言的网页：使访问者可以看到留言，当然，如果留言簿不向公众公开，这部分是可以省略的；存储留言的方法：利用数据库来存储访问者留言．在处理及保存留言的ＡＳＰ程序中，要先对各个留言字段的输入做合法性检查，如果留言标题或者留言内容空白则不接受留言．如果留言表单填写完整，则提交成功，留言表字段中有Ｅ— ｉ一项，可以把ｍａｌ其转换成一个Ｅ— ｉ链接．保存留言时所使用数据库是使用Ａｃｅｓ立的数据库及数据表．最后，留言ｍａｌｃｓ建板提供浏览功能．考虑到留言的数量，留言板中还要用到分页显示技术．总体来说，本系统要用到的ＡＳＰ具体技术有：访问数据库的技术；ＡＳＰ的内置对象Ｓｒｅ、Ｒｓｏｓ、Ｒｑｅｔｅｓｎ的用法；用ｅｖｒｅｐｎｅｅｕｓ、Ｓｓｉｏ

学用DW做ASP实例—留言板

动态数据库网页本讲要点1、配置动态服务器IIS 2、建立动态站点3、创建动态页面4、创建数据库5、制作表单文档一、动态站点概述何为动态一种具有“交互性〞的页面效果即网页会根据用户的要求和选择而动态改变和响应。

制作动态网页需要做的工作有第一要在个人电脑上调试动态网页。

第二使用数据库技术。

第三在Dreamweaver中建立动态站点。

二、配置IIS服务器1安装IIS服务器2设置IIS 3测试ASP动态网页1安装IIS服务器1执行【开始】【控制面板】命令打开【控制面板】。

2双击【添加或删除程序】图标打开【添加或删除程序】窗口。

3单击【添加/删除Windows组件】打开【Windows组件向导】对话框。

4选择【Internet信息服务IIS】复选项。

5单击【下一步】按钮开始安装IIS服务器。

安装完成后的窗口如如下图所示。

2设置IIS 首先在D盘下面建立一个“liuyanban〞的文件夹用来存放留言板动态页面文件。

其次通过以下的步骤来设置站点虚拟目录1从【控制面板】窗口打开【管理工具】在打开的【管理工具】窗口中选择【Internet信息服务快捷方式】。

2设置IIS 2双击【Internet信息服务快捷方式】选项在弹出的【Internet信息服务】窗口左边窗格中右击【默认】项在弹出的菜单中执行【新建】【虚拟目录】命令弹出【虚拟目录创建向导】窗口如右图所示。

2设置IIS 3单击【下一步】按钮继续。

如左图所示在【别名】下面的文本框中输入“liuyanban〞。

单击【下一步】按钮继续。

如右图所示在【目录】下边的文本框中输入“D:liuyanban〞或者单击【浏览】按钮找到D盘的“liuyanban〞文件夹。

3测试ASP动态网页在【Internet信息服务】窗口右边的窗格中找到建立的ASP动态页面右键单击后在弹出的快捷菜单中选择【浏览】项即可如图8-15所示。

三、创建留言板主页面1、建立动态站点2、创建留言板页面建立动态站点1定义站点。

asp_Dreamweaver_access做留言板

创建数据库1、建立一个数据库，名称为“board”2、创建两个表分别为“admin”、“guestboard”3、建立表结构（1）admin表的结构名称数据类型name 文本password 文本（2）guest表的结构（其中guestid为编码，name为名称，title为标题，content为留言内容，reply为回复内容，date为留言日期）名称数据类型guestid 自动编码设置为主键name 文本title 文本content 备注replay 备注默认值为“无回复”date 日期/时间默认值为“now()”4、输入数据（1）admin表的值name列password列admin admin（2）guestboard表的值guestid neme title content replay date1 张三001 你好！（留空）（系统自动填写）留言板首页1、新建一个动态站点，名称1005。

2、在站点内新建一个ASP VBScript 动态页面。

保存文件名为“index.asp”。

设置文档标题为“留言板”。

（1）在首行输入“1005论坛”，设置字体为“华文琥珀”，大小为75，颜色为红色。

切换到“代码”视图，在“1005论坛”旁边加换行标志“<br />”（<span class="STYLE1">1005论坛</span><br />）。

（2）在第二行输入“当前位置：留言板”，设置字体为“华文琥珀”，大小为16，“当前位置：”的颜色设置为灰色（#666666），“留言板”设置为黑色。

单击“编辑”——>首先参数——>常规——>在“允许多个连续的空格”前面打钩。

插入多个空格，将光标移到到右侧，在右侧输入“管理员登陆”，各项属性为默认。

切换到“代码”视图，在“管理员登陆”旁边加换行标志“<br />”。

电子课件-《Dreamweaver 网页设计与制作》-项目十制作留言板——动态网页入门

动态网页一般使用“HTML+ 数据库 +ASP”“HTML+ 数据库 +PHP” 或“HTML+ 数据库 +JSP”等技术来实现。目前中小型网站较常用的是 “HTML+ 数据库 +ASP”技术。
当浏览者通过浏览器向服务器发出请求时，如果请求的是一个静态网页，那么这个请求到达服务器后，服务器会在本地硬盘上寻找相关网页，然后返回；如果请求的是一个动态网页，服务器在接到请求后，会接着传送给安装在这个机器上的应用程序服务器。应用程序服务器会理解并解释这些代码的含义，并将解释后的内容返回到客户端，用户看到的仍然是一个单纯的静态 HTML 网页。
任务 1 创建动态网页测试环境
二、安装 IIS
要制作动态网页，首先需要有一个测试服务器。在 Windows 7 操作系统下，只要安装了 IIS，就可以将自己的计算机设置为测试服务器。在安装 Windows 7 时，默认状态下是不会安装 IIS 的，所以需要单3 制作“留言板”——应用表单和表单对象
三、插入表单对象
表单就像一个容器，表单对象就是放在这个容器里的东西，只有添加了表单对象，表单才能真正起作用，才可以让访问者输入数据或执行其他操作。常用的表单对象主要有文本字段、单选框、复选框和按钮等，下图显示了常见的表单对象。
常见表单对象
任务 3 制作“留言板”——应用表单和表单对象
LOGO
任务 2 创建“留言板” 数据库——了解数据库
10
任务 2 创建“留言板”数据库——了解数据库
◆了解数据库的基本知识 ◆熟悉数据库文件的创建方法
任务 2 创建“留言板”数据库——了解数据库
数据库简介
数据库（Database）是以一定的组织形式存放在计算机存储介质上的相互关联的数据集合。

ASP动态网页设计4.2 任务二制作留言板主页

任务二制作留言板主页任务描述数据库及数据表建立后，就要进行留言板系统的设计与制作。

其中，留言板主页是一个典型的具有交互功能的网页，用户进入留言板系统后，最主要的目的就是浏览留言内容、发表自己的新留言，所以在留言板主页中就要以这两项功能为主。

图4-2-1任务分析留言板主页可分页显示当前的所有留言（包含“第一页”、“上一页”、“下一页”及“最后一页”按钮），包括留言者姓名、QQ、Email、留言内容、留言时间、管理员留言回复等内容。

还包括管理员入口、发表新留言、删除回复留言等入口。

方法与步骤1．布局设计启动Dreamweaver，打开主页文件index.asp，依下图进行布局设计。

图4-2-22．连接数据库●创建数据源: 选择“窗口”，“数据库”命令，打开“数据库”面板，单击“数据库”面板的“+”按钮，选择“数据源名称（DSN）”，打开“数据源名称”对话框，创建数据源。

图4-2-3●创建记录集：单击“绑定”面板的“+”按钮，选择“记录集（查询）”，弹出“记录集”对话框，定义记录集名称为rs，连接到数据源ly，表格选择lyb，按id降序排列。

图4-2-43．显示留言●选中留言内容表格，打开“服务器行为”面板，单击“+”按钮，选择“显示区域”→“如果记录集不为空则显示区域”，在弹出的对话框中选择rs记录集。

●选中“暂无留言”表格，打开“服务器行为”面板，单击“+”按钮，选择“显示区域”→“如果记录集为空则显示区域”，在弹出的对话框中选择rs记录集，这一项用于留言表为空时的显示内容。

●数据绑定：打开“绑定”面板，单击记录集前的“+”按钮，将记录集内的动态数据拖入页面中的相应位置。

绑定内容如下：姓名：{rs.xm}；留言内容：{rs.ly}；站长回复：{rs.hf}；{rs.xm}发表于{rs.time}；目前共有留言{rs_total}条，现在显示的是第{rs_first}条-第{rs_last}条留言；选中QQ图片，在“绑定”面板中将QQ字段绑定到img.alt，当鼠标指向QQ图片时就会显示相应的QQ号。

《ASP动态网页编程与上机指导》第7章：创建留言板系统

返回
7.4 新增留言页面
新增留言页面(Addwords.asp)主要用于添加留言信息。在查看留言页面(Default.asp)中，单击“我要留言”链接可进入此页面。在本页面中，对访问者的身份没有要求，无论是一般访问者还是管理员均可访问。
返回
7.5 管理员登录页面
管理员登录页面主要用于身份验证，在查看留言页面(Default.asp)中，单击“管理员”链接即可进入。在此页面中，用户通过登录验证后即可进入留言管理页面。
返回
7.5.2 判断登录信息
当用户单击【登录】按钮时，即可提交表单数据，并将页面转向至Login.asp进行处理。在Login.asp页面中，主要用于对用户所输入的登录信息进行验证。
返回
7.6 留言管理页面
7.6.1 留言管理页面介绍 7.6.2 审核、屏蔽和删除留言
返回
7.6.1 留言管理页面介绍
返回
7.2 基础文件基础文件Base.asp
系统中经常需要用到一些常量或函数，可以把这些常量或函数集中放置到一个文件中，调用时使用include file语句导入文件，这样就不需要在多个文件中分别进行定义，修改也比较方便。 Base.asp是本系统中的一个基础文件，主要提供常量定义以及常用函数定义
返回
7.8.2 保存管理员信息
与新增留言页面的处理方法相似。
返回
返回
7.1.3 系统的文件组织
本系统中的主要页面文件及其相应的文件功能
文件名 AddWords.asp Base.asp CropData.asp Default.asp Login.asp Login.html Managers.asp Modipass.asp Modipass.html 文件描述添加留言页面基础文件，基础文件，主要提供基本函数定义和常数定义留言数据处理页面查看留言页面管理员登录后台处理页面管理员登录界面留言管理页面修改密码后台处理页面修改密码界面

第9章动态网页制作留言板

2020/6/15
9.4 用Access 2019创建数据库
一般情况下，在我们的动态站点部署中包括两个主要内容：一个是动态脚本程序，另一个是对数据的存储和管理。
创建留言板数据库
2020/6/15
9.5 留言板逐步实现
1）创建数据库链接（1）通过DSN（数据源名称）实现
连接定义系统DSN
2020/6/15
9.2 配置动态服务器
2.设置IIS 控制面板|管理工具|Internet信息服务
右击默认网站项，执行新建|虚拟目录|下一步|别名：liuyanban|下一步|目录 :D:\liuyanban 下一步|访问权限中读取及运行脚本
至此IIS已经设置完成，然后就可以测试我们自己的ASP动态页面了。在 “Internet信息服务”窗口右边的窗格中找到建立的ASP动态页面，右击，在弹出的快捷菜单中选择“浏览”言板主页面
1.建立动态站点 1）定义站点 2）选择服务器技术 3）选择存放的本地文件夹 4）设置本机测试的URL
2020/6/15
9.3 创建留言板主页面
2.创建留言板主页面 1）创建留言板主页面ASP文档 2）用表格布局留言板主页面 3）在表格中插入一些显示元素
2020/6/15
2020/6/15
9.1 动态站点概述
动态网站技术可以将网页维护者从重复而繁琐的手动更新中解放出来，并且可以实现诸如留言板、BBS论坛、新闻实时发布等站点访问者与WEB服务器交互性很强的页面。
1.动态网站
我们这里所说的动态，并不是说用几个特效，或者几张GIF图片所做出的网站，而是一种具有“交互性”的页面效果，即网页会根据用户的要求和选择而动态改变和响应，将浏览器作为客户端界面，具有“自动更新” 的功能，无须手动更新HTML文档，便会自动生成新的页面。

基于asp+sqlserver动态网页留言版的设计与实现

陕西师范大学网络教育学院毕业论文（设计）论文题目基于ASP+SQL SERVER动态网页留言版的设计与实现姓名学号专业计算机科学与技术批次/层次 072/高起本指导教师学习中心目录摘要 (1)引言 (3)第一章留言板介绍 (4)第二章开发环境 (5)2.1 ASP开发概述 (5)2.1.1 ASP技术 (5)2.1.2 ASP技术的优点： (5)2.2、SQL server概述 (6)2.3 IIS工具 (8)2.3.1 IIS概述 (8)2.3.2 IIS的作用 (8)第三章需求分析 (9)3.1功能需求分析 (9)3.2数据库分析 (10)3.3 开发模式 (12)第四章系统设计 (14)4.1页面设计 (14)4.1.1后台页面 (14)4.1.2前台页面 (14)4.2源程序 (14)4.2.1 公共数据库连接主要代码 (14)4.2.2 登陆代码 (15)4.2.3 分页显示代码 (16)4.2.4 显示分页代码 (17)4.2.5 添加记录主要代码 (18)4.2.6 删除记录主要代码 (19)4.2.7 修改（更新）记录主要代码 (19)4.2.8 调用方法主要代码 (20)第五章操作方法 (22)5.1 IIS的安装与配置 (22)5.1.1安装IIS (22)5.1.2启动Internet信息服务（IIS） (23)5.1.3配置IIS (24)5.1.4设置主页文档 (25)5.2 登录留言板 (25)5.3 添加记录操作 (26)5.4删除记录操作 (26)第六章测试结果 (27)6.1测试目的 (27)6.2测试环境 (27)6.3测试方案 (27)6.4设计测试用例 (27)总结 (29)致谢 (30)参考文献 (31)摘要随着计算机的广泛应用，人们对网络已经不再感到陌生。

在科技飞速发展的今天，电脑信息技术与各行各业进行了有效的结合。

人们在网上可以进行网上购物，网上交友，电子商务，网络营销等等。

ASP动态网页设计4.1 任务一建立留言板数据库

项目四制作校园留言板引言留言板是互联网上最常见的一种服务，也是典型的交互式网页。

本项目就是制作一个校园留言板的设计与制作。

校园留言板实现的功能有：发表新留言、显示留言、回复留言、删除留言等，后台数据库仍采用Access数据库。

任务一建立留言板数据库任务描述留言板的主要功能是给用户提供一个交流与信息反馈的平台，要根据网站的实际需要进行合理的设计，校园留言板的设计原则应该是页面简单实用、美观大方。

图4-1-1任务分析留言板的基本功能如下：①留言板主页（index.asp），可分页显示当前的所有留言（包含第一页、上一页、下一页及最后一页按钮），也可以输入新留言。

②主页中还包含删除留言及回复留言的功能，但只有管理员可以进行操作。

③管理员通过管理员登录表单进入主页，执行所有操作。

本任务主要使用“应用程序”面板组制作，系统流程图如下。

图4-1-2方法与步骤1．创建本地站点①在F:\ASP文件夹下建立一个名为lyb的文件夹作为留言板文件夹，并在lyb文件夹下建立一个名为images的图片文件夹，专门用来存放网站所需图片。

②启动IIS，发布建立好的文件夹F:\ASP\lyb，设置其默认文档为index.asp。

③打开Dreamweaver，“站点”→“管理站点”→“新建”→“站点”，建立一个名为“校园留言板”的站点，其本地根文件夹为F:\ASP\lyb。

④在站点根文件夹下建立动态网页文件，如下表所示。

留言板系统文件说明2．建立数据库和数据表启动Microsoft Access，在lyb文件夹下新建数据库lyb.mdb，数据库内包含两个表：留言表（lyb）和管理员表（gly）。

留言表（lyb）结构管理员表（gly）结构建立好管理员表（gly）结构后，在表中输入一条或几条记录，作为管理员的登录名和密码。

IDEA+SQL的动态留言板

一、实验目的1、实现用户登录2、实现点击相关留言后可进行留言的查看3、实现登录后可发布留言4、实现登录后可修改留言二、实验环境Windows XP系统下的IntelliJ IDEA jdk1.6 tomcat9.0 sql server2008三、实验内容1.留言板文件夹中文件及各页面2.index.css外联定义：* {margin: 0px;padding: 0px;}/*所有控件*/body{width: 100%;height: 100%;}button{background-color: orange;color: #dfdfdf;padding: 5px;text-decoration: none;border: #cdcdcd 2px solid;border-radius: 5px;width: 80px}tr{height: 30px;}span{margin-left: 10px;}a:LINk{text-decoration: none;color: black;}a:visited{text-decoration: none;color: black;}a:hover{text-decoration: none;color: orangered;}textarea{margin-left: 20px;resize: none;border-radius: 5px;background-color: rgba(238, 238, 238, 0.5);padding: 10px;border: white 1px solid;}input{border-radius: 5px;background-color: rgba(238, 238, 238, 0.5);padding: 5px;border: white 1px solid;}#all{margin: 0 auto;width: 1000px;height: 800px;}#top{background-image:url("../images/jiangnan.jpg");width: 1000px;height: 185px;}#head_top{height: 100px;}#head_bottom{height: 100px;}#head_top_login{float: right;}.head_top_login{width: 100px;}#head_bottom_button{margin-top:50px;}#middle_left{width: 60%;float: left;}.middle_left_ul {list-style: none;}.middle_left_li1{background-color: #dfdfdf;height: 35px;line-height: 35px;}.middle_left_li2{background-color: white;height: 35px;line-height: 35px;}.middle_left_preImg {width: 8%;float: left;height: 100%;}.middle_left_perImg_hongdian{ margin-top: 10px;margin-left: 15px;width: 20px;height: 20px;}.middle_left_theme1{float: left;width: 72%;height: 100%;}.middle_left_datetime1{float: right;width: 20%;height: 100%;}.middle_left_theme2{float: left;width: 70%;height: 100%;}.middle_left_datetime2{float: right;width: 20%;height: 100%;}#middle_left_middle{width: 100%;height: 600px;}#middle_left_bottom {float: right;margin-right: 10px;}#middle_right{width: 40%;height: 695px;float: right;background-color: #dfdfdf;}#middle_right_all{width: 96%;height: 97%;border: 2px solid darkgrey;margin: 5px;}#bottom{float: left;width: 1000px;height: 27px;}网页整体设计index.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><html><head><title>胡佳的留言板</title><link href="css/index.css" type="text/css" rel="stylesheet"><%--引入外部CSS文件--%></head><body><div id="all"><div id="top"><jsp:include page="index_head.jsp"/></div><div id="middle"><jsp:include page="index_middle.jsp"/></div><div id="bottom"><img src="./images/huitu.jpg"></div></div></body></html>关于上部分登录的代码index_head.jsp：<%@ page contentType="text/html;charset=UTF-8" language="java" %><%if (session.getAttribute("YoN") == null) {session.setAttribute("YoN","fail");}if(session.getAttribute("YoN").equals("fail")){%><div id="head_top"><jsp:include page="index_head_top.jsp"/></div><div id="head_bottom"><jsp:include page="index_head_bottom.jsp"/></div><%}else if(session.getAttribute("YoN").equals("success")){%><div id="head_top"><jsp:include page="index_hea_top_successful.jsp"/></div><div id="head_bottom"><jsp:include page="index_head_bottom_successful.jsp"/></div><%}%>把登陆结果通过servlet提交并调用dopost方法：<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="head_top_login" ><form method="post" action="Login_Servlet" name="form1">用户名：<input type="text" name="user" class="head_top_login">密码：<input type="password" name="pass" class="head_top_login"><div style="float:right;"><input type="image" src="images/denglu.jpg"onclick="javascript:document.forms['form1'].submit"><%--提交表单给Servlet并调用doPost方法--%><%-- <a href="Login_Servlet"><img src="images/denglu.jpg"></a>--%> </div></form></div>成功登录后头部显示代码index_hea_top_successful.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="head_top_login" >欢迎进入留言板<span style="color:darkred"><%=session.getAttribute("username")%></span><%--从session中取出username--%></div>未登陆时头部分的小部分只显示查看留言按钮，点击查看留言可跳转页面index_head_bottom.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="head_bottom_button"><button><a href="Page_Switching?right_show=chakan">查看留言</a></button></div>成功登录后出现查看留言，发布留言，修改留言的按钮index_head_bottom_successful.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="head_bottom_button"><button><a href="Page_Switching?right_show=chakan">查看留言</a></button> <button><a href="Page_Switching?right_show=fabu">发布留言</a></button><button><a href="Page_Switching?right_show=xiugai">修改留言</a></button></div>网页中间部分的整体布局：<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="middle_left"><jsp:include page="index_middle_left.jsp"/></div><div id="middle_right"><%if(session.getAttribute("right_change")==null){session.setAttribute("right_change",1); }if((Integer)session.getAttribute("right_change")==1){%><jsp:include page="index_middle_right_see.jsp"/><%}else if((Integer) session.getAttribute("right_change")==2){%><jsp:include page="index_middle_right_post.jsp"/><%} else if((Integer)session.getAttribute("right_change")==3){%><jsp:include page="index_middle_right_update.jsp"/><%}%></div>中间左边部分显示相关留言,需要导入相关包，从数据库中获取留言，index_middle_left.jsp:<%@ page import="dao.MessageDao" %><%@ page import="entity.MessageEntity" %><%@ page import="java.util.ArrayList" %><%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="middle_left_top"><img style="width: 600px;" src="images/liuyanneirong.jpg"></div><div id="middle_left_middle"><%int i = 0;int count=0;boolean flag=true;if(session.getAttribute("PAGE")==null){session.setAttribute("PAGE",0);}else{i= (int) session.getAttribute("PAGE");}MessageDao messageDao=new MessageDao(i);ArrayList<MessageEntity> messageEntities=messageDao.getMessageEntity();count=messageDao.getCount();session.setAttribute("COUNT",count);session.setAttribute("messageEntities",messageEntities);%><ul class="middle_left_ul"><% for(MessageEntity messageEntity:messageEntities){ if (flag==true){%><li class="middle_left_li1"><div class="middle_left_preImg"><div><img src="./images/message.png" class="middle_left_perImg_hongdian"></div></div><div class="middle_left_theme1"><ahref='/message_war_exploded/See_Message?index=<%=messageEntity.getId()%>'><%=messageEntity.getTheme()%></a></div><divclass="middle_left_datetime1"><%=messageEntity.getDatetime().toString()%></div> </li><%flag=false;}else{%><li class="middle_left_li2"><div class="middle_left_preImg"><div><img src="./images/message.png" class="middle_left_perImg_hongdian"></div></div><div class="middle_left_theme2"><ahref='/message_war_exploded/See_Message?index=<%=messageEntity.getId()%>'><%=m essageEntity.getTheme()%></a></div><divclass="middle_left_datetime2"><%=messageEntity.getDatetime().toString()%></div></li><%flag=true;}}%></ul></div><div id="middle_left_bottom"><button><a href="/message_war_exploded/Page_Turning?id=up">上一页</a></button><button><a href="/message_war_exploded/Page_Turning?id=down">下一页</a></button><button><a href="/message_war_exploded/Page_Turning?id=first">首页</a></button></div>点击查看留言，右边部分显示相应留言信息，index_right_see.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="middle_right_all"><%、if(session.getAttribute("Theme")==null){session.setAttribute("Theme"," ");session.setAttribute("Author"," ");session.setAttribute("DateTime"," ");session.setAttribute("Content"," ");session.setAttribute("Reply"," ");}%><table ><tr><td colspan="2" ><img src="./images/chakanliuyan.jpg"></td> </tr><tr><td style="width: 60px"><span>主题：</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("Theme"));%></td> </tr><tr><td><span>作者:</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("Author"));%></td> </tr><tr><td><span>日期:</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("DateTime"));%></td> </tr><tr><td><span>内容:</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("Content"));%></td> </tr><tr><td><span>回复：</span></td><td class="middle_right_neirong" style="color:darkred"><%out.print((session.getAttribute("Reply")));%></td></tr></table></div>点击发布留言，右边部分显示相应信息，index_right_post.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="middle_right_all"><form action="Post_Servlet" method="post"><table ><tr><td><img src="./images/woyaoliuyan.jpg"></td></tr><tr><td style="width:50px;"><span>主题：</span></td></tr><tr><td><input type="text" name="zhuti" style="width: 300px;margin-left: 20px"></td></tr><tr><td><span>作者:</span></td></tr><tr><td><input type="text" name="zuozhe" style="width: 300px;margin-left: 20px"></td></tr><tr><td><span>内容：</span></td></tr><tr><td><textarea name="neirong" rows="10" cols="37" ></textarea></td> </tr><tr><td style="padding: 30px"><button style="margin-left: 220px;width: 70px">发&nbsp&nbsp表</button></td></tr></table></form></div>点击修改留言，右边部分显示相应信息，index_right_update.jsp:<%@ page contentType="text/html;charset=UTF-8" language="java" %><div id="middle_right_all"><%if(session.getAttribute("Theme")==null){session.setAttribute("Theme"," ");session.setAttribute("Author"," ");session.setAttribute("DateTime"," ");session.setAttribute("Content"," ");session.setAttribute("Reply"," ");}%><form action="Update_Servlet" method="post"><table ><tr><td colspan="2" ><img src="./images/xiugailiuyan.jpg"></td> </tr><tr><td style="width: 60px"><span>主题：</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("Theme"));%></td> </tr><tr><td><span>作者:</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("Author"));%></td> </tr><tr><td><span>日期:</span></td><tdclass="middle_right_neirong"><%out.print(session.getAttribute("DateTime"));%></td> </tr><tr><td style="line-height: 10px"><span>内容:</span></td><td class="middle_right_neirong" ><textarea name="neirong"rows="10" cols="35" ><%out.print(session.getAttribute("Content"));%></textarea></td> </tr><tr><td colspan="2"><button style="margin-left: 220px;width:70px;margin-top: 20px">修&nbsp&nbsp改</button></td></tr></table></form></div>关于登录的login_servlet:package servlet;import dao.MessageDao;import erDao;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import java.io.IOException;import java.sql.SQLException;@WebServlet(name = "Login_Servlet",urlPatterns = "/Login_Servlet")public class Login_Servlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding("UTF-8");response.setContentType("text/html;charset=utf-8");String username=request.getParameter("user");String pass=request.getParameter("pass");request.getSession().setAttribute("username",username);System.out.println(request.getSession().getAttribute("username"));// response.getWriter().println(request.getParameter("user"));UserDao userDao=new UserDao();try {boolean YoN =userDao.login(username,pass);System.out.println(YoN);if(YoN==false){request.getSession().setAttribute("YoN","fail");//对YoN对象赋值response.getWriter().println("<script>alert('用户名或密码错误');window.location.href='index.jsp';</script>");}else if(YoN==true){request.getSession().setAttribute("YoN","success");response.getWriter().println("<script>alert('登录成功');window.location.href='index.jsp';</script>");}} catch (SQLException throwables) {throwables.printStackTrace();} catch (ClassNotFoundException e) {e.printStackTrace();}// response.sendRedirect("index.jsp");}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doPost(request, response);}}关于查看留言的see_message:@WebServlet(name = "See_Message",urlPatterns = "/See_Message")public class See_Message extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {int index = Integer.parseInt(request.getParameter("index"));ArrayList<MessageEntity> messageEntities =(ArrayList)request.getSession().getAttribute("messageEntities");Iterator var5 = messageEntities.iterator();while(var5.hasNext()) {MessageEntity messageEntity = (MessageEntity)var5.next();if (messageEntity.getId() == index) {request.getSession().setAttribute("Theme", messageEntity.getTheme());request.getSession().setAttribute("Author", messageEntity.getAuthor());request.getSession().setAttribute("Content",messageEntity.getContent());request.getSession().setAttribute("DateTime",messageEntity.getDatetime());request.getSession().setAttribute("Reply", messageEntity.getReply());request.getSession().setAttribute("UpdateID",messageEntity.getId());}}response.sendRedirect("index.jsp");}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doPost(request, response);}}关于分页的page_turning:@WebServlet(name = "Page_Turning",urlPatterns = "/Page_Turning")public class Page_Turning extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {int page = (Integer)request.getSession().getAttribute("PAGE");int count = (Integer)request.getSession().getAttribute("COUNT");String id = request.getParameter("id");HttpSession var10000;if (id.equals("up")) {if (page > 0) {request.getSession().setAttribute("PAGE",--page);}} else if (id.equals("down")) {if (page < count / 17) {request.getSession().setAttribute("PAGE",++page);}} else if (id.equals("first")) {request.getSession().setAttribute("PAGE", 0);}response.sendRedirect("index.jsp");}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doPost(request, response);}}关于发布留言post_servlet:@WebServlet(name = "Post_Servlet",urlPatterns = "/Post_Servlet")public class Post_Servlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding("UTF-8");response.setContentType("text/html;charset=utf-8");String zhuti = request.getParameter("zhuti");String zuozhe = request.getParameter("zuozhe");String neirong = request.getParameter("neirong");MessageDao messageDao = new MessageDao();try {PreparedStatement pst = messageDao.postMessage(zhuti, zuozhe, neirong);if (pst.executeUpdate() != 0) {response.getWriter().println("<script>alert('留言成功，快去看看吧');window.location.href='index.jsp';</script>");}} catch (SQLException var8) {var8.printStackTrace();} catch (ClassNotFoundException var9) {var9.printStackTrace();}}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doPost(request, response);}}关于修改留言update_servlet:@WebServlet(name = "Update_Servlet",urlPatterns = "/Update_Servlet")public class Update_Servlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding("UTF-8");response.setContentType("text/html;charset=utf-8");String content=request.getParameter("neirong");Integer messageid= (Integer) request.getSession().getAttribute("UpdateID");MessageDao messageDao=new MessageDao();System.out.println("ID="+request.getSession().getAttribute("UpdateID"));try {PreparedStatement pst= messageDao.updateMessage(content,messageid);if (pst.executeUpdate() != 0) {response.getWriter().println("<script>alert('修改成功，快去看看吧');window.location.href='index.jsp';</script>");}} catch (SQLException throwables) {throwables.printStackTrace();} catch (ClassNotFoundException e) {e.printStackTrace();}}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doGet(request, response);}}UserDao的定义：public class UserDao {public boolean login(String username,String pass) throws SQLException, ClassNotFoundException {DBHelper dbHelper=new DBHelper();Connection conn=dbHelper.getConnection();PreparedStatement pst=conn.prepareStatement("select pass from [user] where username='"+username+"'");ResultSet rs=pst.executeQuery();while(rs.next()){if(rs.getString("pass").equals(pass)){System.out.println("调用了Userdao的login且登陆成功");return true;}else{System.out.println("调用了Userdao的login且登陆失败");return false;}}System.out.println("调用了Userdao的login");return false;}}MessageDao的定义：public class MessageDao {private Connection conn;private Statement stmt;private ResultSet rs;public MessageDao() {System.out.println("调用了无参构造");}public MessageDao(int index) throws SQLException, ClassNotFoundException { DBHelper dbhelper = new DBHelper();this.conn = DBHelper.getConnection();this.stmt = this.conn.createStatement();this.rs = this.stmt.executeQuery("select top 17 * from (\n" +"select ROW_NUMBER() over(order by id desc) as rn,* from message\n" +") as a where rn >= " + (17 * index));}private MessageEntity setMessageEntity() throws SQLException, ClassNotFoundException {MessageEntity messageEntity = new MessageEntity();messageEntity.setId(this.rs.getInt("id"));messageEntity.setTheme(this.rs.getString("theme"));messageEntity.setAuthor(this.rs.getString("author"));messageEntity.setDatetime(this.rs.getDate("nowdate"));messageEntity.setContent(this.rs.getString("content"));messageEntity.setReply(this.rs.getString("reply"));return messageEntity;}public ArrayList<MessageEntity> getMessageEntity() throws SQLException, ClassNotFoundException {ArrayList messageEntities = new ArrayList();while(this.rs.next()) {messageEntities.add(this.setMessageEntity());}return messageEntities;}public Integer getCount() throws SQLException, ClassNotFoundException { int count = 0;DBHelper dbHelper = new DBHelper();Connection conn = DBHelper.getConnection();Statement stmt = conn.createStatement();ResultSet rs = stmt.executeQuery("select count(*) as count from message");if (rs.next()) {count = rs.getInt("count");}dbHelper.close(conn, rs, stmt);return count;}public PreparedStatement postMessage(String theme, String author, String content) throws SQLException, ClassNotFoundException {LocalDate now = LocalDate.now();System.out.println("datetime:" + now);String sql = "insert into message values('" + theme + "','" + author + "','" + now + "','" + content + "','已转')";DBHelper dbHelper = new DBHelper();Connection conn = DBHelper.getConnection();PreparedStatement pst = conn.prepareStatement(sql);return pst;}public PreparedStatement updateMessage(String content ,int id) throws SQLException, ClassNotFoundException {String sql="update message set content='"+content+"' where [id]='"+id+"'";DBHelper dbHelper=new DBHelper();Connection conn=dbHelper.getConnection();PreparedStatement pst=conn.prepareStatement(sql);return pst; }}db_javaee数据库中的user表：Message表：四、实验结果：未登录时只能查看留言的页面：登录之后发布留言：发布之后点击查看留言可看到新发布的留言；点击修改留言可对留言进行修改：点击查看留言可以发现留言被修改了：五、实验心得与小结本次大作业让我学会了很多东西，实验一是静态网页的制作，当时我是直接在html中定义css，而这次我是通过css外联的方式，少写了很多代码，只需要把需要更换的部分替换一下就好了。