如何開發動態改變og：image facebook屬性的網站？

基本上，我正在製作一個具有動態og：圖像屬性的網站。我已經添加了100個圖像，並通過PHP中的rand函數更改圖像。我得到的問題是Facebook緩存了我的網站，每次用戶共享URL，它每次都顯示相同的圖像。我希望Facebook每次張貼鏈接時都會重新抓取並顯示隨機圖片。如何開發動態改變og：image facebook屬性的網站？

這是我開發的頁面的代碼：

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> 
     <meta name="viewport" content="initial-scale=1, maximum-scale=1"> 
     <meta name="twitter:card" value="summary"> 

     <meta property="fb:app_id" content="xxxxxxxxxxxxx10" /> 
     <meta property="og:description" content="Like it? Share with friends... "/> 
     <meta property="og:title" content="Your future company is" /> 
     <meta property="og:type" content="article" /> 
     <meta property="og:url" content="http://justtodo.xyz/company/" /> 
     <?php 
      $imageURL = 'http://justtodo.xyz/company/images/' . rand(1, 100) . '_260x135.jpg'; 
     ?> 
     <meta property="og:image" content="<?php echo($imageURL)?>" /> 
     <meta property="og:image:type" content="image/jpeg" /> 
     <meta property="og:image:width" content="200" /> 
     <meta property="og:image:height" content="200" /> 


    <script> 
     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ 
     (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), 
     m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) 
     })(window,document,'script','https://www.google-analytics.com/analytics.js','ga'); 

     ga('create', 'UA-100487432-1', 'auto'); 
     ga('send', 'pageview'); 

    </script> 

    <script src="https://code.jquery.com/jquery-1.7.1.min.js" integrity="sha256-iBcUE/x23aI6syuqF7EeT/+JFBxjPs5zeFJEXxumwb0=" crossorigin="anonymous"></script> 

    <script> 




    window.fbAsyncInit = function() { 
     FB.init({ 
      appId   : 'xxxxxxxxxxxxx10', 
      autoLogAppEvents : true, 
      xfbml   : true, 
      version   : 'v2.9' 
     }); 
     FB.AppEvents.logPageView(); 
     }; 

     (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')); 

     FB.api('https://graph.facebook.com/', 'post', { 
      id: '<?php echo($imageURL)?>', 
      scrape: true 
     }, function(response) { 
      //console.log('rescrape!',response); 
     }); 
    </script> 

    <title>Your future company...</title> 


    <META HTTP-EQUIV="REFRESH" CONTENT="0; URL=https://youtu.be/uqJNjb-zg3s"> 
    <script> 
    setTimeout(function() {  
    window.location.href = "https://youtu.be/uqJNjb-zg3s"; 
    },10); 
    </script> 



    </head> 
<body> 


    <div style="text-align: center;font-size:2em;font-family:Consolas, Andale Mono, Lucida Console,Lucida Sans Typewriter, Monaco, Courier New, monospace">Loading your company...</div> 
</body> 
</html>

來源

2017-06-05 Jashan Preet Singh

分享一個唯一的URL而不是相同的URL – WizKid

你只有100張圖片？我已經有500多個，我也想知道你是如何做到的。這個「Facebook評論遊戲」已經變成了發燒。那麼，據我研究，有3種方法來更改Facebook緩存圖像。 1.）Facebook每24小時自動搜索一幅新圖片（這對我們來說並不有用）。 2.）使用https://developers.facebook.com/tools/debug/（我認爲我們可以用「再次提取」按鈕進行無限循環，但我不知道如何做到這一點，除此之外，這隻適用於我們在瀏覽器中打開網站時）。 3）你可以用這個AJAX代碼要求更新：

Var fbxhr = new XMLHttpRequest(); 
fbxhr.open ("POST", "https://graph.facebook.com", true); 
fbxhr.setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); 
fbxhr.send ("id = http: //you_site.com/&scrape=true");

這段JavaScript代碼加上此標記：

<Meta http-equiv = "refresh" content = "0"/>

而與此PHP代碼：

<Meta property = "og: image" content = "<? Php echo 'http://your_site.com/'.mt_rand(1,100).'.jpg';?>"/>

這個原因該頁面每0秒更新一次，並接收一個新的隨機圖像，可以從「1.jpg」命名爲「100.jpg」。然後通過AJAX請求更新圖像。您也可以在Javascript本身內部執行循環，但是您必須讓PHP在循環內被調用。我只是還沒有測試過。

我的問題是：這隻有當我的網站在瀏覽器中打開無限刷新時纔有效。

編輯：這篇文章的回覆是在06/03/2017這個遊戲開始出現的同一天。只有我不瞭解Python的任何內容。你能告訴我如何把Python放入我的HTML嗎？

鏈接：Dynamic Image for Facebook Opengraph og:image meta tag

來源

2017-06-07 02:04:55

如何開發動態改變og：image facebook屬性的網站？

回答

相關問題