用RecordRTC录制视频上传到后端php
上一讲我们实现了摄像头的视频录制与视频下载，如果我们要把录制好的视频直接发送到后端，比如php该如何弄呢，今天来演示一下
1、前端代码
<!DOCTYPE html>
<html>
<head>
<script src="http://repo.bfw.wiki/bfwrepo/js/RecordRTC.js"></script>
<script src="http://repo.bfw.wiki/bfwrepo/js/jquery.17.js"></script>
<style>
video {
max-width: 100%;
border: 5px solid yellow;
border-radius: 9px;
}
body {
background: black;
}
h1 {
color: yellow;
}
</style>
</head>
<body>
<h1 id="header">用RecordRTC 录制视频上传到php</h1>
<p style="color: yellow;">
首先需要<a href="https://chrome.google.com/webstore/detail/getusermedia/nbnpcmljmiinldficickhdoaiblgkggc">安装chrome扩展</a>,注意，这需要fanqiang，如果打不开，就查看这篇文章手动安装chrome扩展,<a href="http://www.bfw.wiki//user10/15640228901296320096.html">点击查看</a>
</p>
<video id="your-video-id" controls autoplay playsinline></video>
<script type="text/javascript">
// capture camera and/or microphone
navigator.mediaDevices.getUserMedia({ video: true, audio: true }).then(function(camera) {
// preview camera during recording
document.getElementById('your-video-id').muted = true;
document.getElementById('your-video-id').srcObject = camera;
// recording configuration/hints/parameters
var recordingHints = {
type: 'video'
};
// initiating the recorder
var recorder = RecordRTC(camera, recordingHints);
// starting recording here
recorder.startRecording();
// auto stop recording after 5 seconds
var milliSeconds = 5 * 1000;
setTimeout(function() {
// stop recording
recorder.stopRecording(function() {
// get recorded blob
var blob = recorder.getBlob();
// generating a random file name
var fileName = getFileName('webm');
// we need to upload "File" --- not "Blob"
var fileObject = new...点击查看剩余70%
{{collectdata}}
网友评论0