您如何配置 S3 和 Cloud Front 以流式传输 HTML5 视频?什么都试过了 [英] How do you configure S3 and Cloud Front to stream HTML5 video? Tried everything
问题描述
我尝试了许多不同的配置、文件、编码、浏览器等...，但这是最简单的示例，可以说明我遇到的问题.
I've tried many, many different configurations, files, encoding, browsers, etc..., but this is the simplest example that demonstrates the problem I am having.
如果您在 FF 8.0.1 中粘贴 JSPlayer 示例视频的 url，视频将内联播放:
If you paste the url for the sample video for JSPlayer in FF 8.0.1, the video plays inline:
http://video-js.zencoder.com/oceans-clip.webm
如果我拍摄相同的视频并将其上传到我的 s3 存储桶，它会改为触发下载:
If I take that same video and upload it to my s3 bucket, it triggers download instead:
https://s3.amazonaws.com/turingvideos/oceans-clip.webm- 或者 -http
https://s3.amazonaws.com/turingvideos/oceans-clip.webm -- or -- http
(读取文件和存储桶上每个人的权限)
(Permissions are read for everyone on the file and bucket)
那么，让我们试试 Cloud Front.
So, let's try Cloud Front.
d2yat6m71lu23b dot cloudfront dot net slash Oceans-clip.webm(下载触发器)
d2yat6m71lu23b dot cloudfront dot net slash oceans-clip.webm (download trigger)
和 Cloud Front 流媒体:
And Cloud Front streaming:
strzsu4h2ax96 dot cloudfront dot net slash Oceans-clip.webm (infinite spinner)
strzsu4h2ax96 dot cloudfront dot net slash oceans-clip.webm (infinite spinner)
在使用 html 视频标签时也会发生同样的基本事情.从 zencoder 工作正常，在本地磁盘读取以外的任何事情上都失败了.
The same basic things happen when using an html video tag as well. Works fine from zencoder, borked on anything other than local disk read.
那么，使用 S3/CloudFront 完全无法实现的 zencoder 管理有什么魔力?我完全被难住了.
So, what magic is zencoder managing that is completely out of my reach with S3/CloudFront? I'm completely stumped.
将内容类型和配置设置为video/webm"和inline"即可.感谢您的快速响应.
Setting the content type and disposition to "video/webm" and "inline" did the trick. Thanks for the quick response guys.
推荐答案
使用 S3 Web 管理控制台 (https://console.aws.amazon.com/s3)，选择您的存储桶，右键单击您的视频文件之一，切换到元数据选项卡并设置 2 个标题:
Using the S3 web management console (https://console.aws.amazon.com/s3), select your bucket, right-click one of your video files, switch to the metadata tab and set 2 headers:
- Content-Type:无论您的视频文件的内容类型是什么
- 内容处理:内联
此外，请确保您的 CloudFront 分配设置为流式"分配而不是下载"分配.
Also, make sure your CloudFront distribution is set as a "streaming" distribution and not a "download" one.
来自 AWS 文档:
CloudFront 服务器不会确定它们所服务对象的 MIME 类型.因此，当您将对象上传到源时，您应该设置对象的 Content-Type 标头.
CloudFront servers don't determine the MIME type for the objects they serve. Therefore, when you upload an object to your origin, you should set the object's Content-Type header.
来源:http://docs.amazonwebservices.com/AmazonCloudFront/latest/开发者指南/ObjectMIMEType.html
这篇关于您如何配置 S3 和 Cloud Front 以流式传输 HTML5 视频?什么都试过了的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
