HTML5 VIDEO 在我的 Rails 3 应用程序中无法工作
我正在尝试在开发中的 Rails 3 应用程序中显示 HTML5 视频，我使用 Sqlite3 和默认网络服务器（Webrick）。我将视频文件（movie.ogg）放在资产（assets/movie.ogg）下。视频窗口屏幕显示但没有视频。我有 3 个问题...由于 Rails 应用程序资产没有视频子文件夹（就像它具有图像的方式一样），您将视频文件放在哪里？ Webrick 支持 Html5 视频吗？下面是我的代码，为了使视频正常工作，我在这里缺少什么？
查看
<video width="320" height="240" controls="controls">
<source src="/assets/movie.mp4" type="video/mp4" />
<source src="/assets/movie.ogg" type="video/ogg" />
<source src="/assets/movie.webm" type="video/webm" />
Your browser does not support the video tag.
</video>
config/initializers/mime_types.rb
Rack::Mime::MIME_TYPES.merge!({
".ogg" => "application/ogg",
".ogx" => "application/ogg",
".ogv" => "video/ogg",
".oga" => "audio/ogg",
".mp4" => "video/mp4",
".m4v" => "video/mp4",
".mp3" => "audio/mpeg",
".m4a" => "audio/mpeg"
})
I am trying to display HTML5 video in my Rails 3 app in development,i am using Sqlite3 and default webserver(Webrick).I put the video file (movie.ogg) under assets (assets/movie.ogg).The video window screen shows up but there is no video on there though.I have 3 questions...Since rails app assets doesn't have sub-folder for video(as the way it has images),where do you put video files?
Does Webrick support Html5 video?Here is my code below ,what am i missing here,to make the video work?
view
<video width="320" height="240" controls="controls">
<source src="/assets/movie.mp4" type="video/mp4" />
<source src="/assets/movie.ogg" type="video/ogg" />
<source src="/assets/movie.webm" type="video/webm" />
Your browser does not support the video tag.
</video>
config/initializers/mime_types.rb
Rack::Mime::MIME_TYPES.merge!({
".ogg" => "application/ogg",
".ogx" => "application/ogg",
".ogv" => "video/ogg",
".oga" => "audio/ogg",
".mp4" => "video/mp4",
".m4v" => "video/mp4",
".mp3" => "audio/mpeg",
".m4a" => "audio/mpeg"
})
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
video_tag 帮助程序构建 HTML 5
标记。默认情况下，文件从公共/视频加载。要从资产/视频加载，请将以下行添加到您的 config/application.rb 文件中：
标签用法：
The video_tag helper builds an HTML 5
<video>tag.By default, files are loaded from public/videos. To load from assets/video add the following line to your config/application.rb file:
Tag Usage:
资产管道用于静态资产。如果您经常向应用添加视频文件，则应将它们放在其他位置（例如，
public/videos或public/system/videos）。如果它们确实是静态资产，请先尝试重新启动服务器。The assets pipeline is used for static assets. If you're adding video files to your app often, you should put them somewhere else (for example,
public/videosorpublic/system/videos). If they really are static assets, try restarting your server first.假设您的 html 是正确的，除非 Rails 3.1 中的资产管道发生了巨大变化，否则公共文件夹中包含的任何内容都可以从 Web 服务器提供，因此存储视频的确切位置取决于您。根据上面的来源，您应该将视频放在 public/assets 中，然后通过访问 http 来确认视频是否正在提供://localhost:3000/assets/movie.mp4（或视频的任何其他源网址）。
Assuming your html is correct, unless things have dramatically changed in rails 3.1 with the asset pipeline anything contained in the public folder can be served up from the web server, so the exact location of where to store videos is up to you. According to your sources above you should put your videos in public/assets then confirm the videos are being served up by accessing http://localhost:3000/assets/movie.mp4 (or any other src url for a video).
要将视频作为 Rails 4 中的静态资源，最好的方法是使用 video 标签：
只需在“assets”中创建一个名为“videos”的文件夹并将视频存储在其中：
然后在视图中：
如果需要指定大小，一张海报图片或者添加控件，添加（不过这是HTML，不是Rails）：
注意Rails很聪明的知道图片在image文件夹里，所以指定一个名字就够了，不用在前面添加images/或者assets/images/图像名称。
如果您想传递许多视频（或者更好地说，不同格式的相同视频），请传递一个数组：
请注意，对于大小调整，您可以使用 size: "widthxheight" ("640x360") 或单独使用 height: 和 width:
To serve videos as static assets in Rails 4, the best way is to use the video tag:
Simply create a folder in 'assets' called 'videos' and store your videos there:
Then in your views:
If you need to specify size, a poster image or add controls, add (but this is HTML, not Rails):
Note that Rails cleverly knows that the image is in the image folder, so specifying a name is enough, without adding images/ or assets/images/ before the image name.
If you want to pass in many videos (or better said, the same video in different formats), pass an array:
Note that for sizing you can either use size: "widthxheight" ("640x360") or separately height: and width: