gpt4 book ai didi

video - HTML5

转载 作者:技术小花猫 更新时间:2023-10-29 12:02:19 24 4
gpt4 key购买 nike

所以在我的网络服务器上,我想使用 FFMPEG 转码媒体文件以用于 HTML <audio><video>标签。够简单了吧?

当 HTTP 客户端请求转换后的文件时,转换需要实时进行。理想情况下,文件将在转码时流式传输回 HTTP 客户端(而不是在最后转码之后,因为这可能需要一段时间才能开始发送回任何数据)。

这很好,除了在今天的浏览器中,HTML5 音频或视频标签在多个 HTTP 请求中使用 Range 请求媒体文件。 header 。 See this question for details .

在上面链接的那个问题中,您可以看到 Safari 请求文件的奇怪 block ,包括结尾的几个字节。这带来了一个问题,因为 Web 服务器必须等待转换完成,以便交付文件的最终字节以符合 Range。请求。

那么我的问题是,我的思路对吗?有没有更好的方法将转码内容传送到 <audio><video>不需要等待整个转换完成的标签?提前致谢!

最佳答案

我最近遇到了同样的问题,因为我想将我的库提供给浏览器。令人惊讶的是,通过 ffmpeg 发送流并即时交付的想法非常有效。主要问题是支持寻求...

接下来,您将在 Python 中找到使用 Flask 解决问题的代码片段:

我们需要一个函数来流式传输内容:

@app.route('/media/<path:path>.ogv')
def media_content_ogv(path):
d= os.path.abspath( os.path.join( config.media_folder, path ) )
if not os.path.isfile( d ): abort(404)
start= request.args.get("start") or 0
def generate():
cmdline= list()
cmdline.append( config.ffmpeg )
cmdline.append( "-i" )
cmdline.append( d );
cmdline.append( "-ss" )
cmdline.append( str(start) );
cmdline.extend( config.ffmpeg_args )
print cmdline
FNULL = open(os.devnull, 'w')
proc= subprocess.Popen( cmdline, stdout=subprocess.PIPE, stderr=FNULL )
try:
f= proc.stdout
byte = f.read(512)
while byte:
yield byte
byte = f.read(512)
finally:
proc.kill()

return Response(response=generate(),status=200,mimetype='video/ogg',headers={'Access-Control-Allow-Origin': '*', "Content-Type":"video/ogg","Content-Disposition":"inline","Content-Transfer-Enconding":"binary"})

然后我们需要一个函数来返回持续时间:

@app.route('/media/<path:path>.js')
def media_content_js(path):
d= os.path.abspath( os.path.join( config.media_folder, path ) )
if not os.path.isfile( d ): abort(404)
cmdline= list()
cmdline.append( config.ffmpeg )
cmdline.append( "-i" )
cmdline.append( d );
duration= -1
FNULL = open(os.devnull, 'w')
proc= subprocess.Popen( cmdline, stderr=subprocess.PIPE, stdout=FNULL )
try:
for line in iter(proc.stderr.readline,''):
line= line.rstrip()
#Duration: 00:00:45.13, start: 0.000000, bitrate: 302 kb/s
m = re.search('Duration: (..):(..):(..)\...', line)
if m is not None: duration= int(m.group(1)) * 3600 + int(m.group(2)) * 60 + int(m.group(3)) + 1
finally:
proc.kill()

return jsonify(duration=duration)

最后,我们使用 videojs 将其转换为 HTML5:

<!DOCTYPE html>
<html>
<head>
<link href="//vjs.zencdn.net/4.5/video-js.css" rel="stylesheet">
<script src="//vjs.zencdn.net/4.5/video.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<video id="video" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264">
</video>
<script>
var video= videojs('video');
video.src("media/testavi.avi.ogv");

// hack duration
video.duration= function() { return video.theDuration; };
video.start= 0;
video.oldCurrentTime= video.currentTime;
video.currentTime= function(time)
{
if( time == undefined )
{
return video.oldCurrentTime() + video.start;
}
console.log(time)
video.start= time;
video.oldCurrentTime(0);
video.src("media/testavi.avi.ogv?start=" + time);
video.play();
return this;
};

$.getJSON( "media/testavi.avi.js", function( data )
{
video.theDuration= data.duration;
});
</script>
</body>

可以在 https://github.com/derolf/transcoder 找到一个工作示例.

德罗

关于video - HTML5 <audio>/<video> 和 FFMPEG 实时转码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3639604/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com