如何实现Video播放次数统计并写入phpMyAdmin数据库？

先梳理你之前代码的核心问题 #

• PHP与JavaScript执行逻辑混淆：PHP在服务器端提前运行，JS在客户端浏览器后执行，两者无法直接共享变量。你之前直接在JS事件里嵌套PHP代码、用PHP调用客户端DOM方法的写法完全错误。
• SQL预处理语句错误：占位符?不需要加单引号，PDO会自动处理字符串转义，加单引号会导致占位符被当成普通字符串，查询不到目标数据。
• 变量传递逻辑错误：后端PHP无法直接获取前端JS里的$videoName、$a等变量，必须通过HTTP请求（如AJAX）完成前后端数据传递。

正确实现步骤 #

1. 数据库表规范（建议调整） #

将原表video-count改为video_count（避免特殊字符引发语法问题），字段结构如下：

2. 后端处理脚本（video_play_handler.php） #

单独编写后端脚本处理查询和更新请求，彻底分离前后端代码：

<?php
include("../db_conn.php");

// 获取请求类型与参数
$action = $_GET['action'] ?? '';
$videoName = $_POST['videoName'] ?? '';

if (empty($videoName)) {
    echo json_encode(['code' => 1, 'msg' => '缺少视频标识']);
    exit;
}

// 查询当前播放次数
if ($action == 'get_count') {
    $stmt = $pdo_conn->prepare("SELECT play_count FROM video_count WHERE video_name = ?");
    $stmt->execute([$videoName]);
    $result = $stmt->fetch(PDO::FETCH_ASSOC);
    // 视频不存在则初始化次数为0
    $count = $result ? $result['play_count'] : 0;
    echo json_encode(['code' => 0, 'count' => $count]);
    exit;
}

// 更新播放次数（用SQL自增避免并发计数错误）
if ($action == 'update_count') {
    $stmt = $pdo_conn->prepare("UPDATE video_count SET play_count = play_count + 1 WHERE video_name = ?");
    $stmt->execute([$videoName]);
    
    // 若未找到对应视频，插入初始数据
    if ($stmt->rowCount() == 0) {
        $stmt = $pdo_conn->prepare("INSERT INTO video_count (video_name, play_count) VALUES (?, 1)");
        $stmt->execute([$videoName]);
        $count = 1;
    } else {
        // 查询更新后的次数
        $stmt = $pdo_conn->prepare("SELECT play_count FROM video_count WHERE video_name = ?");
        $stmt->execute([$videoName]);
        $count = $stmt->fetch(PDO::FETCH_ASSOC)['play_count'];
    }
    
    echo json_encode(['code' => 0, 'count' => $count]);
    exit;
}

echo json_encode(['code' => 1, 'msg' => '无效操作']);
?>

3. 前端页面代码 #

通过AJAX与后端交互，实现播放次数的获取和实时更新：

<video class="spotted" id="nora-hello" controls>
    <source src="nora-hello.mp4" type="video/mp4">
    Your browser does not support the video tag.
</video>
<div>当前播放次数：<span id="playCount">0</span></div>

<script>
const video = document.getElementById('nora-hello');
const playCountEl = document.getElementById('playCount');
const videoName = video.id; // 用视频ID作为唯一标识

// 页面加载时获取初始播放次数
fetch(`video_play_handler.php?action=get_count`, {
    method: 'POST',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
    },
    body: `videoName=${encodeURIComponent(videoName)}`
})
.then(res => res.json())
.then(data => {
    if (data.code === 0) {
        playCountEl.textContent = data.count;
    }
});

// 播放事件触发时更新次数
video.addEventListener('play', () => {
    fetch(`video_play_handler.php?action=update_count`, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
        },
        body: `videoName=${encodeURIComponent(videoName)}`
    })
    .then(res => res.json())
    .then(data => {
        if (data.code === 0) {
            playCountEl.textContent = data.count;
            console.log('播放次数已更新：', data.count);
        }
    })
    .catch(err => console.error('更新失败：', err));
});
</script>

关键说明 #

• 并发问题处理：后端用play_count = play_count + 1的SQL自增操作，比先查询再加1的逻辑更安全，能避免多用户同时播放时的计数错误。
• 变量传递逻辑：前端通过POST请求将视频标识传给后端，后端处理后返回结果，这是前后端数据交互的正确流程。
• 异常处理：加入了基础的错误判断，比如视频不存在时自动初始化播放次数。

内容的提问来源于stack exchange，提问作者JenStar23