js处理文章详情页点击量统计
具体需求:在文章管理系统中,需要统计文章详情页面的点击量,来体现该文章是否受用户欢迎,方便管理员调整日后编辑新文章时的内容方向。
解决方案:设置有过期时间的cookie
我们在访问文章详情页面时,拿到该文章的id和该文章所属栏目的id,配合一些特殊符号,以组合成一个独一无二的专属该文章页的cookie名,避免影响其他文章页面的点击量统计。例如有一篇文章名为《水浒传内容简析》的文章,该文章id为7,隶属于《四大名著》栏目下,该文章栏目为2,我给出一段特殊字符串:"jia"。则该文章的cookie名为字符串:2jia7。
当前网页点击量的计算,并没有一个明确的计算方式。同一ip访问同一页面,停留时间超过多久,另算一个点击量。这个停留时间即是cookie的过期时间,按自身情况设置即可,我设置的时间为30分钟。
目前我采用了jquery.cookie.js来设置cookie,当然你要用JavaScript来设置cookie也是可以的。
代码:
前端页面增加一个隐藏的输入框,在body加载完成后触发增加点击量的js函数addclick():
<body onload="addclick()">
<input id="addclick" type="hidden" name="/article/article/addclick" value="{$articleInfo.id}" class="{$articleInfo.articlecloumnid}">
在这段代码中,我采用了thinkphp框架,隐藏的输入框中具体存储的内容:name中储存处理 增加点击量事件 的php文件路径,value中储存该文章id,class中储存该文章所属栏目id。
js代码:
//用户点击文章或是课程的详情页,点击量加1
function addclick(){
var id = $('#addclick').val();//拿到文章id,后台文件会根据此id,到数据库为此id的文章的点击量加1
var cookieName = $('#addclick').attr('class') + 'jia' + id;//组合独一无二的专属该文章的cookie名 var jsonString = {"id":id};
var url = $('#addclick').attr('name');//拿到后台处理 增加点击量事件 的php文件路径 if($.cookie(cookieName)==null){//如果没有这个cookie,则说明是第一次点击该页面,或者已经过去了30分钟,可以给点击量+1了
$.ajax({
type : "post",
url : url,
data : jsonString,
async : true,
success: function(msg){
var date = new Date();
date.setTime(date.getTime()+30*60*1000);//只能这么写,30表示30分钟
$.cookie(cookieName,cookieName,{expires: date});//创建一个过期时间为30分钟的cookie
//点击量成功加1,则打印信息
console.log(msg);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log("连接超时!");
}
});
}
};
后台逻辑我就不贴出来了,基本就是数据库连接,然后只要有ajax上传,就根据post过来的文章id,对文章点击量进行加1。
cookie示例图:
该cookie将会在30分钟后过期,30分钟后,同一ip再次访问此页面,该文章的点击数就会再次加1。
js处理文章详情页点击量统计的更多相关文章
- python 全栈开发,Day81(博客系统个人主页,文章详情页)
一.个人主页 随笔分类 需求:查询当前站点每一个分类的名称以及对应的文章数 完成这个需求,就可以展示左侧的分类 它需要利用分组查询,那么必须要会基于双下划线的查询. 基于双下划线的查询,简单来讲,就是 ...
- BBS之文章详情页搭建
博客评论相关 博客文章详情页搭建 {% extends 'base.html' %} {% block css %} <style> #div_digg { float: right; m ...
- phpcms文章点击量统计方法
phpcms用户广大,很好用,很傻瓜.设计思路也很好,对cms的常见功能都有设计,可以作为自己开发的参考. 最近看了下phpcms的源码关于文章点击量统计的这块,自己记录下. 默认文章点击量显示的位置 ...
- django博客项目8:文章详情页
首页展示的是所有文章的列表,当用户看到感兴趣的文章时,他点击文章的标题或者继续阅读的按钮,应该跳转到文章的详情页面来阅读文章的详细内容.现在让我们来开发博客的详情页面,有了前面的基础,开发流程都是一样 ...
- HelloDjango 第 08 篇:开发博客文章详情页
作者:HelloGitHub-追梦人物 文中涉及的示例代码,已同步更新到 HelloGitHub-Team 仓库 首页展示的是所有文章的列表,当用户看到感兴趣的文章时,他点击文章的标题或者继续阅读的按 ...
- thinkPHP中的文章详情页实现“上一篇下一篇”功能经验分享
前段时间在公司中接触到了用thinkPHP搭建的项目,其中涉及到了文章详情页上一篇下一篇翻页的功能实现效果. 因为刚接触这套框架和PHP,所以整理一下实现该功能的经验方法. 如果有不到位的地方,欢迎指 ...
- Django:文章详情页面评论功能需要登录后才能使用,登录后自动返回到文章详情页
背景: 文章详情页正在查看文章,想评论一下写的不错,但是需要先登录才能.页面长这个样子: 方案: 1.点击登录链接时,将该页面的URL传递到登录视图中 request.path获取的是当前页面的相对路 ...
- 安卓开发——WebView+Recyclerview文章详情页,解决高度问题
安卓开发--WebView+Recyclerview文章详情页,解决高度问题 最近在写一个APP时,需要显示文章详情页,准备使用WebView和RecyclerView实现上面文章,下面评论.出现了W ...
- BBS项目分布搭建三(个人站点时间归档补充,实现侧边栏跳转、无线级分类、实现文章详情页展示功能)
BBS项目分布搭建三(个人站点时间归档补充,) 1. 个人站点时间归档 """ settings.py设置最好更改以下: LANGUAGE_CODE = 'zh-hans ...
随机推荐
- 移动端调试神器vConsole
vConsole.js 其实就是重写console方法,实现了类似于微信小程序的移动端调试效果 在普通html文件里使用 <script src="https://cdn.bootcs ...
- iloc与loc的区别
pandas.DataFrame.iloc iloc基于位置进行索引,主要是整数位置,也可以用布尔数组 iloc的输入可以是:单个整数.整数列表或数组.整数切片.布尔数组 pandas.DataFr ...
- 2.2测试赛AC代码临时保存
//A #include<cstdio> #include<cstdlib> #include<algorithm> #include<cstring> ...
- 【数据结构】【C++】堆栈的实现与应用
堆栈(Stack) 参考浙大版<数据结构(第2版)> 堆栈可以认为是具有一定约束的线性表,插入和删除的操作都在栈顶的位置,先进入的元素将在后进入的元素之后取出,与生活中的桶类似,故又称为后 ...
- python:文件读写
#!/usr/bin/python# -*- coding:utf-8 -*- #!/usr/bin/python# -*- coding:utf-8 -*- file1 = open('a.txt' ...
- Tensorflow中multiply()函数与matmul()函数的用法区别
1.tf.multiply()函数:矩阵对应元素相乘 官网定义: multiply(x,y,name=None) 参数: x: 一个类型为:half, float32, float64, uint8, ...
- tp3.2框架关闭日志记录
在config.php中阿计入如下配置: 'LOG_RECORD' => false, // 默认不记录日志 'LOG_TYPE' => 'File', // 日志记录类型 默认为文件方式 ...
- NVMe over Fabrics 概况
NVMe over Fabrics 技术特征 跨网络传输NVMe命令需要特殊的考虑,而不仅仅是针对本地存储内存.例如,为了远距离传输NVMe协议,理想的底层网络或fabric技术将具有以下特性: 可靠 ...
- tensorflow-gpu安装
添加清华源(输入清华仓库镜像),可以提高下载速度: conda config --add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/ ...
- actiBPM插件的办法
1.下载actiBPM到本地 从IDEA官网下载actiBPM.jar包 IDEA官网:https://plugins.jetbrains.com/ 官网搜索actiBPM 2.从本地安装actiBP ...