上学期老师要我们做web编程的课程设计，由于老师课上介绍的是用ASP制作动态网页。我考虑一下，虽然asp+access制作动态网页已经过时了，但是能运用那些知识写一个新闻上传系统也是一个不错的挑战。之前我还没学过asp，所以我就简单的看了一下相关的教程，花了一个星期的时间写了一下这个有后台管理系统支持的asp新闻上传系统。虽然很简单，但我的目的在于给web编程初学者一点启示。如有错误之处，敬请指正。下面就是该系统的论文。
一、 网站前期准备
在制作本网站之前，我们组员共同做了需求分析，通过网上搜集资料，我们了解到制作动态网页需要由以下几个步骤：
于是，我们开始了第一步，网站的需求分析。通过走访同学与组员商议，我们决定网站的基本组成部分如下：
1.主页和子页布局方面大部分由框架完成，而且主页LOGO部分，TOP部分，导航条等部分由主页生成模块应用到各个子页里。
2.主页：主要分布有导航条，模块如下：
物联网背景
物联网概念
基本原理
相关新闻
技术前沿
产品在线
3.主页还特别添加后台管理功能，可由管理员负责网站内容的动态更新。
4.网站的前端由css和JavaScript技术实现。
5. 网站主要由文本，图片，flash等元素构成。
二、 网页布局与前端页面编写
首页的布局如图：
由图可知，首页由以下几个部分组成：
1. 头部，主要是标志图片。
2. 菜单栏，分别是网站的3个模块的链接：相关新闻、技术前沿和产品在线。
3. 图片新闻。
4. 最新发表文章的列表（以文章发表的先后排列，没有全部列出）。
5. 3个主要模块的分类列表（以文章发表的先后排列，没有全部列出）。
6. 底部，主要是相关链接和后台管理模块的入口
技术介绍：
1.纵观整个网站系统，是由asp文件、css文件、JavaScript文件构成的，asp文件在前期是html文件。为了使样式与框架的分离，css和JavaScript技术在网页中由外部文件导入。代码分别如下：
<link href="css/css.css" rel="Stylesheet" type="text/css">
<script type="text/javascript" src="script/slide.js"></script>
前端页面主要由以下三个页面组成：
（1） index.html，网站首页
（2） list.html，文章列表页面
（3） article.html，文章内容页面
2.在网页布局方面，我摒弃了漏洞百出的表格布局方式，而采用了css+div的技术，主要布局的div代码如下：
1 <div class=”wrap-left”>
2 <div class=”wrap-right”>
3 <div class=”top”>
4 ……
5 </div>
6 <div class=”content”>
7 ……
8 </div>
9 <div class=”bottom”>
10 ……
11 </div>
12 </div>
13 </div>
wrap-left和wrap-right两个div是包揽整个网页内容的大“容器”，包两层的目的就是为了给网页添加阴影，使网页更加美观，一个添加左阴影，一个添加右阴影。阴影是由图片来体现的。样式代码如下：
1 .wrap-left
2 {
3 width:996px;
4 margin:0 auto;
5 background:url(../img/bodyBg.png) repeat-y left top;
6 }
7 .wrap-right
8 {
9 width:996px;
10 margin:0 auto;
11 background:url(../img/bodyBgR.png) repeat-y right top;
12 }
3.网页中前端技术的亮点就是图片新闻的滑动效果了。首先需要对图片框进行样式的设置。
三张图片设置成一样大，连成一个整体，被包在一个大的div中，这三张图片整体是以绝对定位的方式布局的。而大div设置为其中一张图片那么大，它的overflow属性设置为hidden，相当于只有那么一个和一张图片一样大小的区域是可见图片的，其他位置图片不可见。这样，只要用每次控制图片整体相对于大div的位置即可实现滑动的效果了。
动态效果用JavaScript实现，为了编写更加方便，我引入第三方插件——jQuery，可以非常方便地实现图片的动画。例如，将图片整体横向移动仅需如下一句代码实现：$('#bp-box').animate({left:-333},700)。代码中700是移动图片整体这过程所需的时间（700毫秒），-333是图片的目的地的left属性值。当然，使用jQuery技术必须在头文件中引入相应的第三方已写好的js文件：
<script type="text/javascript" src="script/jquery.js"></script>
三、 后端部分编写
将网站与数据库链接，通过后台管理系统进行网页内容的动态更新，则需要用到后端技术。目前网上较为流行的是ASP.NET技术、php技术与jsp技术。Asp技术发展已较为成熟，但是缺点很多，目前正在被淘汰，但是还是有很多功能比较强大，在一定条件下，使用asp编写网页还是较为合适的。因此，在这里，我使用asp技术编写后端代码。
1. 建立数据库
在这里，我用微软出品的access作为数据库平台。建立一个叫iot.mdb的数据库文件，里面供有两个表：admin和news，admin用于存放管理员登录的用户名和密码，news用于存放每篇新闻相关的信息。字段分别如下：
2. 连接数据库。建立好数据库后，接下来的工作就是把自己前一个阶段写的静态网页的html文件改写成asp文件。为了操作数据库，首先得和数据库链接，代码如下：
1 on error resume next
2 dim oConn,sConnString,sDBPath
3 sDBPath="iot.mdb"
4 sConnString="driver={Microsoft Access Driver (*.mdb)};dbq="&server.MapPath(sDBPath)
5 set oConn=Server.CreateObject("ADODB.Connection")
6 oConn.Open sConnString
7 if err then
8 response.Write(err)
9 err.clear
10 response.Write("错误")
11 response.End
12 end if
13
14 ……
15
16 oConn.close
17 set oConn=nothing
代码中省略号处是，需要对数据库进行的相关操作的代码。任何数据库的操作都是在和数据库链接的前提下进行的。这里要注意，数据库一旦打开，必须在操作完毕后关闭连接，否则会对服务器造成负担。
3. 数据库的查询。首先连接数据库，编写一个查询数据库的sql语句，然后建立一个查询数据库的对象，代码是set rs=server.CreateObject("ADODB.RecordSet")，通过该对象，执行sql语句。然后通过这个对象可以获取查询到的结果的各字段的值。
如下代码是对新闻内容的查询：
1 sql="select * from [news] where type='"&typ&"' order by dat desc"
2 set rs=server.CreateObject("ADODB.RecordSet")
3 rs.open sql,oConn
4 num=0
5 if rs.eof and rs.bof then
6 response.Write("<li>无相关文章</li>")
7 else
8 if flag=0 then
9 do while num<5 and (not rs.eof)
10 response.Write("<li><a href='article.asp?id="&rs("ID")&"'>"&rs("title")&"</a><span class='Date'>"&rs("dat")&"</span></li>")
11 rs.movenext
12 num=num+1
13 loop
14 else
15 do while not rs.eof
16 response.Write("<li><a href='article.asp?id="&rs("ID")&"'>"&rs("title")&"</a><span class='Date'>"&rs("dat")&"</span></li>")
17 rs.movenext
18 num=num+1
19 loop
20 end if
21 end if
22 rs.close
23 set rs=nothing
4. 删除记录。删除记录是通过该sql语句实现的："delete from [news] where ID="&delid。例如，删除新闻仅需以下语句实现：
1 delsql="delete from [news] where ID="&delid
2 oConn.Execute delsql
5. 添加记录。本站通过后台管理系统的表单添加新闻，首先首先需要获取表单的值，用sql语句查找所有记录，然后再用rs.addnew语句表示要添加，然后给每一字段赋予表单中的相应的值，最后用rs.update表示更新。代码如下：
1 set rs=server.CreateObject("ADODB.RecordSet")
2 sql="select * from [news]"
3 rs.open sql,oConn,2,3
4 rs.addnew
5 rs("title")=title
6 rs("type")=typ
7 rs("author")=session("useronline")
8 rs("content")=ShowBrandBlank(content)
9 rs("dat")=date()
10 rs("time")=time()
11 rs.update
12 rs.close
13 set rs=nothing
6. 更改记录。更改记录的方法和添加记录的方法类似。本站通过后台管理系统修改新闻记录的相关信息，首先需要获取表单的值，用sql语句查找相应的一条记录，然后再给需要的字段赋予表单中的新值，代码如下：
1 set rs=server.CreateObject("ADODB.RecordSet")
2 sql="select * from [news]"
3 rs.open sql,oConn,2,3
4 rs.addnew
5 rs("title")=title
6 rs("type")=typ
7 rs("author")=session("useronline")
8 rs("content")=ShowBrandBlank(content)
9 rs("dat")=date()
10 rs("time")=time()
11 rs.update
12 rs.close
13 set rs=nothing
7. 后台管理。管理网站需要安全保障，也就是说中有正确用户名和密码的人才可以登录进行管理。在这里，由后台登陆页面获取用户的用户名和密码。当用户提交后，后台程序通过获取表单中的用户名和密码的值查询数据库admin表中结果，sql语句为"select * from [admin] where username='"&user&"' and pwd='"&pwd&"'"。仅有通过执行该语句查到的结果数非0时（也就是说相应的用户名和密码的配对存在），才可允许登录。若登录成功，则设置session("useronline")。为了确保进一步的安全，仅有session("useronline")被赋值的情况下，数据库操作才可以被执行。
8. 前台页面的呈现。首页上可以很明显的看到，每篇新闻被按分类列了出来，这是通过执行该查询语句的结果：sql="select * from [news] where type='"&typ&"' order by dat desc"，也就是说，按照文章类型来查询的。
当需要查找每个分类的所有文章时，可点击相应的分类进入list.asp页面，该页面可以传递一个参数type，如list.asp?type=news。通过参数给程序执行按照文章类型查找记录的sql语句。
当点击每一篇文章的链接时，进入文章内容页面，即article.asp，同样该页面也有一个参数，是id，则是通过执行该sql语句实现："select * from [news] where ID="&id。而该id市包含在文章列表页面上每一个结果的链接url中的，这id早在文章列表查询数据库时就被赋予在每个结果的url中了。
四、 调试运营
网站写好了，接下来的工作就是给网站添加内容了，最主要是通过后台管理系统，在这里，我给自己添加一个管理员的号码，用户名是admin，密码是admin。通过后台登录页面进入管理系统。然后通过网上查找与自己的知识储备给网站添加文章。当然如果要使一个网站经久不衰，必须有个管理员定期进行文章的添加与更新。
五、 总结
制作一个网站需要付出大量的经历。首先用户需求分析很重要，这是网站存在的灵魂，离开用户体验，网站将会毫无意义。在网页前端和后端代码的编写时，需要有强大的知识储备和长期编写代码的经验，这样才能保证网页的高质量与高安全性。另外，网站的编写离不开组员的相互合作。由于组员经验不足，该网站问题也很多。
存在的问题：
- 没有实现记录的分页显示技术，一旦记录很多，将会把网页的纵向高度加到很大，从而影响阅读。
- 安全性有待提高。密码没有进行编码，没有引入验证码技术。
- 编辑和添加新闻时，未实现“富文本”编辑技术，这样使得文章内容呈现时，样式单一。
六、 参考文献
1. 柯华坤, 王太平, 管西京。ASP网络编程学习笔记。北京:电子工业出版社,2008
2. 韩国峰。ASP第一步。北京:清华大学出版社,2008