html5点赞计数功能,点赞功能

本文介绍了如何在个人网站中实现无登录的点赞功能,通过结合用户ID、IP、浏览器信息、Cookie和HTML5缓存等五重验证来防止刷赞。详细阐述了前端JS逻辑、后端处理以及页面加载时的点赞状态判断,确保点赞功能的安全性和用户体验。
摘要由CSDN通过智能技术生成

今天琢磨着搞了个点赞功能,因为考虑到个人网站没有根基,所以如果必须要登录才可以点赞的话那绝大部分人肯定转头就走。

如果不登录就可以点赞的话,就要动脑筋去防止刷赞了,我也去看过一些别的网站搞的投票功能,纯粹是以IP来控制,水的不能再水。

表设计如下:

3c724d5a8d41953f869d95097a8155ea.png

用户ID  IP  浏览器信息  加上cookie  html5缓存  一共5重关卡  任何一关过不去  都点不了赞

流程从点赞的动作开始:

首先js写个变量isLike标志是否点过赞   初始化为否

点击赞图标后:

$('body').on("click",'#like',function(){

if(false === isLike){

var C=parseInt($("#likeCount").html()); //当前文章点赞数量

$(this).css("background-position","");

$(this).addClass("heartAnimation");//改变赞图标样式

$("#likeCount").html(C+1);//更新文章数量+1

$.ajax({

type: "POST",

dataT

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值