localStorage"巧妙"设置过期时间

最新推荐文章于 2021-03-31 10:58:34 发布

原创最新推荐文章于 2021-03-31 10:58:34 发布 · 160 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #java #python #html #redis

本文介绍了一种使用localStorage来控制用户请求频率的方法，防止用户高频率点击提交按钮导致的后台压力过大，通过设置请求间隔时间，有效阻止非正常点击行为。

有时候我们需要控制用户频繁向后台发送请求，比如用户高频率点击提交按钮：

可以现在前端使用localStorage控制下这个请求频率，拒绝非正常点击行为，缓解后台压力：

function push() {
    layui.use('layer', function () {
        var layer = layui.layer;
        var content = $("#blog_content").val();
        if (!logined()) {
            showLogin();
            return;
        } else if (!content.trim()) {
            layer.msg("内容不能为空~~~", {icon: 5});
            return;
        } else if(!get("blog",1000 * 60)) {
            layer.msg("发布太快了，休息下~~~", {icon: 5});
            return;
        }else {
            send(content);
            set("blog","push");
        }
    })

}

function set(key,value){
    var curTime = new Date().getTime();
    localStorage.setItem(key,JSON.stringify({data:value,time:curTime}));
}
function get(key,exp){
    var data = localStorage.getItem(key);
    if(!data){
        return false;
    }
    var dataObj = JSON.parse(data);
    if (new Date().getTime() - dataObj.time>exp) {
        return true;
    }else{
        return false;
    }
}