【问题标题】:PHP - Extract frame during Video uploadPHP - 在视频上传期间提取帧
【发布时间】:2012-06-30 23:09:53
【问题描述】:

我在寻找这是否可能时遇到了问题(在任何地方都找不到信息)。 是否可以在视频上传期间提取帧(缩略图)? 如果可以提取用户端,则使用 jscript 提取也是一种选择。

感谢您的帮助!

【问题讨论】:

  • 在客户端是不可能的,但是如果你已经上传了一个视频到 Youtube,它是可能的。
  • @Amberlamps,它可能是带有 html5 的客户端(您可以读取二进制文件内容),尽管您必须从头开始编写提取/转换代码 :)

标签: php javascript image frame


【解决方案1】:

这个问题发布已经快五年了,现在的答案是是的

Live demo

如何在视频上传过程中使用 JavaScript 提取帧

在显示代码之前,这是我们要做的:

  1. 在将上传视频的输入元素上设置事件处理程序
  2. 当从文件系统中选择一个文件时,使用URL对象创建一个指向本地视频文件的url。
  3. 将该 URL 加载到 video 元素中。
  4. 视频加载到内存后,在canvas 对象上绘制帧。
  5. 现在将在画布上呈现的帧导出到 image 元素(或选择将该图像作为数据 URL 发送到您的服务器)。

<input type="file" id="upload"/>
<img id="thumbnail"/>

<script>
var input = document.getElementById('upload');
var img = document.getElementById('thumbnail');

input.addEventListener('change', function(event){
    var file = this.files[0];
    var url = URL.createObjectURL(file);

    var video = document.createElement('video');
    video.src = url;

    var snapshot = function(){
        var canvas = document.createElement('canvas');
        var ctx = canvas.getContext('2d');

        ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
        img.src = canvas.toDataURL('image/png');

        video.removeEventListener('canplay', snapshot);
    };

    video.addEventListener('canplay', snapshot);
});
</script>

【讨论】:

    【解决方案2】:

    我认为在 php.ini 中没有很好的方法来做到这一点。 (https://stackoverflow.com/a/1309425/1488032)

    如果您租用的不仅仅是一些网站空间,而是有权在服务器上安装和运行其他软件,我建议您使用 ffmpeg 之类的东西,并使用 system()从 php 中调用它>、passthru()exec() 提取您想要的内容并再次在 php 中进行其余处理。

    我正在运行一个依赖嵌入在 xhtml 中的 svg 图像的浏览器游戏,但某些浏览器(尤其是移动浏览器)不支持完整的 svg 语法。在这种情况下,我使用这样的 system() 调用来使用 imagemagick 的 convert 二进制文件进行 svg 到 png 的转换,并将结果显示在我的页面上。

    system("echo '$svgString' | convert svg:- png:- | base64");
    

    我想你必须退回到类似的东西。

    这里有一些关于使用 ffmpeg 提取帧的信息: http://ubuntuforums.org/showthread.php?t=1141293

    【讨论】:

      【解决方案3】:

      Javascript:没有。

      上传期间:否。

      上传后,是的。

      “Dev”在 cmets 中提供了正确的链接,但您应该将视频保存到您的服务器,然后运行 ​​ffMpeg 来抓取图像。您可以在此处下载 ffMPEG:http://ffmpeg.org/download.html(如果您对自己构建没有信心,请获取所需的构建 - 有 Linux 和 Windows 构建)。

      文档在这里:http://ffmpeg.org/ffmpeg.html,但在http://linuxers.org/tutorial/how-extract-images-video-using-ffmpeg 有一个更容易阅读的教程,用于抓取图像。

      注意:有一个名为“phpFFMPEG”的 PHP 扩展,但我建议你不要使用它。只需通过 PHP 中的“exec()”运行所需的命令。检查错误返回值,因为每个 CPU 内核只能运行一次 ffMPEG,因此如果同时尝试两次,它可能会失败 - 将操作排队或在失败时重试。

      【讨论】:

      • 您在 Youtube 上上传期间有预览缩略图。如果您认为不可能,他们是如何做到的?
      • 没有用过 You Tube,我无法确切回答,但我想这将使用 flash。 Flash当然是一种选择。
      • 找到答案:Silverlight for IE,使用 gears for Chrome。 code.google.com/p/gears/wiki/ResumableHttpRequestsProposal,两者都不是标准。但如果你想要挑战,绝对是一个选择。 Flash 和 Java 也可以。
      【解决方案4】:

      首先,您需要选择一个程序来提取帧。 ffmpeg 通常用于此目的。无论您选择什么,它都需要能够处理部分文件内容。

      php 脚本直到整个文件上传完成后才开始执行,但是 php 最近有了一个功能,可以在文件上传期间执行 不同的 php 脚本,并且能够获取在上传脚本数据时(文件名是你感兴趣的东西)。 http://php.net/manual/en/session.upload-progress.php

      然后,基本上调用外部程序从监控脚本中提取帧,使用上传处理脚本中上传的临时文件名。

      总结一下: 将文件上传到upload.phpmonitor.php 将获取upload.php 中正在上传的临时文件名,并提取框架。

      【讨论】:

        【解决方案5】:

        基本上,我采用了此线程中提供的 rodrigo-silveira 答案并对其进行了修改以供我使用,现在该解决方案就像一个魅力。即使我试图上传用户希望上传的视频的视频缩略图/海报,并将视频和缩略图保存在文件夹中。另外,我不想使用 ffmpeg。

        这是我所做的:在名为“upload.php”的上传文件中,我有以下代码,对上面的rodrigo-silveira的解决方案稍作修改:

        上传.php:

        <input type="file" id="upload"/>
        <img id="thumbnail"/>
        
        <form action="action_page.php" method="post" target="_blank">
        <input type="hidden" id="mytext" name="mytext" >
        <input type="submit" value="Submit">
        </form>

        <script>
        var input = document.getElementById('upload');
        var img = document.getElementById('thumbnail');
        
        input.addEventListener('change', function(event){
            var file = this.files[0];
            var url = URL.createObjectURL(file);
        
            var video = document.createElement('video');
            video.src = url;
        
            var snapshot = function(){
                var canvas = document.createElement('canvas');
                var ctx = canvas.getContext('2d');
        		canvas.width = 350;
        		canvas.height = 250;
                ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
                img.src = canvas.toDataURL('image/png');
        		document.getElementById("mytext").value = img.src;
                video.removeEventListener('canplay', snapshot);
            };
        	
            video.addEventListener('canplay', snapshot);
        });
        </script>

        上面的 HTML 部分和 JavaScript 都在 upload.php 的 body 标记中。

        现在进入 action_page.php 文件:

        <?php
        $data = $_POST['mytext'];
        $file = "photos/file".time().".png";
        $uri = substr($data,strpos($data, ",") + 1);
        file_put_contents($file, base64_decode($uri));
        ?>
        

        将两个 PHP 文件保存在同一个文件夹中,并在该文件夹中创建另一个名为“photos”的文件夹。您在 upload.php 页面中选择的视频中的视频缩略图/海报图像将作为 png 文件保存在“照片”文件夹中。 (注意:此解决方案不上传视频,只上传视频缩略图。但从这里开始就很简单了。)

        【讨论】:

          猜你喜欢
          • 2013-03-26
          • 1970-01-01
          • 2012-05-27
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2019-03-29
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多