如何使用Ajax在WordPress中实时更新文章浏览量

许都 11 1

创建处理Ajax请求的PHP函数

首先,你需要在你的WordPress主题的functions.php文件中添加一个用于处理浏览量更新的函数。这个函数将检查传递给它的文章ID,然后增加该文章的浏览量。

function update_post_views_count() {
    if( isset($_POST['post_id']) ) {
        $post_id = $_POST['post_id'];
        $count_key = 'post_views_count';
        $count = get_post_meta($post_id, $count_key, true);
        if($count==''){
            $count = 0;
            delete_post_meta($post_id, $count_key);
            add_post_meta($post_id, $count_key, '1');
        }else{
            $count++;
            update_post_meta($post_id, $count_key, $count);
        }
    }
    wp_die(); // 这是为了遵循WordPress的标准
}
add_action('wp_ajax_nopriv_update_post_views', 'update_post_views_count');
add_action('wp_ajax_update_post_views', 'update_post_views_count');

在主题中添加JavaScript代码

接下来,你需要在WordPress主题中添加JavaScript代码,这段代码会在文章页面加载时异步发送Ajax请求,用来更新浏览量。你可以将以下代码添加到主题的footer.php文件中,或者通过wp_enqueue_script方法加载一个外部JavaScript文件。

<script type="text/javascript">
jQuery(document).ready(function($) {
    var post_id = <?php echo get_the_ID(); ?>;
    $.ajax({
        type: "POST",
        url: "<?php echo admin_url('admin-ajax.php'); ?>",
        data: {
            action: "update_post_views",
            post_id: post_id
        },
        success: function(response){
            // 如果需要,这里可以添加一些成功更新后的逻辑
        }
    });
});
</script>

注意事项

  • 确保你已经在WordPress后台启用了jQuery,因为上述JavaScript代码依赖于jQuery。
  • 上述实现每次页面加载时都会增加浏览量。根据你的需求,你可能希望添加额外的逻辑来防止同一用户的多次访问在短时间内重复计数。
  • 考虑到安全性,确保对传递的数据进行验证和清理,避免潜在的安全漏洞。

使用Ajax来更新浏览量可以确保即使在启用了缓存的情况下,文章的浏览量也能被准确地记录和更新。

发表评论 取消回复
表情 图片 链接 代码

  1. obaby
    obaby Lv 1

    这个功能不错

分享