技术设计与应用NET第十一章V2.ppt

1 1 1 电子政务平台技术设计与应用 ASP NET高级应用Version2 南大滨海学院法政学系张一鸣2016年2月12日 电子政务平台技术设计与应用 南大滨海学院法政学系张一鸣 2 2 2 ASP NET高级应用第11章在线投票系统 南大滨海学院法政学系张一鸣2016年2月12日 电子政务平台技术设计与应用 3 3 本章主要内容 任务说明技术要点开发过程数据库设计配置Web config公共类编写前后台模块设计说明 4 4 11 1在线投票系统说明 在线投票是当下网站应用程序中使用非常频繁的功能之一 在很多热门网站上 经常会见到各种各样的网上调查在线投票系统 如一些购物网站会根据用户的投票结果评选出用户最喜欢的商品 最信任的商家等 本章通过实例介绍设计开发在线投票系统的详细过程 为了使Internet上的在线投票网站制作得更精致 通常情况下 应该能由管理员根据需要随时定义和管理投票项目 在显示投票结果时将采用百分比形式 如果网站的调查结果以饼状图的方式和表格的形式显示 则会使网站更具直观性 显示效果更生动 在线投票系统说明 一 为了保证投票的公平 公开 公正 本例还限制每个用户的投票次数 即每个用户只能对系统中的一个主题进行一次投票 本实例实现的具体功能如下 管理员后台添加投票项目 管理员后台管理投票项目 访客对项目进行投票 查看投票结果 在线投票系统说明 二 在线投票系统的运行界面 8 11 2技术要点 实现投票系统涉及到如下几个关键技术 1 防止用户重复投票2 以图形方式显示投票结果 9 11 2 1防止用户重复投票 在线投票系统中最重要的一个功能就是禁止用户对某一投票主题进行重复投票 即一个用户只能对一个主题投票一次 投票后将不能继续投票 实现这一功能通常有两种方法 一是以用户投票时 系IP地址作为唯一性保证 另一种方法是使用Cookie对象确认用户的行为 10 1 利用IP地址检查唯一性 本方法是当用户进行投票时 系统首先获取该用户的本地IP地址 然后将它与后台管理数据库中存在的IP地址比较 如果检索出有相同的IP地址 说明该用户已经投过票 就给用户弹出错误信息通知本次投票无效 如果没有找到相同的IP地址 则会完成用户投票 执行票数增加的操作 并将该用户的本地IP地址存入数据库 这种方法比较复杂 11 2 使用Cookie对象确认 本方法是使用Cookie对象确认用户的行为 由于系统中存在多个投票主题 使用每个主题的ID作为Cookie的值 在用户投票时 则先判断其Cookie值 为null则该用户没有使用本系统 就对新创建的Cookie对象添加新值 否则若有该ID表示已对该主题投过票 则给出错误提示并且不执行本次投票操作 本例中采用的是此方法 比较简单 12 使用Cookie对象的实现代码 由于系统中存在多个投票主题 使用每个主题的ID作为Cookie的值 例如用户为ID 1的投票主题投票时 则该用户的Cookie中就会多一个新项 VoteItem 1 实现此功能的代码为 HttpCookiemakecookie newHttpCookie Vote M Str voteID 制造cookieHttpCookiereadcookie Request Cookies Vote M Str voteID 读出cookie 13 在用户投票时 则先判断其Cookie值 首先读出其Cookie的值 为null则该用户没有使用本系统 就对新创建的Cookie对象添加新值 并设置过期时间 否则已经用过的话 再判断是否对该主题投过票 若有该ID表示则表示已有过票 则给出错误提示并且不执行本次投票操作 否则设置Cookie对象的值 实现这部分功能的代码如下 使用Cookie对象的实现代码 续1 14 使用Cookie对象的实现代码 续2 15 11 2 2图像方式显示投票结果 以图形方式显示投票结果更加直观 形象 是投票系统人性化的表现 本实例以数据库中检索出的数据为依据 以饼状图形显示投票结果 在绘制图形时 按投票的选项将饼形图划分成相应的几部分 通过投票选项的票数计算出相应选项在饼形图中所分配的角度数据 然后利用Graphics类中的FillPie方法完成图形绘制 FillPie方法的语法格式如下 16 FillPie Brushbrush floatx floaty floatwidth floatheight floatstartAngle floatsweepAngle 此方法填充由椭圆的一段弧线和与该弧线端点相交的两条射线定义的扇形区域的内部 该椭圆由其外切矩形的边框定义 扇形区由StartAngle和sweepAngle参数定义的两条射线以及这两条射线与椭圆焦点之间的弧线组成 如果sweepAngle参数大于360 或小于 360 则将其分别视为360 和 360 图像方式显示投票结果的代码 17 brush 确定填充特性的画刷Brushx 边框左上角的x坐标 该边框定义扇形区所围的椭圆y 边框左上角的y坐标 该边框定义扇形区所围的椭圆width 边框的宽度 该边框定义扇形区所围的椭圆Height 边框的高度 该边框定义扇形区所围的椭圆StartAngle 从x轴沿顺时针方向旋转到扇形区第一个边所测得的角度 以度为单位 sweepAngle 从StartAngle参数沿顺时针方向旋转到扇形区第二个边所测得的角度 以度为单位 FillPie方法中的各参数说明 18 绘制完成后 利用Bitmap类的Save方法将图形输出到页面中 Save方法的语法格式如下 publicvoidSave Streamstream ImageFormatformat 其中参数的说明 stream 用于保存图像数据的Stream类的对象 format 指定保存的图像的数据格式 图形图像的输出方法 注意 绘图过程中要引用命名空间System Drawing和System IO 19 显示投票结果的饼形图 显示投票结果的饼形图是由ResultImage aspx页面生成的 在该页面的加载事件中接受页面间传值 并调用生成饼图的方法 代码如下 protectedvoidPage Load objectsender EventArgse stringP Str voteID Request voteID stringP Str title Server UrlDecode Request title img P Str voteID P Str title 该方法中有两个string类型的参数P Str voteID和P Str title 分别表示投票主题的ID和名称 页面间传值 20 生成饼图的代码 21 生成饼图的代码 续1 22 生成饼图的代码 续2 23 生成饼图的代码 续3 24 生成随机数方法的代码 本方法用于生成一个小雨255的非负随机数 利用这个随机数来生成Brush对象的填充色 25 11 3开发过程 11 3 1数据库设计本实例采用SQLServer2008数据库系统 在该系统中新建一个数据库并将其命名为db Vote 创建投票项信息表 tb Vote 用于保存投票项的基本信息 26 投票项信息表 tb Vote 的结构 27 投票选项信息表 tb VoteItem 28 11 3 2配置Web config 由于Web config文件对于访问站点的用户来说是不可见的 也是不可访问的 所以为了系统数据的安全和易操作 可以在配置文件 Web config 中配置一些参数 本例将在Web config文件中配置数据库连接字符串 代码如下 29 配置Web config的有关代码 30 11 3 3公共类编写 在项目开发中良好的类设计能够使系统结构更加清晰 并且可以加强代码的重用性和易维护性 在本例中也建立了一个公共类DB cs 用来执行被多次调用的各种数据库操作及公共方法 公共类DB cs中包含3个方法 分别为GetCon方法 sqlEx方法和reDs方法 31 1 GetCon方法的代码 GetCon方法主要用来连接数据库 使用ConfigurationManager对象的AppSetting属性值获取系统配置文件中配置节中连接数据库的字符串实例化SqlConnection对象 代码如下 32 GetCon方法的代码 33 2 sqlEx方法 sqlEx方法主要使用SqlCommand对象执行数据库操作 如添加 修改 删除等 它包括一个string型参数 用来接收具体执行的SQL语句 执行该方法后 成功返回1 失败返回0 代码如下 34 sqlEx方法的代码 35 3 reDs方法 reDs方法主要使用SqlDataAdapter对象的Fill方法填充DataSet数据集 它包括一个string字符型的参数 用来接收具体查询的SQL语句 执行该方法后 将返回保存查询结果的DataSet数据集对象 代码如下 36 reDs方法的代码 37 11 3 4模块设计说明 1 系统主页实现过程2 添加投票项页面实现过程3 查看所有投票页面的实现过程4 投票页面的实现过程5 投票结果页面的实现过程6 投票管理页面的实现过程 38 1 系统主页面的实现 系统主页面 Default aspx 实现了系统导航功能 是整个网站应用程序的起始页 该页运行界面如下 39 主页跳转到其他页面功能的代码 40 2 添加投票项页面实现过程 当用户进入添加投票项页面时 主要实现添加投票主题以及添加或删除投票选项的功能 初始时只显示添加投票主题 当用户添加投票标题后 才显示投票选项面板 用户此时可以添加或删除该投票主题的投票选项 本主题所有的投票选项被列表显示在ListBox控件中 若单击 按钮则结束投票选项的编辑 单击返回按钮则跳转到系统主页 添加投票项显示页面 42 添加投票项页面的代码 43 添加投票项页面的代码 续1 44 添加投票项页面的代码 续2 45 添加投票项页面的代码 续3 46 添加投票项页面的代码 续4 47 查看所有投票页面用于显示在线投票系统中所有投票的名称 主题 用户可通过单击投票名称进入对该标题投票项进行投票 转入超链接页面 显示所有投票项目用DataList控件实现 在该控件的ItemTemplate模板中添加一个HyperLink控件实现超链接进入该项的投票页面 投票页面用于用户对某一主题进行投票 用户选择任何一个图片选项名称后单击 我要投票 按钮 就可对该主题投票 投票后单击查看结果按钮显示投票结果页 3 查看所有投票页面的实现过程 查看所有投票页面 49 查看所有投票页面的代码 50 4 投票页面的实现 51 投票页面的实现代码 52 投票页面的实现代码 续1 53 投票页面的实现代码 续2 54 5 投票结果页面的实现 55 投票结果页面的代