当前位置:首页 > PHP

php实现录像功能

2026-04-03 09:04:46PHP

PHP实现录像功能的基本方法

PHP本身是服务器端脚本语言,无法直接操作客户端摄像头进行录像。需要通过前端技术(如HTML5、JavaScript)结合PHP后端实现。以下是实现方案:

前端采集视频流

使用HTML5的getUserMedia API获取摄像头视频流,并通过MediaRecorder录制:

<video id="preview" autoplay muted></video>
<button id="start">开始录制</button>
<button id="stop">停止录制</button>

<script>
const preview = document.getElementById('preview');
const startBtn = document.getElementById('start');
const stopBtn = document.getElementById('stop');
let mediaRecorder;
let recordedChunks = [];

navigator.mediaDevices.getUserMedia({ video: true, audio: true })
  .then(stream => {
    preview.srcObject = stream;
    mediaRecorder = new MediaRecorder(stream);

    mediaRecorder.ondataavailable = e => {
      if (e.data.size > 0) recordedChunks.push(e.data);
    };

    mediaRecorder.onstop = () => {
      const blob = new Blob(recordedChunks, { type: 'video/webm' });
      recordedChunks = [];
      uploadVideo(blob);
    };
  });

startBtn.addEventListener('click', () => mediaRecorder.start());
stopBtn.addEventListener('click', () => mediaRecorder.stop());

function uploadVideo(blob) {
  const formData = new FormData();
  formData.append('video', blob, 'recording.webm');

  fetch('upload.php', {
    method: 'POST',
    body: formData
  });
}
</script>

PHP接收并保存视频

创建upload.php处理上传的视频文件:

php实现录像功能

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['video'])) {
    $uploadDir = 'uploads/';
    $filename = uniqid() . '.webm';
    $destination = $uploadDir . $filename;

    if (!is_dir($uploadDir)) {
        mkdir($uploadDir, 0755, true);
    }

    if (move_uploaded_file($_FILES['video']['tmp_name'], $destination)) {
        echo json_encode(['status' => 'success', 'file' => $filename]);
    } else {
        echo json_encode(['status' => 'error']);
    }
}
?>

视频格式转换处理

WEBM格式可能需要转换为MP4等更通用格式。可使用FFmpeg:

$inputFile = 'uploads/recording.webm';
$outputFile = 'uploads/recording.mp4';

exec("ffmpeg -i $inputFile -c:v libx264 -c:a aac $outputFile");

安全注意事项

设置上传文件大小限制:

php实现录像功能

ini_set('upload_max_filesize', '100M');
ini_set('post_max_size', '100M');

验证文件类型:

$allowedTypes = ['video/webm', 'video/mp4'];
if (!in_array($_FILES['video']['type'], $allowedTypes)) {
    die('Invalid file type');
}

数据库记录存储

将视频信息存入MySQL数据库:

$pdo = new PDO('mysql:host=localhost;dbname=video_db', 'username', 'password');
$stmt = $pdo->prepare("INSERT INTO videos (filename, path, created_at) VALUES (?, ?, NOW())");
$stmt->execute([$filename, $destination]);

视频流直播方案

如需实现直播而非录制,可使用WebRTC技术配合PHP信令服务器,或使用RTMP协议推流到媒体服务器如Nginx-RTMP。

标签: 录像功能
分享给朋友:

相关文章

vue实现注册功能

vue实现注册功能

前端实现注册功能 在Vue中实现注册功能通常需要结合表单验证、HTTP请求和状态管理。以下是一个基于Vue 3和Element Plus的完整实现方案: 模板部分 <template>…

vue拖拽功能实现

vue拖拽功能实现

Vue 拖拽功能实现方法 使用 HTML5 原生拖拽 API HTML5 提供了原生的拖拽 API,通过 draggable 属性和相关事件实现基础拖拽功能。 <template>…

vue添加功能实现

vue添加功能实现

Vue 功能实现方法 添加组件 在 Vue 项目中创建新组件,通常位于 components 目录下。使用单文件组件(SFC)格式,包含 <template>、<script>…

vue实现toggle功能

vue实现toggle功能

Vue 实现 Toggle 功能的方法 使用 v-model 绑定数据 通过 v-model 双向绑定一个布尔值,控制 toggle 的状态。适用于简单的开关场景。 <template…

vue实现拍照功能

vue实现拍照功能

Vue 实现拍照功能 在 Vue 中实现拍照功能通常需要结合 HTML5 的 getUserMedia API 和 <canvas> 元素。以下是实现步骤: 引入摄像头访问权限 使用 n…

vue注册功能实现

vue注册功能实现

Vue 注册功能实现 前端实现 使用 Vue.js 和 Axios 发送注册请求到后端 API: <template> <div> <form @submi…