数据展示网站

需求:

1、用户可注册登录网站,非注册用户不可登录查看数据
2、用户注册、登录、查询等操作记入数据库中的日志
3、爬虫数据查询结果列表支持分页和排序
4、用Echarts或者D3实现3个以上的数据分析图表展示在网站中
5、实现一个管理端界面,可以查看(查看用户的操作记录)和管理(停用启用)注册用户。

网站展示:

捕获1.PNG
捕获2.PNG
捕获3.PNG
捕获4.PNG
捕获5.PNG

一、注册登陆界面实现

网站界面展示:

点击登陆或者注册按钮可以滑窗切换注册或者登陆界面。


image.png

image.png
html处注册代码.png

html处register代码实现:首先判断两次密码输入是否一致,如果不一致则直接返回错误;如果一致,则向users/register处传输数据(username和password),如果成功则跳转至login界面。

后端注册代码

后端users.js注册代码:
调用在userDAO中定义的getByUsername检查数据库中是否存在该用户名,如果存在则返回用户已存在,否则返回注册成功消息。

html处login代码

后端登陆代码

后端登陆代码实现:
检查数据库中用户是否存在并检查密码是否正确。特殊情况,admin为管理员的用户名,为其设置了专门的管理界面,用来停用启用用户以及查看用户的操作记录。特别的,为了实现管理员停用启用用户的功能,在数据库中为每个用户多维护了一个state(用int表示),0表示被停用,1表示启用,注册时初始为1,在被停用时将其置为0,此时该用户不能登陆,直到管理员将其启用。

数据库中user表界面:

user表

二、用户操作记入

后端代码

利用sql语句将传入的参数值写入user_action表中。

user_action表展示

user_action表

三、爬虫数据查询结果列表分页展示与排序

查询代码

查询代码

查询代码:根据用户输入的标题或者内容关键词形成查询url并get,定义函数search将上述的查询词嵌入sql语句中,到数据库的fetches表中进行查询。

分页代码

分页代码

将search返回的结果进行划分,定义pagesize为每页的数据展示量,利用结果//pagesize得到分页数量,并将结果在查询界面动态显示;在用户选择页面时,判断page是否违规,并根据用户的选择改变展示的内容,是通过对search检索的结果进行切分实现,而非基于url实现的分页,所以无需更改url的path。

排序代码

定义两个排序状态,1为按时间升序排序,2为按时间逆序排序


排序代码

是通过对sql语句的修改实现的不同的查询结果,相等于重新对数据库的表进行查询,1为asc,2为desc,表示按时间的升序或者降序,在通过initpagesort完成在界面的不同结果展示。

四、用Echarts实现4个数据分析图表

图片都在一开始的网站展示上。

1.柱状图:

柱状图

利用sql语句从数据库中按照发布时间统计数量并返回结果

image.png

对返回的数据逐条利用正则表达式提取时间,并将时间作为x轴,数量作为y轴绘制柱形图。

2.饼状图

sql查询语句:var fetchSql = "select author as x,count(author) as y from fetches where author like'%责任编辑%' group by author;"
查看数据库中新闻的作者,都以责任编辑开头,担心前面有空格填充,故在前后都写了%通配符,并利用正则表达式提取作者的名字,按照其发表的文章的数量绘制饼状图。

3.线型图

sql查询语句:var fetchSql = "select content,publish_date from fetches where content like'%" + keyword + "%' order by publish_date;";

'''
var moment = require('moment');
moment().format();

var freqchange = function(vals, keyword) {
var regex_k = eval('/'+keyword+'/g');
var word_freq = {};

vals.forEach(function (data){
    var content = data["content"].replace(regex_c,'');
    var publish_date=moment(data['publish_date'], 'ddd, MMM DD YYYY HH:mm:ss ZZ').format('MM-DD');
    console.log(publish_date);

    var freq = content.match(regex_k).length;// 直接搜这个词。或者是先分词再统计词频(可自己尝试)
    word_freq[publish_date] = (word_freq[publish_date] + freq ) || 0;
});
return word_freq;

};
'''
因为我爬取的网站的publish_date格式比较特殊,使用通常的正则表达式无法正确的提取月和日(会出现null),所以引入了moment,将其转化成moment再进行提取。

4.词云图

对新闻内容进行jieba分词,按照自己指定的图片制作出对应形状的词云图。

5.实现管理员功能,启用、停用用户,并查看用户的操作

界面展示

数据库提前预设了一个管理员,用户名、密码均为admin。我的设想是管理员与普通用户不同,其不会进行新闻查询,而是只进行网站的管理与监管问题,所以为其设计了这个简洁的网站界面,在输入框中输入用户名称即可将其停用或者启用,点击查询按钮即可查看所有用户按时间顺序的操作记录。


image.png

image.png

这是管理员特有功能的后端代码实现,直接通过sql语句进行查询以及用户状态的更改。前面描述了数据库中为用户额外设置了一个状态变量,0表示停用,此时用户不能正常登陆,1表示正常状态。

总结:这是web编程的期末项目,网站的实现功能复杂且完善,需要很精巧的架构,但是助教提供的代码功能非常完善,框架搭的很完美,没有什么改进的空间,就根据自己爬取的新闻特殊性修改了一些正则表达式以及代码中的一些小的问题。将重点落在了设计前端界面上,将其与后端代码相连接,最后的结果差强人意。通过本次实验,学习了设计网站的框架的使用,复习了平时上课所学习的知识,有了更深入的理解。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 218,451评论 6 506
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,172评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 164,782评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,709评论 1 294
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,733评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,578评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,320评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,241评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,686评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,878评论 3 336
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,992评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,715评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,336评论 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,912评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,040评论 1 270
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,173评论 3 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,947评论 2 355

推荐阅读更多精彩内容