SoundCloud如何在Facebook上嵌入HTML5 / JS小部件？ [英] How is SoundCloud embedding an HTML5/JS widget on Facebook?

问题描述

这是我看到的情景 -

• 您点击将SoundCloud的声音发布到Facebook


• 它将播放器嵌入到可以点击的播放器中，将您带到SoundCloud上的原始项目，或者您可以单击播放图标在您的Feed中播放声音。


• 播放器是一个Javascript / HTML5播放器（您可以通过查看源代码查看）。但是，如果您使用嵌入式网址并将其放在Facebook开放图表调试器中，您将看到它似乎正在引导嵌入Flash SWF

SoundCloud如何做，似乎是某种重定向技巧来获取og：videoSWF来转成为一个JS / HTML5播放器？

我注意到有一个og：type的soundcloud：sound，那么它是某种白名单/ Facebook应用场景？

自己尝试一下：

• OG调试： https：/ /developers.facebook.com/tools/debug/og/object?q=https%3A%2F%2Fsoundcloud.com%2Fsystek_music%2Fcyberoptics-sub-antix-the%3Futm_source%3Dsoundcloud%26utm_campaign%3Dshare%26utm_medium%3Dfacebook

我在SoundCloud网站上找到了一些关于他们如何切换到JS播放器的信息旧版浏览器上的Flash）： http： //help.soundcloud.com/customer/portal/articles/1219149-where-has-the-flash-widget-gone-

解决方案

这可能只是部分答案。但是，存在一个特殊的 Facebook Open Graph Music 程序，该程序仅适用于白名单的合作伙伴这次。这包括一个桥梁，其目标是启用Feed故事上的播放按钮Facebook.com可以播放和暂停曲目并指出正在播放的内容。

但是，显然，你可以同时包含Flash（ application / x-shockwave-flash ）和HTML5视频（ video / mp4 ）格式在 og：video：type property。 p>

Here's the scenario I'm seeing -

• You click to post a sound from SoundCloud to Facebook
• It embeds a player in the post that can either be clicked on to take you to the original item on SoundCloud OR you can click a Play icon to play the sound right in your feed.
• The player is a Javascript/HTML5 player (which you can see by viewing source) HOWEVER if you take the embedded URL and put it in the Facebook open graph debugger you'll see that it appears to be directing to embed a Flash SWF

How is SoundCloud doing, what appears to be, some kind of redirect trick to get a "og:video" SWF to turn into a JS/HTML5 player?

I notice that there is an "og:type" of "soundcloud:sound" so is it some kind of whitelist/Facebook application scenario?

Try it yourself with this:

• OG debug: https://developers.facebook.com/tools/debug/og/object?q=https%3A%2F%2Fsoundcloud.com%2Fsystek_music%2Fcyberoptics-sub-antix-the%3Futm_source%3Dsoundcloud%26utm_campaign%3Dshare%26utm_medium%3Dfacebook

I did find this bit of info from the SoundCloud site about how they've switched to JS players (that fall back to Flash on older browsers): http://help.soundcloud.com/customer/portal/articles/1219149-where-has-the-flash-widget-gone-

解决方案

This may only be a partial answer. But there exists a special Facebook Open Graph Music program which "is only available to whitelisted partners at this time". This includes a bridge which has the goal to "enable play buttons on feed stories on Facebook.com that can play and pause tracks and indicate which is playing."

However, apparently you can include both Flash (application/x-shockwave-flash) and HTML5 video (video/mp4) formats in the og:video:type property.

这篇关于SoundCloud如何在Facebook上嵌入HTML5 / JS小部件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！