JW-Player and Rails 3.2

2020-02-14 08:44发布

站内问答 / 前端开发
1545 7 5

I'm trying to use JW-Player in my application. Researching the issue a bit, there seems to be several abandoned efforts to produce a gem, and the latest is undocumented. So, here's how I'm going about it:

I downloaded the JW-Player version 6, unzipped and copied the files in my /app/assets/javascripts directory as follows:

app/assets/javascripts/jwplayer/jwplayer.js
app/assets/javascripts/jwplayer.html5.js
app/assets/javascripts/jwplayer.flash.swf

In my app/views/layouts/application.html.erb, I have the following:

<head>
    <%= javascript_include_tag "/assets/javascripts/jwplayer/" %>
</head>

and in app/views/pages/about.html.erb, I have the following:

<%= jw_player("http://xxxxx/video.mp4",
            :width => 200, :height => 110) %>

Here's what happens when I click on the About page link:

Showing xxxxxxxx/app/views/pages/about.html.erb where line #10 raised:

undefined method `jw_player' for #<#<Class:0x007fe77e37c018>:0x007fe780c1f678>

First time user of JW-Player.

7条回答
可以哭但决不认输i
2楼-- · 2020-02-14 08:50

I've found a solution to this.

The main issue you need to work-around is that jwplayer.js wants to fetch jwplayer.flash.swf and jwplayer.html5.js based on the path of jwplayer.js.

You can see that in Chrome Developer Toolbar for jwplayer.js (with pretty print):

(h.embed.config = function(b) {
    var e = {fallback: !0,height: 270,primary: "html5",width: 480,base: b.base ? b.base : j.getScriptPath("jwplayer.js"),aspectratio: ""};
    b = j.extend(e, h.defaults, b);
    var e = {type: "html5",src: b.base + "jwplayer.html5.js"}, 
    g = {type: "flash",src: b.base + "jwplayer.flash.swf"};

You can use that base property as an undocumented api to tell jwplayer where the jwplayer.flash.swf and jwplayer.html5.js can be found.

Example:

jwplayer("player-id").setup({
    width: 640,
    height: 480,
    file: "www.w3schools.com/html/movie.mp4",
    base: "http://cloudfront.net/assets/vendor/jwplayer/"
};

Then it will look for http://cloudfront.net/assets/vendor/jwplayer/jwplayer.flash.swf. Note: jwplayer has no notion of the asset pipeline fingerprint filenames, so make sure you sync both the file with md5 and without.

查看更多
0人赞 添加讨论(0) 举报
祖国的老花朵
3楼-- · 2020-02-14 08:51

I have just finished working on a gem started by choix and improved by mattherick called jwplayer-rails that probably worked in older version of rails. It wasn't working with the assets pipeline but mattherick did a great job at fixing that up and I went on to update JWPlayer to the newest version.

You can see the repository here.

The following instructions are right out of the repo above.

To add this gem to your rails app just add this line to your application's Gemfile:

gem 'jwplayer-rails', :git => 'git://github.com/dutgriff/jwplayer-rails.git'

To use it first include assets on the page

<%= jwplayer_assets %>

Then place a div with JW Player

<%= jwplayer %>

You can pass options to jwplayer helper to customize it:

<%= jwplayer({width: 500, height: 200}) %>

More information for customization could be found here.

It works great for me so far but if you find an issue let me know on here or github.

查看更多
0人赞 添加讨论(0) 举报
倾城　Initia
4楼-- · 2020-02-14 08:52

Download jwplayer from http://www.longtailvideo.com/jw-player/download/

Put these files to the particular directory:-

  • app/assets/jwplayer/jwplayer.flash.swf
  • vendor/assets/javascripts/jwplayer.js
  • vendor/assets/javascripts/jwplayer.html5.js

Then add these line in application.js

//= require jwplayer
//= require jwplayer.html5

On the page where you are playing video, add these lines

<script type="text/javascript">jwplayer.key="YOUR_JWPLAYER_KEY";</script>
<div id="video">Loading the player ...</div>
<script type="text/javascript">
jwplayer("video").setup({
    flashplayer: "<%=asset_path('jwplayer.flash.swf')%>",
    file: "<%= file_path %>",
    height: 360,
    width: 640,
    analytics: {
        enabled: false,
       cookies: false
   }
});

http://account.longtailvideo.com/#/home from where you can get your free self hosted key in signing up from Get Your License Key portion.

查看更多
0人赞 添加讨论(0) 举报
爱情/是我丢掉的垃圾
5楼-- · 2020-02-14 08:56

Did you restart the server after downloading the player and including it in your layouts. This could be one reason of failure.

查看更多
0人赞 添加讨论(0) 举报
够拽才男人
6楼-- · 2020-02-14 09:00

When implementing JWPlayer 6.6, we stood before the choice of putting the jwplayer.flash.swf file into the public folder, to make the flash mode work, but it seemed very messy to have the files separated like that. What I did in the end to make it work both on development and production was:

  • Put all 3 files to vendor/assets/javascripts/jwplayer
  • Rename jwplayer.js to jwplayer.js.erb

  • Inside jwplayer.js.erb, update the flash file path config like this (the 1st line with the html5 file path config is just for reference)

    j={type:"html5",src:e.base+"jwplayer.html5.js"},
b={type:"flash",src:"<%= asset_path('jwplayer/jwplayer.flash.swf') %>"};

    (note that the "e.base+" before the path was removed for the flash file path - that's the trick that allowed working relative paths in the development environemtn)

In my understanding, the JWPlayer license allows modifications like this: "Adaptations Publisher shall be permitted to make Adaptations reasonably necessary for the purpose of exercising its rights under these Terms of Service, such as Adaptations to integrate the Products into Publisher’s websites or other properties. All Adaptations created by Publisher are strictly for its own Use and Publisher is prohibited from Distributing any Adaptation it creates. The Company reserves the right to prohibit the Use of any Adaptation in its sole discretion."

查看更多
0人赞 添加讨论(0) 举报
聊天终结者
7楼-- · 2020-02-14 09:10

I also chose JWplayer.

Here are my steps.

I'm using https://github.com/choix/jwplayer-rails gem.

Added 

 gem 'jwplayer-rails', '1.0.1'

to my Gemfile.

Did all things from above page; in a show.html.slim view file included these lines:

   = jwplayer_assets
   br
   br
   = jwplayer({file:@lesson.media_file})

lesson.media_file attribute contains file location. For a video file project/public/videos/videoclip.webm, media_file contains string "/videos/videoclip.webm".

Hope this will be useful.

查看更多
0人赞 添加讨论(0) 举报
1 2 下一页
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)