如何在 facebook 上扩展我的 video.js 播放器？答案

【问题标题】：How can I expand my video.js player on facebook?如何在 facebook 上扩展我的 video.js 播放器？
【发布时间】：2014-06-11 14:28:08
【问题描述】：

我的想法是，当您将我博客中的链接粘贴到 Facebook 墙时，您可以播放它，就像 youtube 播放器一样。
我有 video.js，我试过这个标签：

<meta property="og:video" content="http://zobolio.com/embeds/video-js.swf?video=http://zobolio.com/embeds/test.flv" />
<meta property="og:video:secure_url" content="https://zobolio.com/embeds/video-js.swf?video=https://zobolio.com/embeds/test.flv" />
<meta property="og:video:height" content="640" />
<meta property="og:video:width" content="385" />
<meta property="og:video:type" content="application/x-shockwave-flash" />

但不工作，我想知道为什么？
我还想知道这是如何工作的？
Here video.js 播放器的示例。
编辑：
我添加了一个完整的 Flash 播放器和一个 FLV 文件和 https，但也无法正常工作。

【问题讨论】：

我需要做同样的事情。你弄明白了吗？
好吧，我现在最好知道了，我盯着看。不幸的是，facebook 要求 https 协议嵌入任何东西。如果您不想付款，那没关系，我发现了这个：startssl.com 它的问题并不安全，而且激活非常复杂，因为需要站点列表中的子域，所以您无法添加您的 owen。跨度>

标签： javascript facebook video video.js

【解决方案1】：

这仅适用于 Flash 播放器，不适用于 video.js 或任何其他 HTML5 播放器。您需要提供 swf 的路径以及加载特定视频所需的任何参数。您还需要为播放器提供一个 https 网址为og:video:secure_url。

比如：

<meta property="og:video" content="http://example.com/path/to/player.swf?video=http://neocsatblog.mblx.hu/embeds/ezekiel.mp4" />
<meta property="og:video:secure_url" content="https://example.com/path/to/player.swf?video=https://neocsatblog.mblx.hu/embeds/ezekiel.mp4" />
<meta property="og:video:height" content="640" />
<meta property="og:video:width" content="385" />
<meta property="og:video:type" content="application/x-shockwave-flash" />

您可能会在og:video 和video/mp4 中找到一些较旧的示例，其中包含指向 MP4 文件的 URL（对于 og:video:type），但如果它曾经这样做过，这将不再有效。

【讨论】：

嗯，video.js 有一个名为：video-js.swf 的 swf 文件。你认为这可以使用，或者只是搜索一个完整的 flashplayer，比如跟随播放器？
现在，播放器是flash，文件是FLV，我有https，但是不工作
不，video.js 的用于 Flash 后卫的 swf 不起作用。它不是一个独立的播放器。
是的，谢谢你的回答，但我解决了这个问题，你可以在顶部阅读我的答案

【解决方案2】：

答案是：
video.js 不适用于 facebook。
是的，它有 swf 文件，但只是为了备用。
解决办法是：
必须将播放器切换到 JW 5.1 pro，并且必须提供一些我以前从未见过的必要的 og 元标记。
这里的标签：

<html xmlns:fb="http://ogp.me/ns/fb#">
<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# video: http://ogp.me/ns/video#">
<meta property="og:type"        content="video.movie" /> 
<meta property="og:video:height" content="260" /> 
<meta property="og:video:width" content="420" /> 
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:title" content="Big Buck Bunny" /> 
<meta property="og:description" content="Big Buck Bunny is a short animated film by the Blender Institute, part of the Blender Foundation." />
<meta property="fb:admins" content="100000446876505">
  <meta property="fb:app_id" content="257720611082074">
<meta property="og:image" content="http://zobolio.com/embeds/posters/ezekiel.png" />
<meta property="og:video" content="http://zobolio.com/embeds/jwplayer5/player.swf?file=http%3A%2F%2Fwww.zobolio.com/embeds/ezekiel.mp4&autostart=true" /> 
<meta property="og:video:secure_url" content="https://zobolio.com/embeds/jwplayer5/player.swf?file=http%3A%2F%2Fwww.zobolio.com/embeds/ezekiel.mp4&autostart=true" />

当然，如果您有自己的播放器，则必须将内容部分更改为您的数据。

【讨论】：

【解决方案3】：

需要用到video-js.swf文件的参数

见：

http://vjs.zencdn.net/4.12/video-js.swf?src=http://video-js.zencoder.com/oceans-clip.mp4&autoplay=true&preload=none&poster=http://video-js.zencoder.com/oceans-clip.png

<meta property="og:video" content="http://vjs.zencdn.net/4.12/video-js.swf?src=http://video-js.zencoder.com/oceans-clip.mp4&autoplay=true&preload=none&poster=http://video-js.zencoder.com/oceans-clip.png" />
<meta property="og:video:secure_url" content="http://vjs.zencdn.net/4.12/video-js.swf?src=http://video-js.zencoder.com/oceans-clip.mp4&autoplay=true&preload=none&poster=http://video-js.zencoder.com/oceans-clip.png" />
<meta property="og:video:height" content="640" />
<meta property="og:video:width" content="385" />
<meta property="og:video:type" content="application/x-shockwave-flash" />

【讨论】：