web开发实训.doc

源码网资料下载：安徽机电职业技术学院WEB开发实训实训报告姓 名：程欢欢班 级：软件3081班指导教师：汪强、汪学文、汪峰坤完成日期：2010年6月 摘要本文的叙述围绕着如何实现一个功能完善的网站进行展开。依据本次毕业设计的要求，主要从可行性分析、需求分析、总体设计、详细设计、编码、测试几个阶段进行毕业设计论文的编写。接着在需求分析中，根据用户的角度，分析了所设计的网站需要实现哪些基本功能；从设计者的角度，分析了设计一个网站所用的编辑工具和编程语言及网站的软硬件开发环境。根据分析的结果，主要采用FrontPage，Dreamweaver编辑器，结合ASP.net（vbscript,javascript）编程编程语言，进行网站的页面设计；网站的主要功能主要分为新闻、下载、友情链接、网上调查，图片几大模块。详细设计阶段的任务就是把解法具体化。在详细设计阶段，依据总体分析的结果，进行具体页面的组织和数据库结构的设计。页面的组织主要是设计网页之间的联系，同时根据这些联系实现网页基本功能的构架；数据库的设计主要考虑各程序模块的基本功能，设计相应的表格、字段，用来存贮相应的数据记录，为页面的生成提供数据来源。在编码阶段，进行具体网页的编码设计。在设计中，根据网页的程序界面，表单，需要的数据等，写出实际的程序代码。由于本次设计的页面比较多，不可能尽数地写出全部程序的代码，因此，在这一章节中，主要解释了在此次设计中主要用到的页面设计和数据库的编码技术。(源码网整理：)测试的主要任务是为了发现程序中的错误，软件测试的过程亦是程序运行的过程。在本次设计中，主要采用边测试边修改的方法，在测试网页的同时根据结果及时进行相应的修改。在测试过程中，主要从外观、链接、速度方面测试网页是否能够实现相应的功能。关键字ASP.net、FrontPage、DeamweaverABSTRACTThe textual description is around how to realizes the perfect website of a function proceeds to launch.According to the request of this graduate design, primarily analyze from the viability assessment, analysis of need, total design, detailed design, code design, test this five stage to proceed this graduate design.Immediately after analyze the inside in the need, according to the customers angle, analyzed basic functions of which demand in website for designing of realizeses;From angle of the design, analyzed to design a development environment of soft hardware for editor tool for using with weaving the language and website.According to the analysiss result, mostly use Dreamweaver , and connected ASP( vbscript, javascript) language, proceed the design of websites page;The websites main function is primarily divided with the news, forums, message the guestbook , net investigate, amusement.The mission of the detailed design stage is to embody the solution method.In the result of the total analysis of detailed design stage, basis, proceed the buildup of the concrete page is with the design of construction database.Page 构 for contact for of buildup primarily iswhich design web paging, at the same time according to these contacts realizing basic function of web page;Main each procedure mold of consideration of the databases design piece form, word for of basic function, design cowgirl segment, use to come the data of cowgirl the record, for the page of born provide the data source.In the coding stage, proceed the coding design of the concrete web page.In the design, according to the web pages procedure the data etc. of the interface, form and list, demand, write out actual of procedure code.Because of the page of this design coding technique for page for code for manyly, impossible whole amount ground writing all procedures ofs, therefore, in this chapter, primarily explaining here time design inside primarily using design with database.Process of testing that main mission is for the sake of the process that detection mistake in the procedure, software testing and as well is a procedure to circulate.In this design, main adoption side test side method that modify, in the test web page of at the same time according to the modification that result on time proceeds cowgirl.In the test process, main connect from the external appearance, flat-out aspect test whether web page can realize or not cowgirl of function.前言就目前来讲，随着Internet的迅猛发展,网页设计技术已成为计算机学习的重要内容之一. 近几年来,网页设计技术一直在推陈出新.不断有新技术被推出并应用,实在令人眼花缭乱.这些网页设计技术可以分为静态网页技术和动态网页技术两种. 静态网页技术一般是指HTML和CSS技术.采用静态网页技术的网页只能在网页中展示文字和图片,但它却是所有网页设计的基础技术.动态网页技术是指让网页能够按照用户的需求做出动态响应的技术,例如JavaScript , VBScript及ASP.NET等技术都属于动态网页技术的范畴. 目前,大部分制作网页的方式,都是运用网页设计软件,这些软件的功能相当强大,使用非常方便.不论是那一种网页设计软件,最后都是将所设计的网页转化为HTML,CSS,JavaScript/VBScript和ASP.所以说,虽然有这些网页设计软件帮助我们设计网页,但是一个专业设计者仍需了解HTML,.等网页设计语言和技术的使用,这样才能充分让我们了解网页的真正设计理念。因此毕业设计再次选择这个题目来检验自己的能力。 我们所用的软件主要是Dreamweaver，刚运用此软件之前，主要学习Html基础知识，为学习Dreamweaver做铺垫，而主要软件Dreamweaver是学习的核心工具，在网络上称其为“网页三剑客”（ 新版本Dreamweaver8、Fireworks8和Flash8）中的“织梦者”， 是一个“所见即所得”的可视化网站开发工具。它是一款专业的HTML编辑器，是设计开发Web站点、Web页和Web应用程序的得力助手。不管是直接编写HTML代码还是直接在可视化编辑环境中制作网页，Dreamweaver都会有许多工具帮助设计者完成每项工作，设计出更多完美的网页。目录摘要2前言4目录5第1章 绪论6第2章 需求分析72.1网站系统分析72.2主页设计72.3数据库设计7第3章 详细设计93.1公司介绍93.1.1 功能：93.1.2截图：93.2公司介绍93.2.1 功能：93.2.2截图：103.3产品订购103.3.1 功能：103.3.2截图：113.4人才招聘113.4.1 功能：113.4.2截图：123.5客服中心123.5.2截图：123.6登录界面设计133.7注册界面143.8管理员页面18第4章 网站的优缺点194.1.优点194.2.不足19第5章 总结20参考资料21参考图书21第1章 绪论在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。Internet上发布信息主要是通过网站来实现的，获取信息也是要在Internet“海洋”中按照一定的检索方式将所需要的信息从网站上下载下来。因此网站建设在Internet应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。而做这样一个全面宣传，展示学院风采、优点与特色，发布学校的重大活动安排与学院各种政策的网站。校园网是各种类型网络中一大分支，有着非常广泛的应用。作为新技术的发祥地，学校、尤其是高等学校，和网络的关系十分密切，网络最初是在校园里进行实验并获得成功的，许多网络新技术也是首先在校园网中获得成功，进而才推向社会的。另一方面，作为学校，知识、人才的资源十分丰富，比其他行业更渴求信息、希望能有渠道获得各种各样的信息来促进自身在研究、学术上的进步。第2章 需求分析2.1网站系统分析根据前面的设计思想进行分析，按照系统开发的基本观点对网站进行分解，从内容上可对网站作如下划分：公司介绍：介绍公司创办及现在的发展情况。公司新闻：通过新闻、生动活泼的展现公司情况。产品订购：用户可以根据需要选择自己的产品并订购。人才招聘：在线投递简历和下载文档发送邮件应聘。客服中心：访客投票，网站征求意见。互动交流：所有访客发帖发表自己的意见和建议。图文展示：清晰地了解产品外观。2.2主页设计网站主页采用静、动相结合的方式，即静态的主画面和动态的图片相结合，体现学校的勃勃生气，静态主页方式介绍学校风采、优点特色、信息发布，对于四大校务，就得利用ASP.NET与数据库结合的技术建立数据库查询管理系统，采用交互式的动态的web画面来实现。主页结构图注：带下划线的表示是链接方式2.3数据库设计采用的数据库是Microsoft SQL Server 2005 ，拟建立jinsuanpan.mdf库文件，包含如下几个表文件(源码网整理：)：User 用户表news 新闻列表zhiwei 招聘职位表第3章 详细设计3.1公司介绍3.1.1 功能：主要对公司的简单介绍，包括公司历史，历史成就，以及为各地人才招聘，更重要的是通过网站简单的叙述公司的情况。3.1.2截图：3.2公司介绍3.2.1 功能：学院新闻页面主要介绍学院最近一段时间的学院师生的一些主要活动我介绍一下在设计新闻报道或通讯报道版面的设计技巧。当然，你并不一定是要在新闻单位或杂志社工作才需要设计新闻报道，其实，很多机构里的内部刊物、定期或不定期的通讯甚至一些公司寄给客户的资料中都会用到。我们将会告诉你，仅仅通过色彩，我们就可以将版面搞得漂漂亮亮。3.2.2截图：3.3产品订购3.3.1 功能：用户可以根据需要选择自己的产品并订购。3.3.2截图：3.4人才招聘 3.4.1 功能：在线投递简历和下载文档发送邮件应聘。3.4.2截图：3.5客服中心 3.5.1 功能：访客投票，网站征求意见。 3.5.2截图：3.6登录界面设计 3.6.1 功能：实现用户登录 3.6.2截图：3.6.3,.代码：protected void Button1_Click(object sender, EventArgs e) string username = TextBox1.Text; string password = TextBox2.Text; string type = DropDownList5.Text; / 获取数据库连接字符串 SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStringscmConnectionString.ConnectionString); string sql = Select * From User Where username=username AND password=password AND type=type; SqlCommand comm = new SqlCommand(sql, conn); comm.Parameters.AddWithValue(username, username); comm.Parameters.AddWithValue(password, password); comm.Parameters.AddWithValue(type, type); conn.Open(); SqlDataReader dr = comm.ExecuteReader(); if (dr.Read() /Sessionusername = drusername as string; Sessiontype = drtype as string; /tbName.Text = ; /lblStatus.Text = 欢迎你， + Sessionusername as string+,+Sessionuseruype as string; if (Sessiontype as string = 管理员) Response.Redirect(Default.aspx); else Response.Redirect(guanliyuan.aspx); else Session.Abandon(); Label3.Text = 你还没有登录。alert(用户名、密码或用户类型错误！); conn.Close(); 3.7注册界面 3.7.1 功能： 用户注册，可以互动及对公司提出意见。 3.7.2截图：3.7.3代码：protected void Page_Load(object sender, EventArgs e) /RandomColor rgb = new RandomColor();/声明一个随即颜色对象 Random r = new Random(); string code = r.Next(1000, 9999).ToString(); / 设置验证控件的验证值 CompareValidator2.ValueToCompare = code.ToString(); Bitmap image = new Bitmap(80, 20); Graphics g = Graphics.FromImage(image); g.Clear(Color.Black); / 将随机数画到image对象上 g.DrawString(code, new Font(Arial, 16), new SolidBrush(Color.White), new PointF(10, 0); / 画两条干扰线 g.DrawLine(new Pen(Color.Wheat), 5, 5, 75, 18); g.DrawLine(new Pen(Color.Wheat), 10, 16, 70, 8); string filename = images/ + code.ToString() + .jpg; string filepath = MapPath(filename); / 保存图像到文件 image.Save(filepath, System.Drawing.Imaging.ImageFormat.Jpeg); / 在Image控件上显示 Image1.ImageUrl = filename; / 释放资源 image.Dispose(); g.Dispose();跳转页面：代码：protected void Page_Load(object sender, EventArgs e) if (PreviousPage = null) return; / 获取输入的用户名 TextBox tbName = (TextBox)PreviousPage.FindControl(tbName); string username = tbName.Text; if (ExistUsername(username) / 判断用户名是否存在，见下页 Response.Write(用户名 + username + 已经存在，请单击返回重新注册。); return; TextBox tbpassword = (TextBox)PreviousPage.FindControl(tbpassword); string password1 = Encrypt(tbpassword.Text); / 获取数据库连接字符串 SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStringscmConnectionString.ConnectionString); / 构造插入的SQL语句 string sql = INSERT INTO User(username,password,type) VALUES (UserName, Password, Type); SqlCommand comm = new SqlCommand(sql, conn); / 设置Command对象的参数 comm.Parameters.Add(Username, SqlDbType.VarChar); comm.Parameters.Add(Password, SqlDbType.VarChar); comm.Parameters.Add(Type, SqlDbType.NVarChar); / 设置Command对象的参数值 comm.ParametersUsername.Value = username; comm.ParametersPassword.Value = password1; comm.ParametersType.Value = user; conn.Open(); try comm.ExecuteNonQuery(); catch (Exception ex) Response.Write(数据库插入记录时出错，出错信息为： + ex.Message); return; finally conn.Close(); Response.Write(注册成功，页面会在5秒后自动跳转到主界面，如过您的浏览器不能自动跳转，请点击登录。); private bool ExistUsername(string username) / 获取数据库连接字符串 SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStringscmConnectionString.ConnectionString); string sql = Select * From User Where username=Username; SqlCommand comm = new SqlCommand(sql, conn); comm.Parameters.Add(Username, SqlDbType.VarChar); comm.ParametersUsername.Value = username; conn.Open(); SqlDataReader dr = comm.ExecuteReader(); bool isExist = dr.Read(); conn.Close(); return isExist; public string Encrypt(string password) password = password.ToLower(); Byte clearBytes = new UnicodeEncoding().GetBytes(password); Byte hashedBytes = (HashAlgorithm)CryptoConfig.CreateFromName(MD5).ComputeHash(clearBytes); return BitConverter.ToString(hashedBytes); 3.8管理员页面3.7.1 功能：以管理员身份进入可以实现对网站内的数据实现更新修改。 3.7.2截图： 第4章 网站的优缺点4.1.优点1.网站从布局方面讲紧凑合理，链接性强，色彩方面搭配合理，主页与子网页之间颜色过渡合适，子网页之间色彩内容过渡也较为合理。2.网站完全根据要求而制作，不存在疏漏之处，包括网站具备的基本功能，运行正常。4.2.不足1.从整体布局看较为合理，但是从局部来讲存在一些技术上和严密性的不足。2.页面的链接虽然正常，但是链接不够紧凑，部分可能存在无法返回主页面。3.页面美观度不够高，Dreamewver CS3软件应用不够熟练，软件中所涉及得制作方法以及工具没有更好的应用。4.2 改进方法1.配色原则：避免网页杂、乱，有时候单一色彩不为也是一种独特，用色柔和，减少视觉混乱，对比度强的色彩不能应用于一般网站。2.字体问题：字体是整个网页最醒目的部分，若字体不协调会给人一种枯燥的感觉，避免用黑色字体，减少压抑感。3.制作习惯：制作一个网页首要的是完美的构思，应该先构思好再动手制作，素材搜集完整，根据主题选材，不能脱离主题，确保所用材料与主题相关。最好不要一点一点添上去，只要布局素材准备充分，应该可以做到理想网页。4.完整性：网站的基本格式完整，相关链接，友情链接必不可少，这也增加了网页的方便性。5.不可忽略的细节：客户对网站的感觉不好，不过又说不出，多半是细节处理问题，细心的处理网页的每一个象素，力求完美。 第5章 总结1.不要滥用flash对于我们一个不专业的人来说，错误的认为Flash是增加网页美感的主要元素，其实不然，一个网页制作的成功与否，不仅是Flash的精彩，更多的是布局设计，能否给人一种整体美，Flash在网页中出现的频率要适当，因为网页是用来展示信息的，而不是展示Flash。2.不要让网页看起来杂乱无章网页是一个大杂烩，但缺乏合理结构的网站往往会使信息的浏览变得非常困难，当然我们所做的网站只是个人或者班级，没有面向整个网络，不过以后这些必须得要学以致用。3.要给人印象深刻网站看上去漂亮不怎么重要，关键是吸引眼球，想百度、谷歌、一些大网