1、目录网站开发设计报告书1博客系统3一、课程设计目的3二、课程设计内容31课程设计简介32设计说明32.1系统设计32.2数据库设计73设计流程94实现功能105详细设计105.1设计技术和工具105.2页面预览及部分代码10三、课程设计总结20博客系统 一、 课程设计目的通过课程设计,检验我们学习的情况,同时也是增强我们锻炼的机会。通过实实在在的演练,使我们能清楚自己的掌握语言的程度、以及正确的衡量自己的水平,以达到学以致用的目的。二、 课程设计内容1课程设计简介博客是Webblog的译文,同时他也可以译作(“网络日志”,“网志”等),是一种互联网平台上的个人信息交流中心。设计本系统的目的主要
2、是为了在网络上能够构建一片自己的思想空间,同时也为了满足网友之间相互交流、相互学习的目的,通过所学的知识进行具体的实践,不仅能检查自己所学知识的情况,还可以在实践当中发现自己的不足之处。2设计说明设计模块包括两个模块:系统设计和数据库设计,系统设计模块,主要是设计博客系统的前台页面和博客网后台也面。整个系统采用PHP语言编写,页面布局使用了div+css的布局方式,数据库构建采用的是MySQL。页面设计使用的html以及Javascript。2.1系统设计2.1.1系统功能结构:博客系统主要分为前台和后台,其中根据其博客其前台的特点,可以将其分为博主信息、网络日历、文章查询等部分,各个部分及其
3、功能模块如下图所示:根据博客网后台的特点,可以将其分为用户设置、个人相册管理、博客文章管理、博主信息修改等部分,其中各个部分及其包括的具体功能模块如下图所示:2.1.2系统流程图为了更加清晰地表达业务功能模块,给出博客网的系统流程图,对于不同的角色,其各自的权限和功能也不相同。包括面向用户的客户端和面向系统管理员的流程图。l 面向客户端流程图如下图所示:l 面向系统管理员的流程图如下图所示:2.1.3开发环境本博客系统的开发坏境:u 服务器端:l 操作系统:windowsXPl Web服务器:Apache2.2.8l 数据库:MySql5.5l 浏览器:Google Chromel 分辨率:1
4、024x768u 客户端:l 浏览器:Google Chromel 分辨率:1024x7682.2数据库设计2.21数据库需求分析随着科学技术的不断发展,网络现在已经成为我们学习和生活中的一部分。网络的迅速发展,给我们的生活带来了巨大的改变。大部分人现在已经离不开网络。在网络中,我们可以构建一个个性化的博客,可以充分展示自己的思想,表达自己的才能,抒发自己的情感。网友也可以根据主题发表自己的意见和看法,与博主进行探讨、交流,这样就可以不断的提高自己。2.2.2数据概念设计根据以上对系统做的需求分析和系统设计,得出系统中使用的数据库实体分别为用户信息实体、博客文章信息实体。 用户信息实体用户信息
5、实体包括密码、E-mail、用户名、个性签名、个人介绍、管理员级别。 博客文章信息实体博客文章信息实体包括文章题目、文章内容、文章发表时间、文章浏览次数属性。2.2.4数据库逻辑结构设计 详细数据库设计本博客系统包含有四个数据表n tb_article(文章信息表)文章信息表主要是保存发表的文章、文章发表的时间、浏览的次数等。 表tb_article结构字段名称 数据类型 是否为空默认值说明articleidint(10)否Null文章IDcontentlongtext否Null文章内容authorVarchar(20)否Null文章作者nowdatatime否Null文章发表的日期title
6、Varchar(200)否Null文章标题 btimeInt(10)否Null文章浏览的次数n tb_filecomment(文章评论信息表)文章评论信息表主要是用于保存注册用户评论的信息、评论的时间等信息。 表tb_filecomment结构字段名称 数据类型 是否为空默认值说明commentidInt(4)否Null评论ID号 articleidInt(4)否Null文章ID usernameVarchar(20)否Null用户名 contentVarchar(240)否Null文章内容datetimedatetime否Null文章评论时间n tb_tpsc()图片上传表主要是保存博主上传
7、的图片信息。 表tb_tpsc结构字段名称 数据类型 是否为空默认值说明idInt(10)否Null图片IDimgurlVarchar(50)否Null图片链接地址AutuorVarchar(20)否Null图片上传者ScsjInt(20)否Null图片上传的时间n tb_user(用户信息表)用户信息表主要是保存用户的ID、用户名、用户密码、Email、用户个人介绍、个性签名等信息。 表tb_user结构字段名称 数据类型 是否为空默认值说明useridInt(20)否Null用户ID usernameVarchar(40)否Null用户名 UserpswVarchar(40)否Null用户
8、密码 EmailVarchar(100)否Null用户E-mail地址 usericoVarchar(50)否Null用户头像 usersignVarchar(200)是Null用户签名信息 userintroducemediumtext是Null用户个人介绍 powerInt(1)否Null权限3设计流程本博客系统按照一般系统的开发流程进行设计,首先进行需求分析找出系统中的用例,其次进行数据库设计,设计系统所需的表,再次是设计系统的前台页面,后台页面。最后进行的是测试,验证系统是否符合预期设计,同时也可以根据测试的结果进行一些修改。4实现功能此博客系统主要实现网站建设者与访问者之间的相互交流
9、,通过本博客系统平台实现用户和用户之间信息交流。l 博主通过发表文章,表达自己的想法和观点、以及自己的一些生活感悟等,实现博主和博主之间相互交流的目的。l 博主可以上传自己喜欢的图片到自己的相册,主页将会显示博主最近上传的图片,同时,也可以对自己相册的图片进行删除。l 未注册用户可以浏览博主发表的文章、图片等,但是不能进行评论,只有注册用户才可以对博主发表的文章。l 博主发表的文章,按用户的浏览的次数进行排序。l 博主可以对自己发表的文章进行修改、删除操作。l 超级管理员可以对非法的文章、图片进行删除操作。l 博主可以修改自己的基本信息,如密码、邮箱等、同时也可以查看别人的基本信息。5详细设计
10、本系统是采用面向对象的方法进行设计的,主要的用例有超级管理员和一般用户。5.1设计技术和工具l 设计技术 在登录模块、注册模块,主要采用了Ajax技术,来实现用户登录信息的提交到数据库。 密码是采用的是MD5加密技术,使得用户的安全性得到了保证。 验证码采用的是Javascript脚本来实现的,通过刷新每次产生不同的随机数。 图片的随时更新,主要是利用Jquery来实现的。 发表文章主要是使用了一个网络的一个在线文本编辑器(ckeditor)。 整个网站全部页面都静态化,有利于浏览器检索和网站的保密性。 l 工具本系统的实现主要采用的是最简单的文本编辑器Editplus 、zend studi
11、o、phpmyAdmin、vim、dreamweaver、powerdesigner5.2页面预览及部分代码1.登录页面:登录页面的验证码部分,采用的是Javascript脚本来生随机数,源码如下:javascript部分: /-生成随机数- var num1=Math.round(Math.random()*100000000); var num=num1.toString().substr(0,4); document.write(); register.yzm1.value=num; function code_1()var num1=Math.round(Math.random()*1
12、00000000); var num=num1.toString().substr(0,4); document.code.src=yzm.php?num=+num; register.yzm1.value=num;验证码的背景图片是采用PHP中的GD库,来生成图片。php部分:?php/利用php的GD库生成验证码图片$num=$_GETnum;header(Content-type:image/PNG);/$im=imagecreate(80,40);$im=imagecreate(60,20); /生成原始图片imagefill($im,0,0,imagecolorallocate($i
13、m,200,200,200);imagestring($im,5,10,3,substr($num,0,1),imagecolorallocate($im,rand(0,255),rand(0,255),rand(0,255);imagestring($im,5,20,3,substr($num,1,1),imagecolorallocate($im,rand(0,255),rand(0,255),rand(0,255);imagestring($im,5,30,3,substr($num,2,1),imagecolorallocate($im,rand(0,255),rand(0,255),
14、rand(0,255);imagestring($im,5,40,3,substr($num,3,1),imagecolorallocate($im,rand(0,255),rand(0,255),rand(0,255);for($i=0;$i2.博客系统主页博主的文章根据点击的次数进行排序,实现这一部分的源码如下:query($query);if($result)if($result-num_rows0)while($rows=$result-fetch_array()$articleid=$rowsarticleid; $one=explode(?,$_SERVERREQUEST_URI)
15、;if(count($one)=1) /url中未包含? echo .$rowstitle. .$rowsnow.;else /url中包含?if(isset($_GETPHPSESSID)$url=article.html?.SID.&articleid=.$articleid; echo .$rowstitle. .$rowsnow.;elseecho .$rowstitle. .$rowsnow.;elseecho 暂时没有文章!;else echo 查询失败!;?分页功能源码如下:query($query);$artic
16、les_total=$result-num_rows; /取得总文章数$articles_page=5; /每页显示的文章数$pages_total=ceil($articles_total/$articles_page); /总页数,也是最后一页/$page=isset($_getpage)?intval($_getpage):1; /这句就是获取page的值,假如page还未设定,那么页数就是1。if(isset($_GETpage)$page=$_GETpage;else$page=1;$start=$articles_page*($page-1); /起始记录数$query_2=sel
17、ect* from tb_article order by now desc limit $start,$articles_page;$result=$mysqli-query($query_2);if($result)if($result-num_rows0)while($rows=$result-fetch_array()?作者: 时间: 阅读次数:250)$string=mb_substr($rowscontent,0,250,gb2312); /截取250个字符用以发布,mb_substr用以截
18、取中文字符串不会产生乱码$string_print=$string.; /未取完的文章以省略号代替echo $string_print;else$str=$rowscontent;echo $str;?根据博主最近上传的图片进行显示,源码如下所示:query($query);if($result)if($result-num_rows0)?3.注册页面注册页面主要有用户名、密码、邮箱、个性签名、自我介绍等,其部分源码如下:密 码 * 确认密码 *邮 箱 *!-上传头像- f
19、unction textLimitCheck(thisArea, maxLength, SpanId) /根据onkeyup事件计算文本框中的字符个数 if (thisArea.value.length maxLength) alert(maxLength + 个字限制. r超出的将自动去除.); thisArea.value = thisArea.value.substring(0, maxLength); thisArea.focus(); /*回写span的值,当前填写文字的数量*/ document.getElementById(SpanId).innerHTML = thisArea
20、.value.length; 个性签名(0/100)自我介绍(0/200)4.发表文章页面发表文章页面中发表文章,是采用的在线文本编辑器(ckeditor)。其实现本页面部分源码如下:function checkarticle()if(articleform.title.value=)alert(文章题目不能为空!);articleform.title.focus();return false;articleform.article.value=CKEDITOR.instances.article.getData();if(articleform.article.value=)alert(文章
21、内容不能为空!);articleform.article.focus();return false;form action=commit.php?flag=& method=POST name=articleform onsubmit=return checkarticle();input type=hidden name=author value=input type=hidden name=now value= 文章题目 input type=text name=title size=50px maxlength=100 value=内 &nb
22、sp; 容 5.图片上传页面该图片上传只能上传指定格式的图片,其部分原吗如下:num_rows;if($num0)?本博客共有张图片fetch_array()?img src= width=540 height=420上一张 下一张?php if($yourpower=1|$yourpower=2) echo 上传的所有图片;/echo 删除;$query=selec
23、t * from tb_tpsc where author=.$username.;$result=$mysqli-query($query);if($result)$num=$result-num_rows;if($num0)while($rows=$result-fetch_array()$pieces=explode(/,$rowsimgurl);$imgname=$pieces3;echo ;echo 删除;?6.Ajax部分,以注册页面输入用户名为例当用户在用户名一栏输入完想要注册的用户名后,鼠标点击其他注册栏时,用户名输入栏的右侧就会
24、显示提示信息,提示用户该用户名是否已被注册。javascripte关键部分代码:/利用Ajax检查用户注册名是否可用function checkname()var xmlhttp;if(window.XMLHttpRequest)xmlhttp=new XMLHttpRequest();else if(window.ActiveXObject)xmlhttp=new ActiveXObject(Microsoft.XMLHTTP);var username=document.getElementById(username).value;if(username=)document.getElem
25、entById(nameinfo).innerHTML=用户名不能为空;return false;var url=commit.php?flag=checkusername&username=+username; /url参数xmlhttp.open(GET,url,true);xmlhttp.setRequestHeader(Content-Type,application/x-www-form-urlencoded); /设置请求头信息xmlhttp.onreadystatechange=function()if(xmlhttp.readyState=4&xmlhttp.status=20
26、0)var flag=xmlhttp.responseText;/document.getElementById(nameinfo).innerHTML=+flag+;if(flag=true)document.getElementById(nameinfo).innerHTML=可以注册;document.getElementById(NF).value=yes;elsedocument.getElementById(nameinfo).innerHTML=该用户名已被注册;document.getElementById(NF).value=not;xmlhttp.send();php关键部
27、分代码:/验证用户名是否重用函数function checkusername()if(isset($_GETusername)$username=$_GETusername;$mysqli=ConnDB:getConn();$mysqli-query(set names gb2312);/if(isset($_GETuserid)/$userid=$_GETuserid;/$query=select * from/else$query=select * from tb_user where username=.$username.;/$result=$mysqli-query($query);
28、if($result)if($result-num_rows0) /此用户名已被注册echo flase;else /此用户名未被注册echo true;7.网站的伪静态化本网站的伪静态化是通过在本博客的项目文件夹中加入Apache分布式配置文件.htaccess,在其中重写用户访问规则实现。.htaccess文件的配置代码如下:RewriteEngine OnRewriteRule index.html$ index.phpRewriteRule login.html$ login.phpRewriteRule register.html$ register.phpRewriteRule a
29、rticle.html$ article.phpRewriteRule user.html$ user.phpRewriteRule write.html$ write.phpRewriteRule img.html$ img.phpRewriteRule allimg.html$ allimg.phpRewriteRule exit.html$ exit.phpRewriteRule commit.html$ commit.phpRewriteRule userico.html$ userico.phpRewriteRule usersetting.html$ usersetting.phpRewriteRule changepassword.html$ changepassword.php三、 课程设计总结本博客系统主要是用PHP来实现的,作为一个完整的博客系统,本系统的主要结构有:阅读博客,后台管理,系统管理。
版权声明:以上文章中所选用的图片及文字来源于网络以及用户投稿,由于未联系到知识产权人或未发现有关知识产权的登记,如有知识产权人并不愿意我们使用,如有侵权请立即联系:2622162128@qq.com ,我们立即下架或删除。
Copyright© 2022-2024 www.wodocx.com ,All Rights Reserved |陕ICP备19002583号-1
陕公网安备 61072602000132号 违法和不良信息举报:0916-4228922