JW Player - 加载播放器时出错:在Heroku上的Rails 3.2应用程序中找不到HTML5播放器

时间:2014-05-14 21:44:27

标签: ruby-on-rails heroku asset-pipeline jwplayer jwplayer6

我有JW Player 6的许可版本。我下载了这些文件并将它们放在assets / javascript目录中。除了皮肤目录,还有一个用于HTML5播放器的JS文件以及一个用于flash播放器的flash.swf文件。到目前为止,我所做的一切都在本地工作,但是当我推到Heroku时,我会遇到错误。

首次尝试:

在我的application.js文件中:

...
//= require jwplayer/jwplayer
//= require jwplayer/jwplayer.html5 # the file name is jwplayer.html5.js
...

运行rake assets:clean ; rake assets:precompile后,我在视图中遇到以下错误(在Heroku上):

An ActionView::Template::Error occurred in nodes#show:
jwplayer/jwplayer.html5.js isn't precompiled

第二次尝试:

在我的application.js文件中:

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

然后,我将其添加到production.rb环境配置文件中:

# Also tried %w(jwplayer.html5.js)
config.assets.precompile += %w(jwplayer/jwplayer.html5.js)

清理并预编译资产并推送到Heroku后,原来的ActionView::Template::Error不再发生,但现在JW播放器显示此消息:

Error loading player: HTML5 player not found

这是HAML视图中的JW Player初始化:

:javascript
  jwplayer("video_display_object_#{display_object.id}").setup({
    width: "948",
    height: "533",
    image: "#{display_object.video_screenshot_url}",
    file: "#{display_object.resource_url}",
    modes: [
        { type: 'flash',
          src: "#{asset_path('jwplayer/jwplayer.flash.swf')}",
          config: {
            skin: "#{asset_path('jwplayer/skins/beelden.xml')}",
            'controlbar.position': 'over',
            'controlbar.idlehide': 'true'
          }
        },
        // I've also tried "#{javascript_path('jwplayer/jwplayer.html5.js}"
        // And "/assets/jwplayer/jwplayer.html5.js"
        { type: 'html5', src: "#{asset_path('jwplayer/jwplayer.html5.js')}" }
    ]
  });

此时我真的不知道该怎么做。就像我之前提到的,一切都在本地工作,而不是在Heroku上。

有什么建议吗?

1 个答案:

答案 0 :(得分:5)

这非常令人沮丧,但我们设法让它运行起来。解决方案实际上非常简单(一旦你知道该怎么做):

如果您决定不使用云托管的JW Player(由于不涉及资产管道而很容易设置),请下载并解压缩jwplayer文件夹。

将解压缩的jwplayer文件夹放入Rails应用的/app/assets/javascripts文件夹中。

将以下内容添加到/app/assets/javascripts/application.js

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

运行rake assets:precompile

要在视图中启动并运行播放器,请使用下面的(HAML)代码。 (可以使用其他选项here。)

%div{id: 'video'} Loading the player...
:javascript
  jwplayer('video').setup({
    file: 'INSERT_VIDEO_FILE_PATH_HERE',
    flashplayer: "#{asset_path('jwplayer.flash.swf')}",
    html5player: "#{asset_path('jwplayer.html5.js')}"
  });

您必须指定flashplayerhtml5player属性(如果您想支持这两个版本的播放器)。

自定义!