WEB程序设计心得

WEB程序设计心得 篇2

本文根据多年的教学经验,提出了教学过程中存在的问题和改进的各种教学手段,以提高课程教学质量,最后对教学的班级进行了教学效果的对比。

1 Web程序设计课程教学中存在的问题

首先,课程中规则语法较多,知识点多,老师教学起来感觉繁琐,学生学习起来感觉枯燥。其次,老师只注重理论教学,不注重学生实践能力的培养。老师只是机械地讲授语法规则和课本上的简单程序例子,不能与实际课题和社会需要紧密结合,甚至与实际的应用开发相比产生严重的延后,也不注重培养和锻炼学生的实践动手能力,实验课中常常以验证例子为主,不能提高学生的编程能力、分析解决问题的能力,再次,不能因材施教,不能启发式的教学,不能更新知识库,结果导致不能开拓学生的创造性思维。

2 Web程序设计课程改进教学手段浅析

2.1实际项目教学

实际项目教学是采用“项目教学”模式,把社会实际项目引入教学环节,使学生在项目实施的工作过程中,了解.NET Web项目开发的完整过程,全面掌握.NET Web程序设计的实际开发技能。

将老师自己的实际项目贯穿整个教学过程。整个过程由师生共同完成,以促进学生在校学习与实际工作的一致性,项目采用老师的实际项目:海关信息管理系统,教学组织上将案例分解成6个相对独立的项目模块,每一个项目模块完成项目中的一个具体功能,每个小的项目模块对应课程相关内容的知识点,通过每个项目模块的完成,让学生逐一掌握相关的理论知识与开发技能,教学过程中培养学生的分析与设计的能力,循序渐进,最终完成整个项目,即完成了一个Web应用系统。这样不仅使学生很好的掌握Web应用系统开发的理论知识,而且能够很好的培养学生实际项目的设计能力,感受到实际Web开发过程的工作流程。

2.2任务驱动

根据程序设计类课程的特点,每一个项目模块的教学将按照“任务引入”、“任务分析”、“任务实施”、“任务评价”的过程展开,教学过程注重学生的实际参与,强调教学过程中的师生互动,充分体现“学生为主”的教学理念。

例如,在实际项目:海关信息管理系统中,任务一,CSS按钮样式导航条的制作,给学生提供网站框架,下部框架显示的页面以及对应提示等,要求学生按时完成任务,还有任务二,网站中教学视频的制作,其中要求点击“视频演示”按钮可以出现需要演示的视频,要求视频能成果上载,播放时要清晰、流畅以及位置要正确等。通过项目模块这样一个个的任务作为目标,促使学生去动手开发完成一个个功能模块,使学生学习开发更有目的性,最后提高学生的学习积极性和能动性。

2.3分段考核,综合评价

除了课程最后结业的笔试考试之外,注重平时学习的过程考核,将项目开发过程划分为几个阶段,分阶段考核每个学生,例如首先系统的需求分析,前台页面的设计,各个功能模块的设计,后台数据库的设计,Web服务器的搭建等等每个项目模块的开发过程,每个阶段都要有实际工作和文档说明,并且要提问答辩,同时注重对学生学习过程中态度和结果的综合评价,给每个同学进行分阶段打分,最后综合每个阶段的分数得到过程考核分数,具体量化每个学生的学习情况,有效反映了学生的学习情况和综合素质。

3 教学效果对比

通过对比教技11级1,2班和3,4班的期末考试成绩和整体能力,可以看出,采用了改进教学手段的教技11级1,2班的成绩水平相比未改进教学手段的教技11级3,4班要高,当然,其中不排除个体差异的情况,但综合多数班级的教学情况,教学效果变好了。

4 结束语

ASP程序设计与WEB信息安全 篇3

关键词：ASP 程序设计 WEB 信息安全

中图分类号：TP311.1文献标识码：A

文章编号：1673-8454（2007）11-0070-02

WWW应用服务，是目前因特网应用最为广泛的服务，随着网络对人们生活方式的不断影响和改变，人们越来越依赖于这种服务。然而WEB信息安全现状却不容乐观。WEB信息安全威胁可来自计算机病毒、操作系统、以及数据库系统等潜在的安全漏洞，还可来自于WEB程序代码编写的不完善。本文从ASP程序设计角度对WEB信息安全及防范进行分析讨论。

一、ASP程序设计与脚本信息泄漏隐患

（1） .bak文件

有些程序员习惯将程序代码的备份文件存储为.bak文件，而.bak文件的内容可以通过浏览器进行查看，这就埋下了源代码泄漏的隐患，将可能导致敏感信息如数据库名、表名、用户名、密码、文件目录等信息的泄漏。

（2） .inc文件

有些程序员喜欢把常用的代码或配置信息写在一个.inc文件中，如conn.inc、global.inc、shared.inc等等。.inc、 .bak文件和其它文本一样，当在浏览器中浏览时，会毫无保留地显示其内容。攻击者可借助搜索引擎快速地查找到存在脚本泄漏隐患的网站及其中包含敏感数据信息的文件。如果利用搜索引擎搜索“conn.inc”，则会暴露出许多网站存在脚本信息泄露隐患。因此重要信息，如数据库连接或配置信息不能以inc为后缀命名，应以 .asp 命名；也可将数据库连接保存在Application中，直接引用，但这种方式对系统资源有消耗。

二、ASP程序设计与验证不全漏洞

程序设计时，通常在浏览敏感信息之前需进行用户验证，验证通过后，用户就获得了敏感信息的访问权。但是如果用户跨过验证入口后，对于敏感区域内部的其它网页就不再进行验证，那么这个验证就形同虚设，不法用户会利用这个漏洞，绕过验证页，直接通过链接地址浏览网页，造成敏感信息泄露。因此，在程序设计时必须确认每一个访问请求是经合法用户发出，敏感区的每一个网页都需验证后才能浏览。可以使用session变量解决验证不全漏洞。

例如：将用户名、密码定义为session变量：

如果经验证该用户是合法用户，就定义Session变量：

session("UserName ")=UserName

session("PassWord")=PassWord

敏感区的每一个文件都需验证上述这两个session变量，如果session("UserName ")和session("PassWord")不为空，则是合法用户；反之，则应跳转到登录页面进行登录验证，这样就给敏感区的每一个页面加上了安全保护。

三、ASP程序设计与SQL 注入漏洞

在B/S应用开发模式下，程序代码如果对用户输入数据的合法性不进行检测或检测不严，就会使应用程序存在安全隐患。攻击者可以通过浏览器的输入区域，利用某些特殊构造的SQL语句插入SQL的特殊字符和指令，从而收集程序及服务器的信息，获取想得到的资料，甚至获取网站管理员的帐号和密码，这就是SQL注入（SQL Injection）。SQL注入通过正常的WWW端口对页面请求访问，和正常的WEB页面访问没什么区别，因此，SQL注入能够避免大多数防火墙的防御，绕过系统的安全防护。因此防御SQL漏洞攻击依赖于完善的程序代码。

SQL注入的手法比较灵活，既可以在浏览器的地址栏进行，也可以通过表单输入框进行，如利用用户名、密码输入框；文本输入框、下拉菜单等进行SQL注入攻击。如果程序代码对用户输入信息检测不严格，就可能导致服务器执行恶意指令威胁信息安全。

在B/S系统编程过程中，经常需依据用户的输入信息执行查询操作，下面是一个利用用户名、密码输入框进行注入攻击的例子。如：

sql="select * from 表名 where username=′"&user&" ′and password=′"&pass&"′ "

如果用户在用户名、密码框中同时输入：

a′ or′1′=′1或者′ or′′=′

那么拼装后的Sql 语句为：

sql="select * from 表名 where username=′a′ or ′1′=′1′and password=′a′ or ′1′=′1′"

或

sql="select * from 表名 where username=′′or′′=′′and password=′′ or ′′=′′ "

这样的查询可能会带来灾难性的结果，即整个数据表的信息被全部检索出来，造成严重的信息泄露。

问题的解决依赖于程序代码的完善，可以从以下几方面来封堵漏洞。

·对客户端提交信息进行封装；

·在服务端正式处理之前对用户提交信息进行合法性检查，对于一些特殊或敏感字符及字符串进行转换或过滤处理，常见的敏感字符包括：“′” 、“"”、“;”、“:”、“>”、“<”、“&”、“+”、“-”、“%”、“*”等等；常见的敏感字符串包括：“exec”、“insert”、“select”、“delete”、“”update、“count”、“truncate”等等；

·屏蔽出错信息，使用出错处理函数，显示友好的错误界面，防止攻击者根据错误提示寻找漏洞进行攻击；

·敏感信息，如用户密码等应加密存储在数据表中；

·WEB页中下拉菜单的值要定义好，以防被注入攻击。

四、ASP程序设计与缓冲区溢出漏洞

在WEB程序设计时除需防御攻击者利用某些特殊构造的SQL语句进行SQL注入攻击，还应对用户提交的输入变量根据需要规定适当的长度或数值限制，防止利用溢出漏洞进行攻击。不法用户往往通过往程序的缓冲区写入超出其长度的数据，造成缓冲区的溢出，破坏程序的堆栈，改变程序正常流程，使程序转而执行其它指令，以达到攻击的目的。

五、ASP程序设计与数据库访问权根

ASP程序调用SQL SERVER数据库时，应为每个被调用数据库设定一个面向应用的用户名和密码，并对用户权限进行合理设置，禁止使用sa用户，以防数据库被攻破后，入侵者得到当前数据库权限的同时获得整个数据库服务器的管理权限。对于ACCESS数据库，为保证数据库的安全，可将数据库名改为其它文件后缀名；不要将数据库文件保存在Data目录下，以防被非法下载和猜解。

本文仅从程序设计的角度对WEB信息安全做了分析，WEB信息安全还依赖于多方位措施来保障。对于服务器，安装防火墙并及时升级，及时更新操作系统的SP补丁程序；关掉不需要的网络服务，防止打开的服务端口成为黑客攻击的入口；对服务器及数据库系统用户权限进行合理设置；定期查看各服务程序的日志，以便及时发现入侵现象等。此外，还可利用专门工具检测程序设计存在的安全漏洞。

参考文献：

[1]陈明奇. CNCERT/CC2006年网络安全形势分析[J]. 信息网络安全，２００７（４）

[2]2006年全国信息网络安全状况与计算机病毒疫情调查分析报告[J]. 信息网络安全，2006（９）

WEB程序设计心得 篇4

iOS Web App开发心得

（四）1、关于jQuery

事实上，jQuery已经针对移动设备推出了jQuery Mobile（2012年8月27日注：jQuery和jQuery Mobile完全不是一个东西），但是我没有去下载，而是直接用了jQuery，并没有什么理由。从实际效果来看，也还算理想，mobile safari跑jQuery还算流畅，与桌面浏览器的差异并没有那么夸张。

但是，有一点不完美，就是触控的事件，不能使用jQuery的绑定方式（bind方法），而必须使用javascript的原生语法。猜测应该是jQuery对事件做了封装并做了兼容性处理，没有考虑到触控事件。（2012年8月27日注：完全可以用jQuery来绑定，只是在事件处理的时候取jQuery封闭事件中的originalEvent就可以了。）

2、viewport带来的问题

其实这一点在前面已经讲过，还是想再重复一下。

因为只有viewport的概念，导致了很多和桌面浏览器不一样的地方，比如没有滚动条，需要手工去处理很多事情。

同样因为viewport，元素的fixed定位方式失效。

另外由于viewport自身的操作需要很多触控动作，给交互也带来不小的麻烦，前

泽思网络 – 上海APP开发商文已经说过。

3、iOS自己的处事方式

iOS在一些地方有自己的特殊处理方式，需要注意。

比如不允许用户从浏览器中上传文件，这个特性就让应用的空间一下子少了好多。(2012年8月27日注：iOS6已经允许了。)

再比如对于选择框，并不是像桌面浏览器一样下拉，而是一个系统的模态窗口选择，完全是苹果自己的风格。

4、SVG支持不力

网上查到SVG的嵌入方式有三种，除了iframe外，其余两种均试过，很遗憾，不能生效。

5、背景缩放的bug

精致的Web设计交互设计 篇5

从几方面来看待这个问题：

1.过细的专业消磨掉“默契”。相信大部分有一定互联网经验的人都是做过前端开发工程师，在那个年代从设计到开发都是同一个人，所以完成的东西往往和预期的符合度比较高。因为在做前端开发的时候自己心里知道哪些地方应该加粗，哪些地方应该有间距，哪些地方应该让用户更突出地看到。但是现在大家分工越来越细，每个工种的能力也越来越专业化，所以导致了原来的那种“默契”也越来越消失掉。前端想要做的就是写出牛B的代码，最好是能够超越google产品的技术水平。但是往往越专业就越偏离真正做产品的目的。之前一次讨论中，一位前端同事说对他们来讲，代码的整齐比用户看到的页面整齐更加重要。我不反对代码整齐的确体现了前端的专业性，但是换句话讲代码整齐是前端的基础，对前端的要求是不管用户看到的页面有多复杂，有多绚丽，你们的代码还是依然要那么整齐，这才是最牛B的。

2.等待中的沟通。项目中为了能够保证质量，通常都会用产物传递的方式来帮助每个角色的沟通。我也一直“致力于”制定和update各式各样的规范，但是我发现，无论你的产物多详尽，总会在传递过程中消耗一部分，导致后端的角色无法完整真正理解你的初衷。幸好在传递的过程中增加了会议沟通的形式，但是一个会议让所有人能够理解并且提出建议是不大可能的。那除了产物传递和会议以外，我们还能做什么？我们需要的是主动沟通。工作中有句话，能够用IM的，绝不用邮件，能够用电话的，绝不用IM，能够当面沟通的，绝不用电话。这就是最好的沟通方式，当然经验告诉我们，每次沟通完之后，必须用邮件抄送所有人来做个沟通记录，以免大家事情太多最后忘掉。但是沟通又会引发一个问题，前端、视觉往往是等着交互和需求方去找他们沟通，也就是后置角色一直都是等着前置角色来找他们沟通，其实这个是错的。所谓的沟通是相互的，不要等！当后置角色发现问题时应该主动及时地找到对应的前置角色去把问题解决了，这样的方式一定可以把那些疑惑和不确定都弥补掉。

3.不够统一的产品思想。在每个专业角色的领域大家都在说往前走，意思就是不要停留在技术层面，要往前往远看，

从后台一直到产品规划，大家都有往前进的趋势。当然这和社会的现状有关，往往代码工程师会羡慕前面的设计师甚至是需求方，只要口头说说，他们就要做很多工作，谁都希望做上游。我不反对往前走，但是我希望大家能够摆清定位，所谓的往前走是希望每个角色的思想是统一的，不仅能够有出色的专业能力，而且能够站在更高的角度去看产品，并把自己的专业能力反应在产品上。现在大多数人都在嚷着说我们要往前走，要去挑战上游的专业能力，但是我想问问这些人，你们自己的专业能力够出色了么？如果连最基本的web可用性都没注意起来（例如鼠标手型表示可点击，元素间的对齐，大区域指示有助于用户找到目标等），你们怎么可能往前走，怎么可能把自己的专业能力应用地更出色。

4.没有规划的技术。所谓规划，大家都会想到产品前期的市场调研，其实每个角色都应该对自己的工作进行规划。我经常遇到问题是，当前端开发工程师完成的产物没有达到设计师的要求时，前端开发总会说这个什么dom结构、什么js本身都不支持等等，甚至有时候需要优化和升级的时候才发现，前端把代码写死了，根本不可能有优化，只能重写。面对这些问题时，应该两个解决办法，一个是在做之前主动找上游沟通整个产品的方向和目标，并把它落实在技术中，预留好接口和开放结构，从而使升级优化成为可能。另外一个是认真仔细读懂交付产物说明，看清每种状态和分支情况，当发现问题时应该在做之前向别人提出，从而大家可以一起来找到新的解决方案，不要等到完成时再说什么都做不了。

5.细节决定成败，要体现专业能力必须以细节为基础。一开始说的前端开发做的产品细节上的不完善，有个前端的同事说，要做他们感兴趣的东西，他们才能注意起这些问题。的确在前端的领域写js比写css更令人兴奋和有动力。那我只能觉得，产品不是儿戏，更不是因为你感兴趣而去做的。创新的东西人人喜欢，但并不是每个人都可以创新，你一味等着上游的角色给你令人激动的工作，那只能说明你本身并不适合这份工作，所谓的创新就是在专业领域做比别人更专业的事。另外，我不否认写css比js更枯燥，但是这并不意味着css就不重要，其实更多时候css比js重要很多，很多web2.0的网站用的就是css去引导用户，描述产品等。并不是交互和视觉一直关注这些布局和细节的问题，换句话讲，这个都是基础的东西，应该前端开发工程师本身的意识提高，才能让大家关注更多体验的问题。我也希望不要再这些基础的领域绕来绕去，好好做产品，做好自己的角色，做到完美！

最后我想说的是不要认为web设计就是粗糙低劣的，好的web设计更能够提现产品的品质感，我们要升级体验就必须把基础做好，把这些细节都处理好，我们才有可能有精力去做创新，去做体验。

WEB程序设计心得 篇6

1、实验项目名称： 监听和过滤

2、实验项目性质：验证性

3、实验要求：必修

4、计划学时数：2学时

5、实验内容：

(1).实现网上书店项目后台管理用户的过滤功能。具体要求如下：

 禁止用户非法访问，只有登录成功才能访问后台页面。

 没有登录，直接访问后台其他页面，将跳转到登录页面。

(2).在网上书店项目中增加监听功能，当用户登录成功时自动更新数据库中该用户的登录次数。

(3).实现网上书店项目后台图书管理中的修改图书信息功能模块。具体要求如下：  在图书管理页面bookManager.jsp中，单击“修改图书信息”按钮，对选定的图书进行修改。

 一次只能修改一本图书信息。

 修改页面中显示图书的原有数据。

 图书ISBN不可修改。

(4).实现网上书店项目后台用户管理中的修改用户信息功能模块。具体要求如下：  在用户管理页面userManager.jsp页面中，单击“修改用户信息”按钮，对选定的用户信息进行修改。

 一次只能修改一个用户信息。

 修改页面中显示该用户原有信息。

 用户名不可修改。

根据第七章所学内容以及上机实践情况，在实验报告中完成以下问题。

(1).编写一个过滤器，名称为ForceNoCacheFilter，通过使用此过滤器使浏览器不缓存任何页面。在实验报告中给出其中的关键代码。

(2).画图说明Servlet上下文监听器的工作流程。

6、项目需用仪器设备名称： 计算机

7、所需主要元器件及耗材：无

8、实验项目目的和任务：

(1).了解监听器原理及生命周期中的方法。

(2).掌握Servlet上下文监听。掌握HTTP会话监听。了解请求监听。

响应式Web设计探究 篇7

1 基于响应式Web系统的设计步骤

基于响应式Web的交互系统的设计基本流程主要分为以下几个步骤:第一步,确定需要兼容的设备类型、屏幕尺寸,注意横向尺寸和竖向尺寸,电脑宽屏;第二步,根据第一步的设备需求尺寸制作不同的线框原型,在设计过程中需要考虑不同尺寸的设备,页面的布局和内容如何进行缩放等调整变化;第三步,测试线框原型,将图片导入到相应的设备进行可访问性、可读性等测试,以便提前发现和解决问题;第四步,视觉设计,在设计时尽量保持小屏幕规格样式的简洁,另外在UI元素风格方面,在样式的实现上可以采用CSS3实现,尽量减少对背景图片的使用;第五步,前端构建,使用响应式前端开发框架,这样有利于实现开发过程的高效简化,同时确保开发的网站具有跨平台、兼容性、响应式等特点,另外前端开发人员需要和设计师多沟通,确保响应式设计的页面由于页面布局、内容尺寸发生了变化,最终的产品不会与设计稿出入较大。

2 响应式Web的基本原理

响应式Web设计理念是页面的设计与开发应根据设备环境以及用户行为(改变窗口大小等)进行相应响应和调整。具体的实现方式由多方面组成,包括弹性网络、布局、图片、CSS3、JS、Media Query以及HTML 5等的使用。采用响应式Web设计的页面能够根据用户使用PC、平板电脑、手机,自动兼容不同浏览器,适应不同分辨率、窗口及图片尺寸等,有效缩短网站开发周期,同时在一定程度上不必总为日益更新的移动终端做更新和维护,节约了开发成本。

3 响应式网页设计的关键技术

众所周知,移动设备屏幕尺寸大小不一,同时屏幕分辨率也各不相同,以及用户操作具有随意性,因此,要求页面要具有良好的适应性,能够兼容不同的终端设备,及时做出相应响应和调整。开发响应式页面的核心技术主要有三种:弹性布局、弹性图片、媒体查询。

3.1 弹性布局

弹性布局是进行响应式设计的基础。响应式Web设计采用弹性布局来满足不同设备的需求,即将固定尺寸设定为相对尺寸,使页面整体布局以及字号、图片等可以根据不同环境自动做出适应和调整,因而能使页面更富有弹性化,以适应不同移动设备的各种环境。弹性布局的主要方法是调整百分比和设置字号(em)比例。

第一种是方法调整百分比,在布局时尺寸是用%而不是像素来设置,使得弹性布局相对于浏览器窗口进行伸缩,可以实现高效使用空间。值得注意的是,在设计容器尺寸时,不要跨越整个浏览器窗口,而是让容器只跨越窗口总宽度的一个百分比,比如85%,这个尺寸会在一定的屏幕尺寸范围中产生比较好的效果,还可以考虑用百分比数设置填充和空白边,这样填充和空白边的宽度将随窗口尺寸而变化,防止列太快地变得过宽。例如,对于一个三列的弹性布局,可采取如下布局进行设计:

#warpper{width:85%;}

#main Nav{width:23%;float:left;}

#content{width:75%;float:right;}

该代码的功能是将窗口宽度设置为浏览器窗口宽度的85%,导航区域设置为23%,内容区域设置为75%。这样即使显示屏幕分辨率或尺寸发生变化,宽度始终和浏览器窗口保持这个比例关系,也不会出现横向滚动条,实现了页面响应宽度的变化。

第二种方法是设置字号比例(em),实现的方法和用百分比是一样的,这种方法就是某元素具体的宽高在当前基准字号下折算出多少个em。这样当其父窗口容器字号基准根据不同的分辨率变化时,该元素的宽高也能根据这个字号基准成比例缩放,就能实现响应式变化。

3.2 弹性图片

响应式Web设计的思路中,图片处理是一个很重要的因素。如果布局采用弹性设计,而图片的宽度固定,当布局伸缩时,图片会移动,甚至会超出包含它们的元素,从而破坏精心调整过的设计,一种较常用的解决方案是设置CSS的max-width属性。这种解决方案是,先不设置页面尺寸,添加完图像元素后设置其百分比宽度,然后设置max-width值与图像宽度一致,以避免像素失真,例如:

img{width:30%;max-width:300px;float:left;}

上面这行代码的意思是将图像的宽度设置为30%,然后将max-width设置为图像的尺寸300px。随着窗口元素的伸缩,图像也会随之伸缩,不会超出窗口,从而保持视觉上的平衡。

3.3 媒体查询

媒体查询(Media Queries)是响应式Web设计的关键。CSS3中的媒体查询指的是根据设备环境加载不同的CSS文件来渲染页面的视觉风格。Web前端开发只需要根据不同屏幕的分辨率等级来编写不同的布局样式代码,用户终端设备会根据自身的屏幕分辨率自动选择合适的页面布局。

CSS3在支持CSS2.1所支持的所有媒体类型的基础上,添加了包括max-width(最大宽度)、device-width(设备宽度)、orientation(屏幕定向,横屏或竖屏)和color等一些涉及媒体类型的功能属性,PC端、i Pad或Android等移动设备都支持这些属性。媒体查询可以通过link标签和@media规则来实现,下面介绍一下Media Query的使用方法:

方法一:

<link type="text/css"href="iphone.css"rel="stylesheet"media="screen and(max-width:480px)"/>

方法二:

@media screen and(min-device-width:640px)and(maxdevice-width:1024px){

body{background:#fff;}}

上面的代码是指当浏览器的最小宽度为640px,同时最大宽度设置为1 024px时,调用括号里面的样式。

响应式Web布局设计时,媒体查询顺序采用从移动端向上设计,优先建立移动设备用户体验,然后针对更大屏幕的显示器进行调整,以避免移动终端对媒体查询的支持不完善,也就是在样式表的开头定义基本样式,然后使用媒体查询从低分辨率到高分辨率来重写样式以覆盖前面定义的样式。

4 结语

基于Web的档案管理系统设计 篇8

基于Web的档案管理系统，使用Struts2应用框架将整体结构分为数据层、逻辑层和应用层3个层次。应用层主要使用JSP技术动态显示数据；逻辑层使用拦截器、过滤器等完成对业务逻辑以及操作流程的管理与控制；数据层使用MySQL作为后台数据库。该档案管理系统的初步应用，不但解决了以往纸质档案管理工作中呈现的突出问题，更提高了电子档案资源的利用率，发挥了档案管理信息化建设的积极作用。

系统设计原则

建立以电子档案为核心的档案管理系统，把档案资源的充分开发利用作为目标，切实推进档案管理工作的数字化、标准化、网络化。为档案管理部门、人事部门、政管部门等提供及时、准确、全面的数据支持，同时还可作为领导层进行决策管理的依据。因此，在开发该系统的主要业务模块时应遵循以下原则。

实用性：密切结合档案管理工作的实际需求，优化系统在收集、整理、分类、保存、利用档案的处理流程，提髙档案信息检索、查询的速度。对于流转过程繁琐的环节，应严格限定流转时间，有效利用资源。

先进性：在保证实用性的前提下，系统应釆用开发中的主流技术，保证其先进性。通过系统维护、升级，可以满足在档案管理信息化建设中逐步扩展的业务需求。

共享性：档案数据应尽可能实现共享，减少手工式的重复输入操作，对于已核实完毕，录入系统的数据信息，可进行多次分析处理，充分发挥数据共享的优势。

可靠性：系统应保证业务数据在网络传输或者数据库读取过程中的安全可靠。系统支持多级权限管理，并具有日志跟踪的设计。

灵活性：系统框架应具备一定的灵活性与可扩展性，以方便后期与音频档案、照片档案等数字化系统的集成。

友好性：系统的用户界面应该简单友好，操作流程具有良好的可学习性与可操作性，使具备一定电脑水平的管理人员，通过培训就能掌握该系统的使用要领，能够流程的操作系统的功能。

平台架构与技术思路

3.1 平台架构

系统基于Web技术方式，采用浏览器方式使得易用性更强，客户端不需安装专用软件，因此，系统的管理维护十分简单。

3.2 技术思路

电子档案管理系统的设计思路定位于为各级各类档案管理机构定制网络办公及管理软件， 基于SQL Server的数据库开发技术，采用目前流行而实用的浏览器/服务器（Browser/Server）模式，方便了电子文件的归档和电子档案的查阅，也使得远程档案查询不受地域限制。

B/S 模式的数据库体系是利用Web服务器和Active Server Pages（ASP，动态服务器网页）作为数据库操作的中间层，将客户机/服务器模式的数据库结构与Web技术密切结合， 从而形成具有三层Web结构的浏览器/服务器模式的数据库体系，其先进的操作方式显而易见。

3.3 特点表现

软件要集成查询系统、管理系统、文档浏览、新闻发布、搜索引擎和论坛等多种有实际价值的功能模块。

基于工作流的设计思路，会使得电子文件归档的流程步骤非常简单实用，档案管理系统能够灵活定制各类权限。

兼容多种文件（包括多媒体文件）格式。例如，兼容的文本文件格式主要有txt、doc、pdf、rtf；兼容的图片文件格式主要有jpg、bmp、jpeg、tif、gif；兼容的视频文件格式主要有mpeg、mpg、avi、rm；兼容的音频文件格式主要有mp3、wav等等。

系统应用结构

该系统基于B/S架构，使用Struts2应用框架将整体结构分为数据层、逻辑层和应用层3个层次。应用层主要使用JSP技术动态显示数据；逻辑层使用栏截器、过滤器等完成对业务逻辑以及操作流程的管理与控制；数据层使用MySQL作为后台数据库。系统在MyEclipse平台上进行开发，使用Java语言实现文件管理、档案信息、查询统计和系统管理4个主要业务模块的功能，并部署在Tomcat应用服务器上。3层结构的设计可有效提高系统功能模块的独立性与可扩展性，有利于系统整体性能的提升。

系统网络结构

该档案管理系统的核心Web应用服务器、应用服务器和数据库服务器统一位于服务器区内。单位局域网用户通过应用交换机和核心交换机可以直接访问该系统，而所有的外网访问（Internet访问）都必须经过防火墙的过滤拦截，从而保证系统外网访问的安全性。系统的网络拓扑结构如图1所示。

系统主要功能模块设计

以下主要对该档案管理系统中主要功能模块中的核心业务流程的设计进行详细的说明与分析。

6.1 文件管理模块

文件管理主要包括收文管理、发文管理、文件借阅、文件利用和文件归档。其中系统管理员可使用收文管理、发文管理、文件借阅功能；档案管理员可使用文件借阅、文件利用、文件归档功能；普通借阅用户可使用文件借阅功能。文件审核流程如表1所示。

6.2 档案管理模块

档案管理主要包括档案分类、档案鉴定、档案保管和档案利用，其中系统管理员可以使用档案鉴定、档案保管的全部功能，档案分类和档案利用中的部分功能；档案管理员可以使用全部功能。档案分类流程如表2所示。

6.3 用户管理模块

档案部门的管理者可以根据本单位的实际需要为不同用户设定工作权限。这种方案十分贴近档案馆的实际需求。高级用户可分为系统管理员和数据管理员， 普通用户注册后才可以使用。

同时，主要功能模块的定义是与用户权限紧密结合的， 不同权限的用户登录系统后， 将使用不同的模块， 每级用户各有其不同的权限。图2给出了总体功能模块划分。

总 结

基于Web 的档案管理系统是以后档案管理软件发展的趋势，档案管理部门和用户对电子档案的管理、快速查询尤其是远程查阅的需求将推动新技术的不断发展。随着Web技术的进一步发展和完善，基于Web 技术的档案管理软件必将更广泛地发挥作用，基于云及移动媒体终端的各项应用将是未来发展的主要方向。

Java Web开发课程设计 篇9

一、性质、目的和任务

本课程设计是在《Java Web开发》课程上设置的，是巩固学生所学理论知识、培养学生动手能力并使理论与实际相结合的重要实践环节。本课程设计的目的和任务，是使学生综合应用所学知识完成软件的分析、设计、调试和总结，提高学生对Java Web开发的综合应用能力和解决问题的能力。

二、参考设计内容与指标要求（允许选择其它内容，要求可参此）

1、参考题目：

新闻发布系统、网上书店系统、制造业（或零售业）客户关系管理系统、企业进销存管理系统、制造企业门户网站、班级网站、网上辅助教学系统

也可自己设计其它题目（难度要相当，且经过老师同意），完成系统的可行性研究、需求分析、总体设计、详细设计、编码、测试。

2、总体要求

①采用面向对象的方法对系统进行分析和设计，要求掌握建模工具的使用如Rational rose、visio，用powerDesigner进行数据库设计。

②系统设计要实用（模块设计、界面设计、数据库设计）

③编程简练，可用，功能全面，具有较好的健壮性

④在项目开发过程中，应该按要求编写好各种软件文档

可行性研究报告：说明该软件开发项目的实现在技术上、经济上和社会因素上的可行性，评述为了合理地达到开发目标可供选择的各种可能实施方案，说明并论证所选定实施方案的理由。

项目开发计划：为软件项目实施方案制订出具体计划，应该包括各部分工作的负责人员、开发的进度、开发经费的预算、所需的硬件及软件资源等。

软件需求说明书（软件规格说明书）：对所开发软件的功能、性能、用户界面及运行环境等作出详细的说明。

概要设计说明书：该说明书是概要设计阶段的工作成果，它应说明功能分配、模块划分、程序的总体结构、输入输出以及接口设计、运行设计、数据结构设计和出错处理设计等，为详细设计提供基础。

详细设计说明书：着重描述每一模块是怎样实现的，包括实现算法、逻辑流程等。用户操作手册：本手册详细描述软件的功能、性能和用户界面，使用户对如何使用该软件得到具体的了解,为操作人员提供该软件各种运行情况的有关知识，特别是操作方法的具体细节。

测试计划：为做好集成测试和验收测试，需为如何组织测试制订实施计划。计划应包括测试的内容、进度、条件、人员、测试用例的选取原则、测试结果允许的偏差范围等。

测试分析报告：测试工作完成以后，应提交测试计划执行情况的说明，对测试结果加以分析，并提出测试的结论意见。

开发进度月报：该月报系软件人员按月向管理部门提交的项目进展情况报告，报告应包括进度计划与实际执行情况的比较、阶段成果、遇到的问题和解决的办法以及下个月的打算等。

项目开发总结报告：软件项目开发完成以后，应与项目实施计划对照，总结实际执行的情况，如进度、成果、资源利用、成本和投入的人力，此外，还需对开发工作做出评价，总结出经验和教训。

软件维护手册：主要包括软件系统说明、程序模块说明、操作环境、支持软件的说明、维护过程的说明，便于软件的维护。

软件问题报告：指出软件问题的登记情况，如日期、发现人、状态、问题所属模块等，为软件修改提供准备文档。

软件修改报告：软件产品投入运行以后，发现了需对其进行修正、更改等问题，应将存在的问题、修改的考虑以及修改的影响作出详细的描述，提交审批。

三、计划与学时安排

1、教师介绍本课程设计的目的、内容、要求、方法和安排。

2、学生完成可行性研究、开发计划、需求分析。

3、教师审查，然后调整确定实施方案。

4、学生完成课程设计的系统设计、编码等环节，指导老师作必要的现场指导。

5、验收。

6、撰写总结报告。

7、答辩与考核

指导教师选择部分学生进行当面提问答辩，答辩既可以以语言表达的方式，也可以直接在机房中进行实际操作与调试。指导教师将综合每一学生的表现及能力进行综合评分。

四、考核评估

结合学生的动手能力，独立分析解决问题的能力和创新精神，总结报告和答辩水平以及学习态度综合考评。成绩分优、良、中、及格和不及格五等。

1、设计与报告 20%

2、软件编程能力 30%

3、综合解决问题能力 20%

4、创新能力 10%

5、学生答辩 10%

Web 个人网页设计实验报告 篇10

院系： 班级：学号：姓名：时间：

设计报告

网页设计要求题目：设计一个不限内容、题材的个人网站，要求页面数量不少于7个。具体要求

1.网页内容详实、科学、准确、积极、健康、活泼，网页文字及相关链接无错误。

2.网页文件及文件夹的命名符合要求，文件组织合理。1)首页源文件命名为：index.html。

2)文件夹image存放与网页相关的图片、动画文件等。3)说明文件Readme.txt内容包括：网页创意及制作的简单说明。3.网页设计整体设计思路清晰，网页布局合理，风格明快、主题页和其他子页之间协调，主题分明、重点突出。栏目及版面设计，层次结构及链接结构明确，内容布局合理，图画运用得当，效果生动。

4.网页上各主题和附加图片、背景的色彩选配方案要注意做到：色彩柔和、搭配美观、朴素大方，不应过分夸张，使视觉疲劳。5.使用表格、框架、Css各布局一个页面。6.有自己创作的flash、JavaScript可加分。

7.文档提交：电子稿与报告（电子稿—网站、报告—网页创意及制作的简单说明）。

网页主题及内容

主题：在世界的各个角落，邂逅最美的你 内容：一些著名的外国旅游、度蜜月胜地，感受当地的风土人情，体验不一样的异域风情。网页创意

因为自己本身特别喜欢旅游，喜欢尝试不一样的生活环境，和每个少女一样，我也存在着一个和未来的另一半环游世界的梦，所以这次我的网页是以“在世界的各个角落，邂逅最美的你”为主题展开制作，在实现这个环游世界的梦以前，提前感受下各国的风土人情。网页制作的简单说明

通过主页index可链接到 “马尔代夫的蓝色心情（Maerdaifu.html）、法国的紫色浪漫风情（French.html）、在雅典，我愿意带你，走遍阳光洒过的地方（XILA.html）、行走在巴黎（BaLi.html）、巴塞罗那（Basailuona.html）、ReadMe（ReadMe.html），所有图片都经过”PS处理过。

1.首页（index.htm）：采用了CSS布局页面。

1）创建了style1.css文件在style文件中。

2）插入的Div标签有：date标签，menu标签，main标签，make

标签。

3）在代码中插入了背景音乐“

4）AP Div8插入了滚动歌词，AP Div13插入滚动图片。

5）在代码中插入了背景音乐

4）AP Div15插入了滚动歌词，AP Div12插入了滚动图片。

5）在代码中插入了背景音乐

4）在代码中插入了背景音乐

-I Hate Love.mp3” loop=“-1” />。5.行走在巴黎（BaLi.html）：

1）采用Ap层布局。

2）设置了AP Div1差

一个拥抱.mp3“ loop=”-1“>。6.巴塞罗那（Basailuona.html）：

1）采用spry选项卡式面板布局。

2）设置了AP Div1不

想去上班.mp3” loop=“-1” />。7.ReadMe（ReadMe.html）：

1）采用Ap层布局+表格布局。

2）设置了AP Div1-AP Div2两个层。

3）AP Div2 设置为滚动字幕，并插入了日期。

心得

WEB程序设计心得 篇11

摘要：本文通过对Bootstrap的简要介绍，让读者对Bootstrap有一个基本的了解。Bootstrap作为当前较为流行的前端开发框架，为WEB开发者开辟了新的方向，大大降低了开发成本，提高了工作效率。

关键词：Bootstrap WEB开发 设计

1 概述

WEB前端开发者每天都在重复着这样的工作，使用HTML、CSS和Javascript编写模板、样式和动态交互效果，这种重复劳动不仅单调而且乏味，Bootstrap的出现使WEB前端开发者终于摆脱了这种现状。

2 什么是Bootstrap？

Bootstrap是由著名的前端开发工程师Mark Otto和Jacob Thornton共同开发的一个WEB前端工具，2011年8月Twitter公司将其开源，目前已经成为Github上比较流行的开源项目。

Bootstrap提供了一个可扩展的库，库的文档结构良好且易于阅读，其他人可基于这个库构建或扩展自己的项目。如今它已经包含了几十个组件，支持响应与非响应式WEB设计，有较强的兼容性，可在多种设备上良好的运行。它能大幅提升WEB开发者的开发效率，降低开发成本。已经有越来越多的开发者使用Bootstrap进行WEB开发设计了。

3 Bootstrap的基本结构

因为Bootstrap免费开源，使用者可以在GitHub上获取最新的Bootstrap版本。Bootstrap提供了预编译和源码两种形式的压缩包，压缩包内的文件按照类别存放在不同的目录内，并且提供了压缩与未压缩两种版本。

3.1 预编译Bootstrap版本

预编译版本是最基本的Bootstrap组织形式，使用者可以在任意的web项目中直接使用。它包含压缩（bootstrap.min.*）与未压缩（bootstrap.*）两种CSS和JS文件。字体图标文件来自于Glyphicons。

3.2 Bootstrap 源码

Bootstrap源码包含了预先编译的CSS、JavaScript和图标字体文件，并且还有LESS、JavaScript和文档的源码。

4 Bootstrap的安装

应用Bootstrap文件可分为两步：

一是安装Bootstrap的基本样式，二是调用Bootstrap的JavaScript插件。

人们通常用”link”方法调用Bootstrap样式，其中基本样式是必须调用的，而响应式布局样式是在自己的项目需要实现响应式布局的效果时才调用的，且必须在基本样式之后调用，否则响应式布局功能无效。自定义样式用来覆盖Bootstrap中的一些默认设置，便于开发者定制。

项目需要实现响应式布局的效果时，除了调用必须的bootstrap-responsive.css样式和Bootstrap.js，还需要调用JQuery，因为所有的JavaScript插件都依赖于JQuery，因此它必须在Bootstrap.js之前调用。

5 Bootstrap的功能模块

Bootstrap的功能模块从大的方面可以分为CSS、组件、JavaScript插件、定制等四个部分。各部分的功能随着Bootstrap版本的更新在不断的扩展、加强和完善。下面来简单介绍一下Bootstrap中各部分的功能。

5.1 CSS部分

Bootstrap内置了一套优秀的栅格（Grids）系统，该系统是在960gs的基础上扩展而来的，使用该系统可以轻松地构建自己所需的布局效果。

在页面排版方面，Bootstrap已经为人们定制好了标题、主体文本、强调文本、引用文本、列表、代码、表格、表单、按钮、图片等风格样式，使用者要做的就是引用相应的类名即可。

5.2 组件部分

Bootstrap提供了无数可复用的组件，包括导航、下拉菜单、图标、弹出框、进度条、面版等多个功能。这些组件在相应的JQuery插件作用下均具有交互式功能。开发这使用这些组件可大幅提升项目的交互体验，增强项目的吸

引力。要使这些组件具备交互性也非常简单，只需三步即可：

第一步套用基本的组件HTML框架；

第二步调用相应的JQuery插件；

第三步给项目中对应元素启用对应功能。

5.3 JQuery插件部分

Bootstrap中的JQuery插件主要用来实现交互功能，它为Bootstrap的组件赋予“生命”。使用时可以一次性引入所有插件，也可以单个的引入到您的项目中。

Bootstrap为使用者提供了几十种插件，常见的如：过渡效果、下拉菜单、标签页、折叠、轮播等。

5.4 定制部分

为了满足更多用户的需求，Bootstrap提供了自己独特的定制服务，包括CSS样式定制、组件定制以及JQuery插件定制。用户可以自由选择自己需要的样式及功能，去除冗余部分，这样可以使得自己的项目更加精简，代码更加高效。

6 结束语

作为一套前端开发框架，Bootstrap无疑是其中的佼佼者。它的灵活性和可扩展性加速了WEB项目开发的进程，降低了项目开发的成本，已经有越来越多的开发者使用Bootstrap进行WEB开发设计了。

参考文献：

[1]Bootstrap中文网：http：//www.bootcss.com/.

[2]http：//www.w3cplus.com/css/twitter-bootstrap.html.

上一篇：小学教育典型案例分析下一篇：我眼中的秋天小升初话题作文