最近公司有個需求需要把網頁分享到facebook,順帶寫一篇文章記錄一下吧
首先,當然得申請一個facebook應用啦,在這裡申請一個應用:"https://developers.facebook.com/apps/"
其中一些前置要求:
1.伺服器要在境外或能翻牆,這臺伺服器需要能訪問facebook,(如果不用facebook-sdk自動生成分享按鈕的也可以不需要)
2.應用申請,網站需要是https的
現在開始寫程式碼:
在html程式碼上需要加上
<meta property="fb:app_id" content="應用appid"/>
<meta property="og:url" content="需要分享的網頁地址" />
<meta property="og:type" content="article" /><!--article不變,還有其他方式請參考facebook文件--->
<meta property="og:title" content="標題" />
<meta property="og:description" content="內容" />
<meta property="og:image" content="圖片地址" />生成facebook按鈕的第一種方式:
facebook分享的文件在:"https://developers.facebook.com/docs/plugi..."
可以參考文件獲取分享按鈕,把js程式碼和按鈕程式碼複製過來用就可以了,要求是網站伺服器能訪問到facebook,不然生成不了按鈕樣式;
<div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count" data-size="small" data-mobile-iframe="true"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=你的分享地址,需要urlencode" class="fb-xfbml-parse-ignore">分享</a></div>生成facebook按鈕的第二種方式:
facebook按鈕樣式可以自己寫,這樣可以不需要獲取facebook的js程式碼,有mate部分的內容就可以了
例如:
<a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=你要分享的網站地址" >
分享到facebook
</a>最後測試
在分享偵錯程式下"https://developers.facebook.com/tools/debu..." 輸入你的要分享的網址,在輸入框下方沒有看到有警告提示性的內容,說明可以分享成功,有警告的話,根據警告的資訊再做修改.最終分享出去的是有標題有圖片的內容.
就這樣吧,寫的不好請見諒
本作品採用《CC 協議》，轉載必須註明作者和本文連結