第8章 新闻发布系统.docx
- 文档编号:11198001
- 上传时间:2023-02-25
- 格式:DOCX
- 页数:43
- 大小:11.73MB
第8章 新闻发布系统.docx
《第8章 新闻发布系统.docx》由会员分享,可在线阅读,更多相关《第8章 新闻发布系统.docx(43页珍藏版)》请在冰豆网上搜索。
第8章新闻发布系统
第8章新闻发布系统
新闻发布系统是构成企业网站的重要组成部分,它一方面可以用来发布企业的最新公告,另外一方面可以发布与企业相关的新闻动态。
新闻发布系统一般包括添加、修改、删除以及查询新闻等功能。
8.1网站的规划
本章重点介绍建立一个具备添加、修改、删除数据库中的数据等功能的新闻发布系统的方法。
下面将分别介绍新闻发布系统的网站结构与页面设计。
8.1.1网站结构
新闻发布系统的网站结构示意图如图8-1所示,主要包括浏览者页面与管理员页面两部分,网站的首页为news.jsp。
图8-1网站结构示意图
本案例的本地站点和测试站点都架设在本地服务器。
用户既可以在Dreamweaver动态网站环境下按
//localhost:
8080/news/news.jsp来测试网站的首页news.jsp。
8.1.2页面设计
本案例所介绍的新闻发布系统的页面包括添加公告、修改公告、删除公告等7个页面,见表8-1。
其中,浏览者只有浏览及查询公告的权限,而系统管理员则有添加、修改、删除公告信息等权限。
表8-1新闻发布系统的页面文件
文件名称
功能说明
news.jsp
新闻发布系统主页面
news_show.jsp
新闻发布详细内容页面
news_login.jsp
系统管理员登录页面
news_admin.jsp
系统管理员管理主页面
news_add.jsp
添加公告页面
news_upd.jsp
修改公告页面
news_del.jsp
删除公告页面
8.2数据库设计
在本书所有的案例中,每个案例的文件夹下都包含一个数据库文件夹。
程序中用到的数据库均采用复制数据库文件夹的方法,还原数据库到MySQL的数据库文件夹下。
8.2.1还原数据库
1.复制数据库文件夹到MySQL的数据库文件夹
打开案例所在的文件夹,将数据库文件夹news复制到MySQL的数据库文件夹data下,如图8-2所示,即完成了数据库的还原。
图8-2复制数据库文件夹到目标位置
2.在MySQLQueryBrowser中查看数据库中的表
登录MySQLQueryBrowser,在MySQLQueryBrowser主界面的右侧导航中显示出已经还原的数据库news,如图8-3所示。
图8-3已经还原的数据库
双击数据库news,在展开的包含文件中显示出数据库中的数据表admins和newsdata,如图8-4所示。
图8-4数据库中包含的数据表
8.2.2数据表的结构
在图8-4中,选中某个数据表,按
1.表admins的结构
表admins用来存储管理页面的账号和密码,表的结构如图8-5所示。
表8-5表admins的结构
当前表中已经预存了一条管理员的记录,用户名和密码的值都是“admin”。
2.表newsdata的结构
表newsdata用来存储新闻公告的信息,所有字段的命名都以“news_”为前缀,目的在于避免与系统保留字的冲突。
本表的主键是news_id(新闻编号),并设置为自动编号auto_increment,表的结构如图8-6所示。
图8-6表newsdata的结构
8.3定义网站与设置数据库连接
接下来要在Dreamweaver中定义一个JSP网站,设置本地文件夹、测试服务器和数据库的连接,见表8-2。
表8-2定义网站
参数
设置值
站点名称
JSP新闻公告系统
本地文件夹
C:
\Tomcat\webapps\news
测试服务器
C:
\Tomcat\webapps\news
网站测试地址
http:
//localhost:
8080/news/
MySQL服务器地址
localhost:
3306
MySQL服务器管理账号/密码
root/root
数据库名称
news
数据表名称
admin、newsdata
1.复制网页源文件
本书所附的素材文件中的news文件夹包含此案例所需的全部原始文件(静态页面),用户可以将其全部复制到网站的根目录C:
\Tomcat\webapps下。
2.定义网站
(1)建立本地站点
打开Dreamweaver,选择“站点”→“新建站点”,打开站点定义对话框,新建一个名称为“JSP新闻公告系统”的本地站点,使用的本地文件夹为C:
\Tomcat\webapps\news,如图8-7所示。
图8-7建立本地站点
(2)建立测试服务器
将分类切换到“测试服务器”类别,设置服务器模型为“JSP”,访问为“本地/网络”,测试服务器文件夹为C:
\Tomcat\webapps\news,HTTP地址为http:
//localhost:
8080/news,如图8-8所示。
图8-8建立测试服务器
完成设置后,单击“确定”按钮,完成网站的定义。
3.设置数据库连接
完成了网站的定义后,需要设置网站与数据库的连接,才能在此基础上制作出动态页面。
操作步骤如下。
(1)打开网页news.jsp,在“应用程序”面板的“数据库”选项卡中单击“+”按钮,弹出选择数据库连接的菜单,如图8-9所示。
图8-9选择数据库连接的菜单
(2)在弹出的菜单中选择“MySQL驱动程序(MySQL)”命令,打开“MySQL驱动程序(MySQL)”对话框,如图8-10所示。
接下来,参照如表8-3所示的参数进行数据库连接设置。
图8-10“MySQL驱动程序”对话框
表8-3设置数据库连接参数
参数
设置值
连接名称
connNews
URL
Jdbc:
mysql:
//localhost:
3306/news
用户名
root
密码
root
Dreamweaver应连接
使用测试服务器上的驱动程序
(3)单击“测试”按钮测试是否与MySQL数据库连接成功。
如果连接成功,将打开如图8-11所示的对话框,显示“成功创建连接脚本”的提示信息。
图8-11连接成功
(4)单击“确定”按钮,返回到“MySQL驱动程序(MySQL)”对话框。
在“MySQL驱动程序(MySQL)”对话框中,单击“确定”按钮,完成设置网站与数据库的连接。
(5)打开生成的数据库连接文件connNews.jsp,生成的数据库连接代码如下:
<%
StringMM_connNews_DRIVER=”org.gjt.mm.mysql.Driver”;
StringMM_connNews_USERNAME=”root”;
StringMM_connNews_PASSWORD=”root”;
StringMM_connNews_STRING=”jdbc:
mysql:
//localhost:
3306/news”;
%>
8.4新闻发布系统主页面的制作
在Dreamweaver中定义网站,建立与MySQL数据库的连接后,就可以开始设计JSP页面了。
新闻发布系统主页面包含了新闻标题页面及新闻内容页面。
用户浏览新闻标题页面后,可以直接选择有兴趣的主题阅读详细内容。
8.4.1新闻标题页面的制作
新闻标题页面news.jsp用于显示网站所有公告的标题,用户可以选择要阅读的标题链接至详细内容,管理员可以从中选择进入管理页面的链接,如图8-12所示。
图8-12新闻标题页面
1.绑定记录集newslist
记录集可根据当前网页的需要选取所需的字段,甚至进一步筛选或排列信息内容。
在建立与MySQL数据库的连接后,就可以利用“绑定”面板,将所需要的字段链接至网页中。
news.jsp所使用的数据表是newsdata,绑定这个数据表字段的操作步骤如下。
(1)打开“绑定”面板,单击“+”按钮,从弹出的菜单中选择“记录集(查询)”命令。
(2)打开“记录集”对话框,参照如表8-4所示的参数进行记录集的设置,见图8-13,完成后单击“确定”按钮。
表8-4绑定记录集newslist的参数设置
参数
设置值
名称
newslist
连接
connNews
表格
newsdata
列
全部
排序
以news_date降序排列
图8-13记录集的参数设置
(3)绑定记录集后,将记录集的字段拖动至news.jsp网页的适当位置,如图8-14所示。
图8-14将记录集的字段拖动至网页
2.设置重复区域
由于要在news.jsp页面中显示数据库中的所有记录,而当前的设置只能显示数据库的第一条记录,所以需要设置“重复区域”服务器行为将数据一一读取并显示出来。
操作步骤如下。
(1)选取news.jsp页面中的数据行,如图8-15所示。
图8-15选取数据行
(2)打开“服务器行为”面板,单击“+”按钮,从弹出的菜单中选择“重复区域”命令,如图8-16所示。
图8-16选择“重复区域”命令
(3)打开“重复区域”对话框,设置每页显示的记录数。
例如,设置为3条记录,如图8-17所示。
图8-17“重复区域”对话框
(4)单击“确定”按钮返回到设计窗口,会发现所选取要重复区域的左上角出现了一个“重复”的灰色标签,表示已经完成设置,如图8-18所示。
图8-18重复区域的灰色标签
3.设置显示区域
如果根据记录集的状况或条件来判断是否要显示网页中的某些区域,这就是显示区域的设置。
例如,如果数据库中没有任何数据,则希望隐藏公告数据栏中的表格,并且显示没有任何数据的说明文字。
操作步骤如下。
(1)选取记录集有数据时要显示的数据表格,如图8-19所示。
图8-19选取数据表格
(2)打开“服务器行为”面板,单击“+”按钮,从弹出的菜单中选择“显示区域”→“如果记录集不为空则显示区域”命令,如图8-20所示。
图8-20选择“如果记录集不为空则显示区域”命令
(3)打开“如果记录集不为空则显示区域”对话框,如图8-21所示。
图8-21“如果记录集不为空则显示区域”对话框
(4)单击“确定”按钮返回到设计窗口,会发现所选取要显示的区域的左上角出现了一个“如果符合此条件则显示…”的灰色标签,表示已经完成设置,如图8-22所示。
图8-22显示区域的设置效果
(5)选取记录集没有数据时要显示的数据表格,如图8-23所示。
图8-23选取记录集没有数据时要显示的数据表格
(6)仍然在“服务器行为”面板中单击“+”按钮,从弹出的菜单中选择“显示区域”→“如果记录集不为空则显示区域”命令,如图8-24所示。
图8-24选择“如果记录集为空则显示区域命令”
(7)打开“如果记录集为空则显示区域”对话框,如图8-25所示。
图8-25“如果记录集为空则显示区域”对话框
(8)单击“确定”按钮返回到设计窗口,会发现所选取要显示的区域的左上角出现了一个“如果符合此条件则显示…”的灰色标签,表示已经完成设置,如图8-26所示。
图8-26记录集为空时的设置效果
4.加入记录集导航条与记录集导航状态
当记录集超过一页时,就必须设置上一页、下一页、第一页、最后一页的按钮或文字,让浏览者单击进行翻页,这就是记录集导航条的功能。
如果要进一步显示记录集的总记录数及当前是第几条记录,就必须加入记录集导航状态。
(1)移动鼠标指针到要加入记录集导航条的位置,如图8-27所示。
单击“插入”工具栏“数据”面板中的记录集分页按钮,在弹出的菜单中选择“记录集导航条”命令,如图8-28所示。
图8-27定位记录集导航条的位置
图8-28“记录集导航条”命令
(2)打开“记录集导航条”对话框,设置导航条的显示方式为默认的“文本”方式,如图8-29所示。
图8-29“记录集导航条”对话框
(3)单击“确定”按钮返回到设计窗口,会发现页面中出现该记录集的导航条,如图8-30所示。
图8-30加入记录集导航条后的效果
(4)接着插入记录集导航状态。
将鼠标指针移至导航条的下方,如图8-31所示。
单击“插入”工具栏“数据”面板中的“记录集导航状态”按钮,如图8-32所示。
图-31定位记录集导航状态的位置
图8-32“记录集导航状态”按钮
(5)打开“RecordsetNavigationStatus”(记录集导航状态)对话框,选取要显示导航状态的记录集,如图8-33所示。
图8-33“记录集导航状态”对话框
(6)单击“确定”按钮返回到设计窗口,会发现页面中出现该记录集的导航状态,如图8-34所示。
图8-34加入记录集导航状态后的效果
5.转到详细页面
浏览者可以单击感兴趣的标题链接至详细内容页面阅读其中的信息,这就是“转到详细页面”服务器行为。
操作步骤如下:
(1)选取公告标题,如图8-35所示。
图8-35选取公告标题
(2)打开“服务器行为”面板,单击“+”按钮,从弹出的菜单中选择“转到详细页面”命令,如图8-36所示。
打开“转到详细页面”对话框,如图8-37所示。
图8-36选择“转到详细页面”命令
图8-37“转到详细页面”对话框
(3)在“转到详细页面”对话框中,单击“浏览”按钮,打开“选择文件”对话框。
此处选择新闻详细内容页面news_show.jsp,如图8-38所示。
单击“确定”按钮,完成设置后的“转到详细页面”对话框如图8-39所示。
图8-38选择详细内容页面
图8-39完成设置后的“转到详细页面”对话框
在“转到详细页面”对话框中,最重要的设置是“传递URL参数”。
该参数用于向详细内容页面传递主题的参数进而调出该主题的详细资料。
在设计表结构的时候都会为表设置一个主键,每条记录主键列的数据是惟一的,所以这一列的值就是最好的选择。
这里为什么不特别设置“传递URL参数”呢?
因为程序会自动获取所设置列名为参数名,如果没有特殊的修改,则可以直接使用。
(4)单击“确定”按钮返回到设计窗口。
至此,新闻标题页面news.jsp设计完毕。
由于在前面章节的练习中数据库中已经存在了若干条记录,因此,用户在按
图8-40页面预览效果
8.4.2新闻内容页面的制作
本节讲解的是制作新闻内容页面news_show.jsp,用来显示浏览者单击新闻标题后显示出相关的详细内容。
设计的重点是如何接收主页面news.jsp所传递的参数,并根据这个参数显示数据库中的数据。
操作步骤如下:
(1)打开新闻内容页面new_show.jsp。
打开“绑定”面板,单击“+”按钮,从弹出的菜单中选择“记录集(查询)”命令。
(2)打开“记录集”对话框,参照表8-5中的参数进行记录集的设置,如图8-41所示,完成后单击“确定”按钮。
表8-5绑定记录集newsdatail的参数设置
参数
设置值
名称
newsdetail
连接
connNews
表格
newsdata
列
全部
筛选
news_id=URL/表单变量.news_id
图8-41“记录集”对话框
(3)绑定记录集后,将记录集的字段拖动至news_show.jsp网页的适当位置,如图8-42所示。
图8-42将记录集的字段拖动至网页
8.5新闻发布系统管理页面的制作
系统管理页面对于新闻发布系统来说至关重要,管理员可以通过这些页面添加、修改或者删除新闻的内容,使网站的信息能随时保持更新。
8.5.1管理员登录页面的制作
由于管理页面不允许普通浏览者进入,所以必须受到权限管理。
可以利用登录账号与密码来判断是否有适当的权限进入管理页面。
Dreamweaver对于登录页面的制作具有一套完整的服务器行为。
下面将讲解登录页面的制作方法。
(1)打开管理员登录页面news_login.jsp,如图8-43所示。
图8-43管理员登录页面
(2)打开“服务器行为”面板,单击“+”按钮,从弹出的菜单中选择“用户身份验证”→“登录用户”命令,如图8-44所示。
打开“登录用户”对话框,参照如图8-45所示设置相关参数。
图8-44选择“登录用户”命令
图8-45“登录用户”对话框
(3)单击“确定”按钮返回到设计窗口,完成管理员登录页面的制作。
8.5.2新闻管理主页面的制作
一个网站的系统管理主页面是在系统管理员成功登录后转向的页面,管理员可以使用此页面实时添加、修改或者删除新闻的内容。
新闻管理主页面news_admin.jsp的制作与news.jsp大致相同,不同的是,其中加入了能够转到编辑页面的“修改”和“删除”链接。
由于制作该页面的技术与news.jsp大致相同,此处对于制作细节不再详细描述,只讲解主要的制作过程和结果。
1.绑定记录集newsadmin
news_admin.jsp所使用的数据表是newsdata,绑定这个数据表字段的操作步骤如下。
(1)打开“绑定”面板,单击“+”按钮,从弹出的菜单中选择“记录集(查询)”命令。
(2)打开“记录集”对话框,参照如表8-6所示的参数进行记录集的设置,如图8-46所示,完成后单击“确定”按钮。
表8-6绑定记录集newsadmin的参数设置
参数
设置值
名称
newsadmin
连接
connNews
表格
newsdata
列
全部
排序
以news_date降序排列
图8-46记录集的参数设置
(3)绑定记录集后,将记录集的字段拖动至news_admin.jsp网页的适当位置,如图8-47所示。
图8-47将记录集的字段拖动至网页
2.设置重复区域
选取news_admin.jsp页面中的数据行,设置重复区域,如图8-48所示。
图8-48设置重复区域
3.设置显示区域
(1)选取记录集有书据时要显示的数据表格,设置“如果记录集不为空则显示”的显示区域,如图8-49所示。
图8-49显示区域的设置效果
(2)选取记录集没有数据时要显示的数据表格,设置“如果记录集为空则显示”的显示区域,如图8-50所示
图8-50记录集为空时的设置效果
4.加入记录集导航条与记录集导航状态
(1)移动鼠标指针到要加入记录集导航条的位置,设置显示方式为“文本”方式的导航条,如图8-51所示。
图8-51加入记录集导航条后的效果
(2)将鼠标指针移至导航条的下方,设置记录集的导航状态,如图8-52所示。
图8-52加入记录集导航状态后的效果
5.设置连接与转到详细页面
news_admin.jsp页面还要为管理员提供链接至编辑页面,因此需要设置表8-7中的3个页面链接。
表8-7设置3个页面链接
名称
链接的文件
添加新闻公告
news_add.jsp
修改
转到详细页面news_upd.jsp
删除
转到详细页面news_del.jsp
其中,添加新闻公告的文本链接最为简单,可以在选取相关文本后,在“属性”面板中直接将它链接到响应的文件即可。
而修改和删除的文本链接在设置上与添加新闻公告链接不同,除了要分别链接到响应的编辑页面以外,还要传递一个参数到编辑页面。
(1)选取文本“修改”,然后选择“转到详细页面”服务器行为,对话框的设置如图8-53所示。
图8-53“修改”链接转到详细页面的设置
(2)选取文本“删除”,然后选择“转到详细页面”服务器行为,对话框的设置如图8-54所示。
图8-54“删除”链接转到详细页面的设置
6.设置注销用户服务器行为
当用户需要退出管理页面时,不能将退出管理页面的链接直接链接到系统其他页面。
否则,浏览者可以通过单击浏览器的“前进”或“后退”按钮再次返回到管理页面,这样做非常不安全。
用户如果要真正地退出管理页面,必须使用“注销用户”服务器行为来实现。
(1)选取页面右上角的“退出管理页面”文字,打开“服务器行为”面板,单击“+”按钮,从弹出的菜单中选择“用户身份验证”→“注销用户”命令,如图8-55所示。
图8-55选择“注销用户”命令
(2)打开“注销用户”对话框,在“在完成后,转到”文本框中设置转向页面为news_login.jsp,如图8-56所示。
图8-56“注销用户”对话框
(3)单击“确定”按钮,完成注销用户的设置。
7.设置限制对页的访问服务器行为
为了保护注册用户信息安全的需要,限制一般浏览者试图绕过管理员登录页面而直接进入管理页面,用户可以在所有的管理页面中使用“限制对页的访问”服务器行为来实现这一功能。
(1)打开“服务器行为”面板,单击“+”按钮,从弹出的菜单中选择“用户身份验证”→“限制对页的访问”命令,如图8-57所示。
图8-57选择“限制对页的访问”命令
(2)打开“限制对页的访问”对话框,在“如果访问被拒绝,则转到”文本框中设置转向页面为news_login.jsp,如图8-58所示。
图5-58“限制对页的访问”对话框
(3)单击“确定”按钮,完成限制对页的访问的设置。
8.5.3添加新闻页面的制作
接下来要设计添加新闻的页面news_add.jsp,如图8-59所示。
该页面包含一个用于提供新闻信息的表单,主要功能是将页面的表单数据添加到网站的数据库中。
图8-59添加新闻页面
1.自动获得日期的设置
在网页设计时通常使用表单来添加网站数据库的记录。
在页面news_add.jsp中,除了设置表单字段之外,还可以通过隐藏域将新闻日期字段news_date设置为自动取得系统日期。
操作步骤如下:
(1)切换到代码窗口,在程序的第一行页面声明代码<%@page……%>的结尾处按
<%@pageimport=”java.util.Date”%>
<%@pageimport=”java.text.SimpleDeteFormat”%>
<%
SimpleDateFormatdate=newSimpleDateFormat(“yyyy-MM-dd”);
Stringposrdate=date.format(newDate());
%>
以上代码定义了一个变量postdate,其中存储了系统当前日期。
(2)将鼠标定位于表单中的“隐藏域”按钮,在文本框的右侧插入一个隐藏域,如图8-60所示。
图8-60插入隐藏域
(3)在“属性”面板中设置隐藏域的名称为news_date,值为<%=postdate%>,如图8-61所示。
图8-61设置隐藏域的名称和值
需要说明的是,表单中的其他字段的名称最好都设置为对应的数据表字段的名称。
这样,在后面加入“插入记录”服务器行为的时候就可以自动建立表单字段和相关表字段的对应。
2.设置表单请求编码
凡是涉及修改表单数据(包括插入记录和修改记录)并提交表单数据到数据库的程序,都需要在程序开始的位置设置表单请求编码为简体中文gb2312,这样才能使写入数据库中的数据为简体中文。
切换到代码窗口,在上面获取系统日期的代码下接着添加如下代码:
<%request.setCharacterEncoding(“gb2312”);%>
如果用户加入服务器行为使代码被移动到其他位置,请务必将其还原到程序开始的位置。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 第8章 新闻发布系统 新闻 发布 系统