Facebook的開放圖嵌入視頻問題

我在我的網站上的其中一個網頁上有一個Facebook分享按鈕，這個分享按鈕用於分享我的網站上的另一個頁面。除了分享網站之外，我唯一不想做的特定任務是包含一個嵌入的Vimeo視頻，該視頻也位於該特定頁面上。因此，有一個Facebook共享文章，鏈接到我的特定頁面，但也有一個視頻播放。到目前爲止，我在這個過程中已經走得很遠了，現在我的問題是共享帖子看起來有正確的標題，描述，圖像和視頻，但是當按下Facebook帖子上的「播放」按鈕時。它開始緩衝，並且具有正確的長度和正確的Vimeo標題，但它只是保持緩衝，並且從不實際播放。Facebook的開放圖嵌入視頻問題

如果我想說什麼是錯的，我調查它是Flash播放器鏈接，這是錯誤的，但我無法弄清楚視頻的Vimeo Flash播放器鏈接的位置。目前我的代碼如下所示。

在頁面我不想分享我有以下「打開圖」標籤。

<meta property="og:title" content="Test title" /> 
    <meta property="og:type" content="movie" /> 
    <meta property="og:url" content="http://website.com/siteNum1.html" /> 
    <meta property="og:description" content="Test description" /> 

    <meta property="og:image" content="https://i.vimeocdn.com/filter/specialThumbnailImage.png"/> 
    <meta property="og:video" content="https://vimeo.com/moogaloop.swf?clip_id=specialID" /> 
    <meta property="og:video:type" content="application/x-shockwave-flash" /> 
    <meta property="og:video:width" content="640" /> 
    <meta property="og:video:height" content="360" /> 

    <meta property="og:video" content="https://player.vimeo.com/video/specialID?autoplay=1&title=0&byline=0&portrait=0" /> 
    <meta property="og:video:type" content="video/mp4"/> 
    <meta property="og:video:width" content="640" /> 
    <meta property="og:video:height" content="360" />

在頁面上，我有共享按鈕，它集成在下面。

<div id="fb-root"></div> 
<script>(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#xfbml=1&version=v2.9"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));</script> 

<div class="col-lg-4"> 
       <div class="faceBkShare"> 
        <h3>Share on Facebook</h3> 
        <img src="fbPost1.png" alt="fb post inspiration" class="img-responsive center-block"> 
        <p>Some text</p> 
        <div class="fb-share-button" data-href="http://website.com/siteNum1.html" data-layout="button" data-size="large" data-mobile-iframe="true"> 
        </div> 
       </div> 
      </div>

我畫的靈感來自以下question/answer

來源

2017-07-31 Sm00rf9000

您使用的兩個「視頻」網址都會返回HTML文檔 - 不是您聲明的Flash或mp4。 – CBroe

@CBroe我明白了，但我不完全確定如何包含Vimeo視頻，因爲我無法找到Flash鏈接。我可以在其他答案中看到他們有一些特定的Flash網絡播放器鏈接，其中我無法找到我上傳的Vimeo視頻。 – Sm00rf9000

我想通了，Vimeo的有必要環節，他們都試圖分享視頻時，你需要打開的圖形標記的一個例子，讓它鏈接到你的網站。 This is that link

使用此鏈接下面的代碼是我結束了。

<meta property="og:site_name" content="My sites name"> 
<meta property="og:url" content="http://website.com/siteNum1.html"> 
<meta property="og:type" content="video"> 
<meta property="og:title" content="Title of site/video"> 
<meta property="og:description" content="the description"> 
<meta property="og:image" content="https://longlinkforthumbnailimage.png"> 
<meta property="og:image:secure_url" content="https://longlinkforthumbnailimage.png"> 
<meta property="og:image:type" content="image/png"> 
<meta property="og:image:width" content="1280"> 
<meta property="og:image:height" content="720"> 
<meta property="og:video:url" content="https://player.vimeo.com/video/SpecialID?autoplay=1"> 
<meta property="og:video:secure_url" content="https://player.vimeo.com/video/SpecialID?autoplay=1"> 
<meta property="og:video:type" content="text/html"> 
<meta property="og:video:width" content="1280"> 
<meta property="og:video:height" content="720"> 
<meta property="og:video:url" content="https://vimeo.com/moogaloop.swf?clip_id=SpecialID&amp;autoplay=1"> 
<meta property="og:video:secure_url" content="https://vimeo.com/moogaloop.swf?clip_id=SpecialID&amp;autoplay=1"> 
<meta property="og:video:type" content="application/x-shockwave-flash"> 
<meta property="og:video:width" content="1280"> 
<meta property="og:video:height" content="720">

我希望這會有所幫助，如果任何人有和我一樣的問題。

來源

2017-08-02 23:24:40 Sm00rf9000

Facebook的開放圖嵌入視頻問題

回答

相關問題