在网站上提供视频的最佳方式是什么?

发布于 2024-08-28 05:23:32 字数 590 浏览 3 评论 0 原文

我想在我的网站上提供一些视频。它们以从 FlipShare 相机获取的 .MP4 文件形式提供。

现在我尝试将它们转换为 WMV (成功了,但是当嵌入到 标签,用户必须安装一个插件,网站上 10 个 Windows Media Player 的用户体验可不只是那么好。)

然后我查看了 YouTube,想知道他们是如何做到的,但我不知道他们将视频转换成什么格式。

所以我的问题是:我必须将视频转换为什么格式,才能在不需要安装在用户浏览器中的播放器中显示它。我需要什么工具以及嵌入此类视频的 html 代码是什么?

正如您所看到的:从头开始。

PS:我经常听到:这个或那个文件扩展名只是一个容器,里面可以有任何东西。如果你在答案中使用这个,你能给我解释一下吗,因为我从来不明白这。对我来说,.cs 是 ac# 文件,.doc 是 Word 文件,而不是“容器”。

I want so serve some videos on my site. They are available as .MP4 files gotten from a FlipShare camera.

Now I tried converting them to WMV (which succeeded, but when embedded in html in a <object id='mediaPlayer' width='320' height='285' classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95' etc' tag, users have to install an addon and the user experience of 10 Windows Media Players on the site isn't just so good.)

So then I looked at youtube and wondered how they do it, but I can't figure out what format they convert the video to.

So my question is: What format do I have to convert my video to, to show it in a player which does not need to be installed in the users browser. What tool do i need and what is the html code to embed such a video?

As you can see: starting from scratch.

PS: I often hear: This or that file extension is just a container, there can be anything inside. If you're using this in your answer, can you explain this to me, because I never understood this. For me a .cs is a c# file and a .doc a Word file, and not 'a container'.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

你的心境我的脸 2024-09-04 05:23:32

这不是一个简单的问题。基本答案是您需要使用用户计算机已经支持的格式。这个问题没有一个答案。 YouTube 将视频编码为 MP4 并使用基于 Flash 的电影播放器​​将它们嵌入到页面中,Flash 得到了相当广泛的支持,但您会注意到 Flash 在许多移动平台上不可用 — 因此任何使用 iPhone 的人都无法使用 Flash。如果你走Flash路线,就被拒之门外。

HTML5 引入了 video 标签,旨在一劳永逸地解决这个问题,但即使如此,仍然存在一个问题——大多数支持 HTML5 的浏览器都支持 h.264 编码的视频,但 Mozilla 支持 Ogg取而代之的是西奥拉。 YouTube 目前正在试验基于 的播放器,因此这看起来确实是未来的趋势。

我相信当前支持最多人的最佳实践是编码为 h.264,尝试充当 元素,并使用基于 Flash 的播放器作为后备(如果出现这种情况)不起作用(可以播放相同的 h.264 文件)。

This isn't an easy question. The basic answer is that you need to use a format that the user's computer already supports. There is no one answer to this question. YouTube encodes videos as MP4 and embeds them in the page with a Flash-based movie player, and Flash is pretty widely supported, but you'll notice that Flash isn't available on a lot of mobile platforms — so anybody using an iPhone is shut out if you go the Flash route.

HTML5 introduces the video tag, which is meant to solve this problem once and for all, but there's still a hiccup even there — most HTML5-enabled browsers support h.264-encoded video, but Mozilla supports Ogg Theora instead. YouTube is currently experimenting with a <video>-based player, so this does seem like the future.

I believe the current best practice to support the most people possible is to encode as h.264, try to serve as a <video> element, and have a Flash-based player as a fallback if that doesn't work (which can play the same h.264 file).

爱情眠于流年 2024-09-04 05:23:32

我想说,目前最流行的解决方案(YouTube 和其他主要视频门户网站所采用的解决方案)是 H.264 编码的基于 Flash 的视频。 Flash 可以播放视频......我认为是版本 8 或 9,并且已经获得了显着的市场份额。

我个人最喜欢的 Flash 播放器是 LongTail Player,但它不是免费用于商业用途的。

这里是这样关于基于 Flash 的播放器(包括开源播放器)列表的问题。

不过,Flash 无法在 iPhone 和 iPad 上播放。

如果您想支持带有 Flash Player 9 的计算机(我见过一些,但我没有任何硬数字),您将需要对 FLV 文件进行编码(我认为它使用名为 Sorenson 的编解码器)。

即将推出的替代方案是 HTML 5视频,但浏览器对视频的支持远未占据主要市场份额。

I'd say the most popular solution at the moment - utilized by YouTube and other major video portals - is H.264 encoded Flash-based Video. Flash can play Video since... I think Version 8 or 9, and has since gained significant market share.

My personal favourite Flash player is LongTail Player, but it isn't free for commercial use.

Here's a SO question with a list of Flash based players including open source ones.

Flash won't play on iPhone and iPad, though.

If you want to support computers with Flash Player 9 (I've seen some around, but I don't have any hard numbers) you will need to encode FLV files (which use a codec named Sorenson I think).

The upcoming alternative is HTML 5 Video but suport for that in browsers is nowhere near a major market share.

如歌彻婉言 2024-09-04 05:23:32

这个问题需要重新回答,因为现在已经不再是 2010 年了,HTML5 视频(大多数视频托管网站使用的)和基于块的视频(作为对定期 XHR 请求的响应发送的 - 正如 Youtube 使用的)已成为常态。虽然没有最好的方法将视频添加到您的网站,但截至撰写本答案时,Flash 绝对远未达到最佳状态。

未经研究的简单答案是:只需使用视频标签即可解决!

这既简单又直观,并且应该可以在您的许多用例中正常工作。

经过研究的答案是:不幸的是,将视频上传到 Youtube 并将其嵌入到您的网站上。

与仅使用视频标签相比,嵌入 YouTube 的优点和缺点:

优点:

  • 允许您提供多种品质的视频。
  • 带宽效率非常高。 YouTube 对您的用户来说是高效的带宽,因为它会重新编码视频,对您来说也是高效的带宽,因为您将不再在自己的主机上提供视频。
  • 提供隐藏式字幕、自动字幕、多种速度播放、全屏播放器等功能。

缺点:

  • 这是一项非常注重盈利的服务,如果视频内容不符合要求,他们很可能会想在您的视频上投放广告100% 原来是你的。
  • 它有非常严格的法律/条款和条件,您需要遵守,至少在我看来。
  • 它跟踪您的用户。如果您的应用程序需要隐私,并且您不能依靠用户来保护自己,那么 Youtube 并不理想。

混合这两个选项优点和缺点的其他替代方案是:

  • 使用 Javascript 视频库获取 HTML5 视频以及使用 YouTube 的一些优点,但没有缺点。
  • 在服务器端使用FFMPEG,解决带宽问题。
  • 使用一些支持视频的 CDN 来传送视频,以解决可靠性和带宽问题。我目前最喜欢的是依赖服务工作者和 Bittorent 协议,从用户之间进行流传输,但这是否适合您取决于您​​的应用程序。
  • 使用 AWS 存储服务来存储视频,并使用 AWS 网关/CDN 服务来提供视频服务,如果您不想使用 YouTube,但又不想在任何基础设施上存储视频,那么从成本和效率角度来看,这可能是一个很好的解决方案正在为您的网站提供服务。

本回答来源:个人经历。尽管我不想根据经验来回答,但这个问题确实需要一个新的答案!请随意用更具体的内容来编辑它。

This question requires a re-answer now that it's no longer 2010 and HTML5 videos (as utilized by most video hosting sites) and chunk-based videos (sent as responses to periodic XHR requests - as utilized by Youtube) are the norm. While there is no best way to add video to your site, Flash is definitely nowhere close to even being good as of the time of writing of this answer.

The simple un-researched answer is: Just use a video tag and it'll work out!

This is simple and intuitive, and should work fine in many of your use-cases.

The researched answer is: Unfortunately, upload the video on Youtube and embed it on your site.

The pros and cons of embedding on Youtube over just having a video tag:

The pros:

  • Allows you to offer your video in a multitude of qualities.
  • Very bandwidth efficient. Youtube is bandwidth efficient for your users since it reencodes videos, and is also bandwidth efficient for you since you'll no longer be serving your videos off your own hosting.
  • Offers features like closed captions, automatic subs, playing at multiple speeds, full screen player, etc.

The cons:

  • It's a very heavily monetized service, chances are they'll want to put ads on your video if any of its content isn't 100% originally yours.
  • It has very strict laws/terms and conditions that you need to adhere to, at least in my opinion.
  • It tracks your users. If your application requires privacy and you can't rely on your users to protect themselves, then Youtube isn't ideal.

Other alternatives that mix the pros and cons of those two options are:

  • Using a Javascript video library to get HTML5 video along with some of the pros of using youtube, but none of its cons.
  • Using FFMPEG on the server side, for bandwidth issues.
  • Using some CDN that supports video to deliver the video, for reliability and bandwidth issues. My current favorites are ones that rely on service workers and the bittorent protocol, to stream from users to each other, but whether that suits you or not depends on your application.
  • Using AWS storage services to store the video, and AWS gateway/CDN services to serve it, which might be a great solution cost-wise and efficiency-wise if you don't want youtube but don't want to store videos on whatever infrastructure is serving your website.

Sources of this answer: Personal experience. As much as I didn't want to answer from experience, this question really needed a new answer! Feel free to edit it with something more concrete.

∞梦里开花 2024-09-04 05:23:32

使用 H.264 转换视频 MPEG-4 将使您在桌面和移动设备上的当前浏览器上获得 97% 的覆盖率,尽管某些 Android 设备不支持此格式的硬件加速。为了解决这个问题,您还可以使用 VP9 编解码器来提供 WebM。

我写了一个可能有用的浏览器支持摘要: https://stuartk.com/posts/whats-the-best-html-video-format-to-serve/

Converting your video MPEG-4 with H.264 will get you 97% coverage on current browsers across desktop and mobile, although some Android devices don't support hardware acceleration for this format. To address that you could also serve WebM with VP9 codec.

I wrote up a summary of browser support that might be useful: https://stuartk.com/posts/whats-the-best-html-video-format-to-serve/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文