javascript - Facebook 嵌入视频播放器 api 不会在本地 html 文件中渲染 iframe 视频输出

标签 javascript facebook facebook-javascript-sdk video-player

您好,当我复制 fb 嵌入播放器示例代码并粘贴到本地 html 文件中时,视频未呈现。当我在 w3 学校等一些在线 html 编辑器中尝试它时,它工作得很好。其背后的原因是什么? html代码如下:

<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;
        }
      });
    };

    (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 = "https://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-allowfullscreen="true"></div>

</body>
</html>

最佳答案

为什么不直接使用 Facebook 中的嵌入视频代码?

<iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Ffacebook%2Fvideos%2F10153231379946729%2F&show_text=0&width=560" width="560" height="315" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allowFullScreen="true"></iframe>

这也是我本地 html 页面截图上的相同代码: enter image description here

关于javascript - Facebook 嵌入视频播放器 api 不会在本地 html 文件中渲染 iframe 视频输出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52584851/

相关文章:

javascript - 在纯 Javascript 中创建 Canvas /位图(无 html)

javascript - 使用 Javascript SDK Graph API 获取用户的新闻源

facebook - React JS加载FB分享

javascript - 带有 img 的包装器如何占据所有屏幕?

javascript - Bootstrap 折叠菜单链接在移动设备上不起作用

facebook - 使用组别名通过 Graph API 获取组对象?

Facebook 营销 API 速率限制

android - com.facebook.FacebookAuthorizationException : UnknownError: Key hash does not match any stored key hashes

facebook-graph-api - 查询 Facebook Graph API 时如何找出我在最后一页?

javascript - 在 JavaScript 中,是否有一种将数字转换为字符串的解析 JSON 的方法?