西安邮电大学web大作业报告.docx

1、西安邮电大学web大作业报告西 安 邮 电 大 学 （计算机学院）WEB开发技术大作业题 目： 个人博客 专业名称： 网络工程班 级： 1203 学生姓名： 学号（8位）： 指导教师： 朱辉提交时间：2014年12月19日网站主题的意义 本次web大作业制作个人博客站点，通过B/S架构，我们能很方便的把对客户端进行更新、管理等等操作，而且数据库采用开源的MYSQL数据库，成本低、跨平台性能好。而且在服务器配置好PHPMYADMIN后，便可以远程操作数据库，十分方便。本网站采用python作为后台语言，可移植性高。网站分析 一个人博客应该具有以下几个功能：1. 登录2. 注册3. 写文章4. 评

2、论文章5. 文章管理网站整体思路采取MVC的架构方式：首先，在前端网页中，CSS样式没什么好说的，应为风格采用了扁平化的方式，CSS样式比较简单。不过在数据交互的过程中，我采用了JS中的Jquery和AJAX,这样会让前端网页在动态中显得更加漂亮。 为了实现动态网页的设计，我采用了python的web框架，使用了jinja2技术来将前端网页模板化，将网页拆成许多个小块，在用的时候，再组成客户能看到的页面。由于python提供的web框架各有所长，所以我重新构造了一个web框架：jinja2来是页面模版化，django来实现socket通信和拦截，web.py来对URL映射。有了承上启下的web

3、框架之后，就得针对Web App进行api的设计，这里采用REST的方式来设计API，使用的数据格式是JSON，这样就能直接被JS获取，然后我就能把数据进行封装，来完成数据传输。接下来该设计的就是数据库的连接，底层模块设计的原则是，根据上层调用者设计简单易用的API接口，然后，实现模块内部代码。所以，设计一个db模块，来作为数据库连接的引擎，连接上数据库后，我能使用SQL语句对数据库进行操作，为了避免SQL注入攻击，把SQL中不用的字符作为占位符。完成底层数据库db模块后，就是设计orm模块的时候，因为使用SQL语句来操作数据库还是有些不方便，所以将SQL语句换为更为简单的API来给上层操作使

4、用。有了orm模块后，上层模块model就能将数据库需要的表表示出来了。不过，我要提前用SQL脚本初始化数据库，以便调试。设计和风格说明 我的设计风格以扁平化和简约为主，不多加太多的修饰，让人能一下子抓住重点。背景以白色为主色（不是纯白），这样子字的颜色选用黑色会显得比较显目，而且白色搭配蓝色我觉得也是一种类似于地中海风格的搭配，总之能让人觉得很是舒服。为了能让错误提示更加美观，我采用了Ajax技术，这样子，在输入不合法的时候就不会重新加载页面了。对于图标的选用，我也采取当下流行的扁平化的风格，这样的图标虽然简单，但是能传达的信息是非常巨大的。所需要编辑和支撑的工具软件由于我才用python来

5、作为后台语言，所以必须要用Python的支持以下是支持清单：1. Python2.x2. Mysql-connector-python（Python第三方库）3. Jinja2（Python第三方库）4. Mysql（提供数据库支持）5. 浏览器（推荐谷歌等浏览器）因为Python跨平台性好，所以我对系统要求不高，如果实在Linux系统上搭建服务器的话，最好有phpmyadmin来管理数据库我的编程软件分别为sublime 2和PyCharm前者我用来写前端网页，后者我用来Python代码，在本机测试的时候，使用自建服务器通过浏览器访问localhost:9000软件安装后的路径结果Pytho

6、n及第三方库：C:Python27Mysql：C:Program FilesMySQL数据库设计数据库ER图：数据库脚本：- schema.sqldrop database if exists qxx;create database qxx;use qxx;create table users ( id varchar(50) not null, email varchar(50) not null, password varchar(50) not null, admin bool not null, name varchar(50) not null, image varchar(500)

7、 not null, created_at real not null, unique key idx_email (email), key idx_created_at (created_at), primary key (id) engine=innodb default charset=utf8;create table blogs ( id varchar(50) not null, user_id varchar(50) not null, user_name varchar(50) not null, user_image varchar(500) not null, name v

8、archar(50) not null, summary varchar(200) not null, content mediumtext not null, created_at real not null, key idx_created_at (created_at), primary key (id) engine=innodb default charset=utf8;create table comments ( id varchar(50) not null, blog_id varchar(50) not null, user_id varchar(50) not null,

9、 user_name varchar(50) not null, user_image varchar(500) not null, content mediumtext not null, created_at real not null, key idx_created_at (created_at), primary key (id) engine=innodb default charset=utf8;网站主目录的结构说明 我建立了如下目录结构 Blog/ -根目录 | +- static/ -存放静态文件 | | | +-css/ -存放CSS样式文件 | | | +-fonts/

10、-存放字体文件 | | | +-js/ -存放js文件 | | +-templates/ -存放模版文件 | | +-transwarp/ -存放底层py文件网站首页设计网站的首页地址是ip:端口号/当访问这个地址是就会进入如图所示的页面了，这便是我的博客的首页了。这里展示的是每一篇博文的主题和摘要，图中有能看到的是三篇博文，主题分别是“学号是04122071”、“实验”、“Web大作业”，这是首页的主体部分。在首页的右边，可以看到两名同班同学博客的友情链接，通过友情链接可以访问“常宫小戎”、“刘漫玉”的个人博客。首页上部管理区，可以进入到博客的管理页面。基于页面的数据录入和操作页面说明 数据

11、录入： 我的站点数据录入有两张方式，一种是注册帐号，一种是发表博问和评论 首先是注册帐号，我的帐号是管理员，拥有的权限最高，当然，只能我有，所以在建立数据库的时候，就在数据库中直接写入了。游客（看我博客的人）过来，只能注册普通账户，不能发表博文，只能评论和查看博客。 例如： 这个页面就注册了帐号是：quxiangxuanqxx名字为：瞿祥轩可以查看数据库：可以看到此账户信息已经保存到数据库中了，可以发现，密码采用了MD5的加密，同样的，这个帐号也可以登录：帐号密码输入成功后，就进入首页，不过在下图中标注的位置，已经是注册时的名字了接下来是发表博文和评论：可以先看游客账户发布评论，首先点击继续阅

12、读，就能查看本博文的详细内容：输入内容后，点击发表评论，就可以了，然后查看数据库：内容已经在数据库中了，网页上也显示出来了。再看撰写博文，下图是页面：填入标题，摘要和内容就能发表了，在首页中，我提前写好了三篇博文，在页面已经展示出来了，而在数据库中，如下图，也是正确的：此上是数据录入的部分；对于操作页面，只有管理员可以查看：管理页面中，有三项，可以对评论、日志和用户进行管理，来试着删除一篇博文：如上图，页面上显示已经删除了，下图中，数据库也已经删除成功了：评论的模式和日志差不多，便不再赘述了。参考资料Python开发实战 人民邮电出版社/BePROUD股份有限公司著HTML教程 http:/w

13、ww.w3cschool.cc/html/html-tutorial.htmlCSS教程 http:/www.w3cschool.cc/css/css-tutorial.htmlJavaScript教程 http:/www.w3cschool.cc/js/js-tutorial.htmljQuery教程 http:/www.w3cschool.cc/jquery/jquery-tutorial.htmlAJAX 教程 http:/www.w3cschool.cc/ajax/ajax-intro.html配色教程 西安邮电大学 计算机学 院 WEB开发技术大作业 成绩鉴定表学生姓名瞿祥轩班级/学

14、号网工1203/04122071提交时间 2014年 12 月 19 日 成绩鉴定学习态度（20分）平时考勤（10分）学习纪律（10分）设计效果（40分）创新性（10分）功能完整性（10分）系统稳定性（10分）界面友好性（10分）报告鉴定（40分） 前期准备和调研，资料查阅与分析（10分）系统设计方案（10分）报告质量(主题、结构、观点、逻辑、资料、字数）（10分)认识总结（10分）评阅教师姓名朱辉职称讲师成绩评语该同学WEB开发技术大作业题目 瞿祥轩的个人博客，经过前期准备和调研，设计并实现了 管理员系统、后台内容发布、登录注册、评论等多项功能，功能完整，系统稳定，运行结果很好。其中的创新点：使用了jQuery、Ajax等技术，使用Python进行模块化网站构建。大作业主题明确，结构完整，观点明确，逻辑合理，资料完善，字数适中。对课程的认识为良好。 评阅教师签字 年 月 日