分享是為了更好的傳播尝胆，尤其是做業(yè)務(wù)平臺網(wǎng)站的丧裁，傳播是自然的事情，而且要和國際化接軌含衔，就要能分享到Facebook煎娇、Twitter這樣的網(wǎng)站，在中國這片土地上使用最多的就是微信了贪染，所以微信也是一個很好的傳播平臺缓呛，但是自定義標(biāo)題和縮略圖在現(xiàn)在的微信是沒有辦法做到了。
分享到微信
1杭隙、 微信內(nèi)分享
不知有沒有發(fā)現(xiàn)哟绊，自己的網(wǎng)站鏈接有時候分享到微信群中，發(fā)到朋友圈痰憎，右下角的縮略圖沒了票髓。之前以為是沒有集成JSSDK，但做了一個微信公眾號的項目铣耘，集成了JSSDK洽沟，發(fā)現(xiàn)有的頁面按照之前在body的最上方添加一張隱藏的默認(rèn)圖片形式也不行了，只有使用JSSDK中的分享方法涡拘，主動設(shè)置分享icon和標(biāo)題才有作用玲躯。
網(wǎng)上查找才發(fā)現(xiàn)，微信6.5.5版本調(diào)整了分享規(guī)則鳄乏，針對公眾號的網(wǎng)頁分享，必須接入微信認(rèn)證公眾號棘利！
https://mp.weixin.qq.com/s/hAdtKl2i4ilyo9HxT1kXyw
所以沒有接入JSSDK的網(wǎng)站想要在微信中分享自定義標(biāo)題和icon是沒有希望了橱野。
想要在微信中傳播自定義標(biāo)題和縮略圖就要乖乖的集成JSSDK，按照規(guī)則分享吧:)
2善玫、從瀏覽器分享到微信
在瀏覽器打開后水援，點(diǎn)擊瀏覽器自帶的分享圖標(biāo)密强，選擇微信，這種方式獲取縮略圖的方法：
需要在head頭部添加Open Graph Meta Data
<meta property="og:type" content="website" />
<meta property="og:title" content="頁面標(biāo)題">
<meta property="og:description" content="頁面描述">
<meta property="og:image" content="http://www.example.com/img/thumbnail.png">
<meta property="og:url" content="http://www.example.com/">
其中og:image是完整的URL蜗元，最好不要太大或渤，畢竟是縮略圖
親測這種方式可以實(shí)現(xiàn)從手機(jī)瀏覽器分享到微信可定制縮略圖和title。
注意
坑還在后面奕扣，如果分享的自定義的title中包含現(xiàn)金薪鹦、提現(xiàn)、紅包等這類關(guān)鍵字是分享不出去的惯豆，坑啊……所以我們改為繁體字之后就可以了池磁，如果一定要用這類字就先用繁體字代替吧，要不然就換成別的吧楷兽。
分享到 Facebook & Twitter & 微博
web頁面想要分享到Facebook地熄、Twitter和微博，簡單的是需要在按鈕寫個a標(biāo)簽芯杀，將分享鏈接自定義端考，點(diǎn)擊之后就可以跳到一個它們提供的外部分享頁面，分享了揭厚。
web微博分享直接在按鈕上添加個a標(biāo)簽跛梗，直接調(diào)用微博開放出來的分享鏈接就可以了。標(biāo)題和url都可以根據(jù)自己的需求填寫棋弥。
<a target="_blank">Weibo</a>
web頁面分享到Facebook也可以直接使用鏈接跳轉(zhuǎn)核偿。
<a target="_blank">Facebook</a>
但是Facebook自定義title不管用，它自己有抓取目標(biāo)頁面代碼的一套規(guī)則顽染，對html中的<title/>和<meta/>標(biāo)簽進(jìn)行分析漾岳。一般來說<title/>會作為要分享的標(biāo)題，<meta name="description" content="">會作為分享的正文粉寞。這是最基本的兩個抓取點(diǎn)尼荆。
注意：抓取的內(nèi)容是從服務(wù)端返回的html代碼，由js操作后的html抓取不到唧垦。
所以想要Facebook分享能有圖片和頁面的標(biāo)題捅儒，需要提前將meta中的og定義好，注意og:image中圖片（完整url）的尺寸大小振亮，最小不要小于200 x 200px巧还，太小了也抓取不到。還有兩種尺寸的圖片大小坊秸，1200 x 630px 或者 600 x 315 根據(jù)自己的需要生成吧麸祷，而且圖片需要在國外能很好的加載出來，我們使用的是七牛的鏈接褒搔，發(fā)現(xiàn)七牛的圖片鏈接在國外支持的不太好阶牍，有時候會訪問失敗喷面。
Facebook share best practices
如果是簡單的web分享，使用上面的分享鏈接就可以了走孽，F(xiàn)acebook ID也沒有必要去申請惧辈，如果想要在本頁面中彈出彈窗分享鏈接，可以申請個Facebook app創(chuàng)建一個APP ID磕瓷，要求不高一個鏈接完全就可以了盒齿。
沒有抓取到設(shè)計的圖片和標(biāo)題，檢測一下圖片的鏈接和og中設(shè)置title和image對不對生宛，記住js修改的抓取不到哦县昂，其他的應(yīng)該就沒什么問題了
web分享到Twitter，也可以直接使用分享鏈接陷舅，直接放到代碼中就可以了倒彰。
<a target="_blank">Twitter</a>
如果想要使用Twitter分享帶圖片的鏈接，生成Twitter Cards的形式莱睁，需要在meta中添加圖片的大小待讳，官方文檔Twitter cards
<meta name="twitter:card" content="summary"></meta>
同樣cards上的title、描述和圖片也是抓取og中定義的title仰剿、description和image创淡，提前在meta中定義好。
注意
Twitter也是只能抓取服務(wù)端返回的html南吮，后來用js修改的meta抓取不到琳彩。
Facebook分享調(diào)試工具
https://developers.facebook.com/tools/debug/sharing/
微信分享沒縮略圖
注意：在body上添加圖片已經(jīng)失效部凑。
Facebook & Twitter分享meta tag規(guī)則定義
What You Need to Know About Open Graph Meta Tag……
