【问题标题】:how to enable sound when autoplay is set in facebook embedded video?在 facebook 嵌入式视频中设置自动播放时如何启用声音?
【发布时间】:2015-09-15 11:07:30
【问题描述】:

我在我的网站中嵌入了来自 facebook 的视频,并将其设置为自动播放,但声音是静音的,除非你点击音量,它会播放声音。

【问题讨论】:

  • 从用户的角度来看,这似乎是一件好事。如果在后台选项卡中打开的页面开始在没有询问的情况下用声音纠缠他们,很多人会感到恼火。

标签: facebook audio video


【解决方案1】:

只需将&mute=0 添加到 iframe 网址即可。

<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2F.....&height=280&mute=0" width="500" height="280" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>

【讨论】:

  • 将 autoplay=1 添加到 url 时不起作用。
【解决方案2】:

您实际上可以使用Facebook Embedded Video Player API 来控制您网站中嵌入的视频,例如在页面加载时取消静音。

请注意,这不适用于通过 &lt;iframe&gt; 标签嵌入视频。使用链接中提到的&lt;div&gt; 标签(或参见下面的示例)。

这是我从链接中获得的示例脚本,在 xfbml.ready 事件中插入了 my_video_player.unmute()。确保提供正确的FB appId

<html>
<head>
  <title>Your Website Title</title>
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
      FB.init({
        appId      : '{your-app-id}',
        xfbml      : true,
        version    : 'v2.5'
      });

      // Get Embedded Video Player API Instance
      var my_video_player;
      FB.Event.subscribe('xfbml.ready', function(msg) {
        if (msg.type === 'video') {
          my_video_player = msg.instance;
          my_video_player.unmute();
        }
      });
    };

    (function(d, s, id){
       var js, fjs = d.getElementsByTagName(s)[0];
       if (d.getElementById(id)) {return;}
       js = d.createElement(s); js.id = id;
       js.src = "//connect.facebook.net/en_US/sdk.js";
       fjs.parentNode.insertBefore(js, fjs);
     }(document, 'script', 'facebook-jssdk'));
  </script>

  <!-- Your embedded video player code -->
  <div  
    class="fb-video" 
    data-href="https://www.facebook.com/facebook/videos/10153231379946729/" 
    data-width="500" 
    data-autoplay="true"
    data-allowfullscreen="true"></div>

</body>
</html>

【讨论】:

  • 直播视频不会触发“xfbml.ready”,这意味着我们无法访问视频播放器实例。
猜你喜欢
  • 2017-09-30
  • 1970-01-01
  • 1970-01-01
  • 2021-09-11
  • 1970-01-01
  • 1970-01-01
  • 2019-06-12
  • 2018-12-16
  • 2023-03-31
相关资源
最近更新 更多