个人网站设计报告_第1页
个人网站设计报告_第2页
个人网站设计报告_第3页
个人网站设计报告_第4页
个人网站设计报告_第5页
已阅读5页,还剩9页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

个人网站设计报告一、设计知识准备静态网页与动态网页1.1静态网页1.1.1静态网页概念所谓静态网页,就是说该网页文件里没有程序代码,只有HTML标志,这种网页一般以后缀.HTML或.HTM存放。静态网页一经制成,内容就不会变化,不管何时何人访问,现时的内容都一样。1.1.2静态网页工作原理当大家在浏览器里输入一个静态网页网址回车后,就向服务器提出一个浏览网页的请求,服务器端接到请求后,就会找到大家要浏览的静态网页文件,然后发送给大家。1.2动态网页1.2.1动态网页概念所谓动态网页,就是说该网页文件不仅含有HTML标记,而且含有程序代码,这种网页的后缀一般根据不同的程序设计语言而不同,动态网页能够根据不同的时间、不同的来访者而显示不同的内容。1.2.2动态网页的工作原理。当大家在浏览器里输入一个动态网页网址回车后,就向服务器提出一个浏览网页的请求,服务器端接到请求后,首先会找到大家要浏览的动态网页的文件,然后就执行网页文件中的程序代码,将含有程序代码的动态网页转化成为标准的静态网页,然后将静态网页发送给大家。简介又称ASP+,但它不是ASP的简单升级,而是微软提出的.NET框架的一部分,它是一种以.NET框架为基础开发网上应用程序的全新模式。.NET框架(.NETFRAMEWORK)主要由以下三部分组成:公共语言运行库(CommonLanguageRuntime,CLR)基础类库(BaseClassLibrary)、、C#等语言运行库。3.简介(1)的前身是VisualBasic,这是一种简单好学、功能强大的卡发环境,也是世界上最为流行的程序语言。(2)对VisualBasic进行了彻底的改革,对底层进行了重建,使其真正成为了面向对象的程序设计语言。文件结构HTML文件结构很简单,由头部和身体部分组成,结构严谨清晰,如下:<html><head><title>标题文字</title>头部内容</head><body>文档主体内容</body></html>二、硬件及软件需求准备(1)计算机一台,要求有256M内存,20G存储容量。(2)Visual2005开发工具(选择语言为)。(3)MicrosoftAccess数据库软件。三、网站总体分析与设计。网站介绍。1.1网站主题:☆雨衣☆的空间(类似于QQ空间)1.2网站风格:梦幻风格1.3网站主页面构图及相关内容功能介绍:首页中包含了导航栏目:如心情、留言板、网站导航、上传图片、故事接龙,一些关于我的信息,可以在上网时写入急需的文件等等。心情模块:可以让网友把自己所想的,有感触的心事写成心情,记录在自己的空间中,可以随时随地的了解自己在生活中一路走过来的心情变化。留言板模块:让网友想对空间主人所说的话,留下个脚印,无论是亲切的关怀,还是善意的批评,提供交流,知道自己并不孤独!网站导航模块:有些人因为在找不到方便实用的网站而苦恼,''网站导航〃就解决这个问题,让你可以轻松快速浏览、找到自己想要的网址。上传图片模块:可以每个人珍贵的记忆保留下来,让每个关心你的人都知道你的最近变化,不用为你担心。故事接龙模块:可以在线的玩故事接龙游戏,给每个人活跃的平台。网站结构图。3.MicrosoftAccess数据库的建立。3.1依次选择菜单命令【开始】一【程序】一【MicrosoftAccess]就可以启动Access2003,点击''文件〃在下拉菜单中选择''新建〃,选择''空数据库〃,指定后保存路径后出现如下所示对话框:3.2双击上图【实用设计器创建表】选项,出现下图所示对话框:说明:(1)字段名称可以用中文,也可以用字母、数字和下划线,命名规则和变量类似,考虑系统的兼容的问题,建议不要用中文。(2)至于数据类型,常用的有'文本〃、''备注〃、''数字〃、''日期/时间〃、“是/否〃和''自动编号〃等。其中''文本〃用于比较短的字符串(最长255个字符);''备注〃用于比较长的字符串,最长可以容纳65535个而字符;、'是/否〃用于布尔类型,只有True(真)或False(假);、'自动编号〃是个特殊的类型,它可以自动的递增或随机产生一个数字,经常用它产生一个唯一的编号。3.3正确输入所有字段后,单击Access主窗口的【保存】按钮,就会弹出下图所示的【另存为】对话框,在其中输入表的名称,然后单击【确定】按钮即可。3.4当表保存后,可以看到下图所示对话框:3.5双击【表1】可以在表中输入数据,当你建表完毕后,觉得数据不合理,想修改数据也可以双击【表1】进行修改,如果想修改表的字段,就右击【表1】,选择''设计视图〃,就可以进行修改,下表为输入数据后的结果:4.与的存取数据库。存取数据库是开发网络程序中最重要也最常用的部分,.NET框架提供了,利用它就可以方便的存取数据库。准确的说,是由很多类组成的一类库。这些类库提供了很多对象,分别用来完成和数据库的连接、查询记录、插入记录、更新记录和删除记录等操作。其中主要包括如下5个对象。(1)Connection对象:用来连接到数据库。(2)Command对象:用来对数据库执行SQL命令。(3)DataReader对象:用来从数据库返回只读数据。(4)DataAdapter对象:用来从数据库返回数据,并送到DataSet对象中,还要负责保证DataSet对象中的数据和数据库中的数据保持一致。(5)DataSet对象:它可以看做是内存中的数据库。实用OLEDB的数据库,需要在页面中导入相关的名称空间:<%@ImportNamespace=""%><%@ImportNamespace=".OleDb"%>存取数据库:(1)首先利用Connection对象建立和数据库的连接。语法为:、'Provider=OLEDB驱动程序;DataSource=数据库文件物理路径〃(2)然后建立Command对象,执行SQL语句命令。(3)利用Command对象的ExecuteReader方法建立DataReader对象,从数据库获取数据。(4)DataReader对象返回的数据在记录集移动指针就可依次显示所有记录。(5)利用Command对象的Executenonquery()方法可插入记录和更新记录。四、网站的详细设计。1.☆雨衣☆的空间网站的主要的功能模块的设计和编码。1.1登陆界面。登陆注册模块设计功能实现:(1)当管理员输入正确用户名和口令时才能进入空间主页。(2)对网站里内容进行管理和维护修改,包括对心情的修改,对留言的删除,对照片的上传等。(3)提供新用户的注册。登陆界面和注册界面如下:其中登陆界面主要代码为:与数据库相连登陆程序,当登陆成功时则直接跳转到网站的主页,其主要代码如下:<%@ImportNamespace=""%><%@ImportNamespace=".OleDb"%>DimconnAsNewOleDbConnection("Provider=.4.0;DataSource="+(""))DimstrSqlAsStringstrSql="Select*FromlinkWhereusername='"&&"'Andmypassword='"&&"'"DimcmdAsNewOleDbCommand(strSql,conn)()DimdrAsOleDbDataReader=()If()=TrueThen()(”主页.aspx")Else()=”您必须输入有效的用户名和密码,还没注册?"EndIf当点击注册按钮时,跳转到注册页面,主要程序代码如下:ProtectedSubButton1_Click(ByValsenderAsObject,ByValeAs)(”注册.aspx")EndSub注册界面在数据库中插入新注册用户信息主要代码如下:DimstrSqlAsStringstrSql="InsertIntolink(username,mypassword,age,email,submit_date)Values('"&user_&"','"&&"','"&&"','"&&"',#"&Now()&"#)"当注册成功时,则跳回登陆界面,主要代码如下:DimcmdAsNewOleDbCommand(strSql,conn)DimExpAsExceptionTry()()()(”登陆.aspx")CatchExp="<palign='center'>发生错误,可能是用户名已经被人使用。"EndTry1.2心情模块的设计。心情模块的设计功能实现:能在空间中显示和查看以前全部写过的心情。当管理员登陆后,可以在空间里写自己的心情。编辑修改以前写过的心情,同时也可以对以前写过的心情进行删除。其中心情界面如下:其中主要代码如下:启动页面时调用数据绑定子程序:DimconnAsOleDbConnectionSubPage_Load(SenderAsObject,EAsEventArgs)conn=NewOleDbConnection("Provider=.4.0;DataSource="&("心情.mdb"))IfNotIsPostBackThenCallBindData()EndIfEndSub调用的子程序为:SubBindData()DimadpAsNewOleDbDataAdapter("select*fromlinkOrderBytimeDESC”,conn)DimdsAsNewDataSet()(ds,"xinqing")=("xinqing").DefaultView()EndSub在本模块设计中,实用DataGrid控件存取数据库,当单击编辑时,Cint()会返回选定的行号,对选定的行号进行编辑,其主要代码是:SubMyDataGrid_Edit(SenderAsObject,EAsDataGridCommandEventArgs)=CInt()CallBindData()EndSub在编辑过程中,单击更新时,主要执行的SQL语句的代码为:DimstrSqlAsStringstrSql="UpdatexinqingSetname='"&&"',text='"&&"',time=#"&Now()&"#Whereid="&(CInt())DimcmdAsNewOleDbCommand(strSql,conn)DimExpAsExceptionTry()()()CatchExp=”发生错误,没有正常更新记录”EndTry=-1CallBindData()删除时主要是根据选中行号的ID来删除,其删除语句为:DimstrSqlAsStringstrSql="DeletefromlinkWhereid="&(CInt())1.3留言板模块的设计留言板模块功能的实现:显示以前所有人在空间里的留言。当管理员登陆后,能对其留言进行删除和回复。查看留言者的详细信息。留言板界面如下:其程序代码(同心情模块原理类似)。1.4上传图片模块设计:上传图片模块功能的实现:可以上传照片。网友可以浏览上传的图片。管理员管理图片。其中上传图片和浏览图片的界面如下:上传照片模块与其他模块有些不相同,连接的数据库是SQL数据库,也本网站设计的重点和难点,其上传照片主要代码如下:<%@ImportNamespace=""%><%@ImportNamespace=".sqlclient"%><%@PageLanguage="vb"Debug="true"%><scriptlanguage="VB"runat="server">ProtectedSubButton2_Click(ByValsenderAsObject,ByValeAs)DimimgdatastreamAsimgdatastream=DimimgdatalenAsIntegerimgdatalen=DimcaptionAsStringcaption=Dimbytesoriginal()AsByteReDimbytesoriginal(imgdatalen)DimnAsIntegern=(bytesoriginal,0,imgdatalen)addphoto(caption,bytesoriginal)=”图片已经上传”EndSubPublicSubaddphoto(ByValcaptionAsString,ByValbytesoriginal()AsByte)DimconnAsSqlConnection=NewSqlConnection("server=localhost;uid=kid;;pwd=;database=Photos;Trusted_Connection=True")()'DimaAsInteger'DimrAsNew'随机生成函数'a=(500,10000)DimsqlstrAsStringsqlstr="insertinto图片([bytesoriginal],[caption],[bytesfull],[bytesposte门,[bytesthumb])”sqlstr&="values(@bytesoriginal,@caption,@bytesfull,@bytesposter,@bytesthumb)”DimcmdAsSqlCommand=NewSqlCommand(sqlstr,conn)(NewSqlParameter("@bytesoriginal",bytesoriginal))(NewSqlParameter("@caption”,caption))(NewSqlParameter("@bytesfull”,resizeimagefile(bytesoriginal,600)))(NewSqlParameter("@bytesposter",resizeimagefile(bytesoriginal,198)))(NewSqlParameter("@bytesthumb”,resizeimagefile(bytesoriginal,100)))()()EndSubPrivateFunctionresizeimagefile(ByValimagefileAsByte(),ByValtargetsizeAsInteger)DimoldimageAsoldimage=.FromStream(New(imagefile))DimnewsizeAsnewsize=calculatedimensions(,targetsize)DimnewimageAsnewimage=New(,,)DimcanvasAscanvas=.FromImage(newimage)(oldimage,New(New(0,0),newsize))DimmAsNew(m,)Return()EndFunctionPrivateFunctioncalculatedimensions(ByValoldsizeAs,ByValtargetsizeAsInteger)DimnewsizeAsNewIf>Then=(*(targetsize/))=targetsizeElse=targetsize=(*(targetsize/))EndIfReturnnewsizeEndFunction其浏览照片的主要代码如下:<%@ImportNamespace=""%><%@PageLanguage="VB"%><scriptrunat="server">PublicSharedsGreetingAsIntegerProtectedSubFirButton_Click(ByValsenderAsObject,ByValeAs)=FalsesGreeting=Session("first_photoid")="第"&CStr(sGreeting)&”张”Session("photoid")=sGreetingEndSubProtectedSubPreButton_Click(ByValsenderAsObject,ByValeAs)'IfsGreeting<=1ThenIfsGreeting<=Session("first_photoid")Then=”这是第一张!”="第"&CStr(sGreeting)&”张”=TrueElsesGreeting-=1="第"&CStr(sGreeting)&”张”Session("photoid")=sGreetingEndIfEndSubProtectedSubNexButton_Click(ByValsenderAsObject,ByValeAs)IfsGreeting>=Session("last_photoid")Then="第"&CStr(sGreeting)&”张”=”这是最后一张了!”=TrueElse=FalsesGreeting+=1="第"&CStr(sGreeting)&”张”Session("photoid")=sGreetingEndIfEndSubProtectedSubLasButton_Click(ByValsenderAsObject,ByValeAs)=FalsesGreeting=Session("last_photoid")="第"&CStr(sGreeting)&”张”Session("photoid")=sGreetingEndSubProtectedSubPage_LOAD(ByValsenderAsObject,ByValeAs)Session("photoid")=1Dimsqlstrl,sqlstr2AsStringDimconn1AsSqlConnection=NewSqlConnection("server=localhost;uid=kid;;pwd=;database=Photos;Trusted_Connection=True")()sqlstr1="selectmax(photoid)什om图片"sqlstr2="selectmin(photoid)from图片"Dimcmd1,cmd2AsNewSqlCommandcmd1=NewSqlCommand(sqlstr1,conn1)Session("last_photoid")=()()cmd2=NewSqlCommand(sqlstr2,conn1)Session("first_photoid")=()()

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论