目前可用的微博秀的嵌入方法大全(亲测2019年2月仍有效)
當(dāng)今最全面可用的微博分享組件嵌入方法(親測2019年2月仍有效)
最近一直在找一種目前可用的微博分享組件的使用方法，發(fā)現(xiàn)有3個大坑：
對于微博第5版(weibo v5)，其相應(yīng)的微博組件的網(wǎng)址為: https://open.weibo.com/widgets ,
及其具體使用方法為： 微博秀-新浪微博JSSDK官方網(wǎng)站，而對于微博第4版(weibo v4)，相應(yīng)的微博組件的網(wǎng)址為: http://app.weibo.com/tool ，相比之下第5版的組件中丟失了第4版中很重要的"微博秀"組件.
下面來介紹我解決向博客園中成功嵌入微博秀且在http/https下均能顯示的方法：
1.獲取微博秀的參數(shù)uid和verifier
使用Chrome打開微博登錄頁面 https://weibo.com， 然后打開微博秀頁面 https://app.weibo.com/tool/we... ，接下來按F12，點擊開發(fā)者工具導(dǎo)航欄中的Source。
選擇灰色的那個點開，就可以看到相應(yīng)的html代碼：
然后另存為weiboshow.html放在本地，
最后修改代碼中光標(biāo)處的https為http，接著使用Chrome瀏覽器打開本地的weiboshow.html，此時在左下角的框框中已出現(xiàn)uid和verifier。
事實上不保存為本地的html文件也行，在第2張圖對應(yīng)的html代碼中分別搜索"$uid", "$CONFIG.$checkKey"，取出=右邊的值，即可知uid='2606405674'和verifier='d5cf5ffc'。
2.對于第2個問題，為使得微博秀既能在http 和https形式(分別對應(yīng)于https://www.cnblogs.com/enjoy233 和 http://www.cnblogs.com/enjoy2...，方法也很簡單。
將從網(wǎng)頁左下角復(fù)制到的代碼中的src="http://" 改為src="//" 即可。
3.解決問題3目前已知如下3種方法(以上述截圖上微博的uid=2606405674&verifier=d5cf5ffc為例)：
a.復(fù)制左下角的代碼，在其基礎(chǔ)上 將iframe改為embed，刪除 frameborder="0"，貼進(jìn)公告即可，
相應(yīng)代碼為:
b.使用html5的另一個標(biāo)簽object.
<object data="//widget.weibo.com/weiboshow/index.php?language=&width=0&height=550&fansRow=2&ptype=1&speed=0&skin=1&isTitle=1&noborder=1&isWeibo=1&isFans=1&uid=1763628267&verifier=a1171a80&dpc=1" width="100%" height="550" type="text/html">Embedded data failed to be displayed. </object>目前本人博客正是使用這種方法，在移動端也能正常顯示~
c.使用JavaScript去動態(tài)拼接iframe，相應(yīng)代碼為:
<div id="weiboshow"> <script type="text/javascript"> var weibocode = '<if' weibocode += 'rame width="100%" height="550" class="share_self" frameborder="0" scrolling="no" src="//widget.weibo.com/weiboshow/index.php?language=&width=0&height=550&fansRow=2&ptype=1&speed=0&skin=1&isTitle=1&noborder=1&isWeibo=1&isFans=1&uid=2606405674&verifier=d5cf5ffc&dpc=1"></iframe>'; document.getElementById('weiboshow').innerHTML = weibocode; </script> </div>將其貼進(jìn)公告即可。
d.將微博v5的版本應(yīng)用到微博秀上，直接使用微博官方提供的wb.js來解決，該方法微博v5的組件接口中"贊同"就是類似的(參看網(wǎng)頁
https://open.weibo.com/widget... 末尾)。
最后一步還是將其貼進(jìn)公告。
親測可知，后面這種官方推薦的方法在移動端也能正常顯示，但iframe有些瀏覽器(比如: iPhone自帶的Safari就不顯示)不支持。
ps: 點贊按鈕的相應(yīng)代碼為:
<html xmlns:wb="//open.weibo.com/wb"> <script src="//tjs.sjs.sinajs.cn/open/api/js/wb.js" type="text/javascript" charset="utf-8"></script><div> <wb:follow-button uid="1763628267" type="red_3" width="100%" height="90"></wb:follow-button> </div>對于上述幾種方法，讀者只需將uid=2606405674&verifier=d5cf5ffc換為自己微博的相應(yīng)值即可。
如果偶爾出現(xiàn)如下問題，是正常的，刷新一下就可以解決，原因是微博官方的API有時會出故障。
好啦，此時所以的問題都解決了，希望對君有用。至于豆瓣秀就很簡單了，打開豆瓣收藏秀 https://www.douban.com/servic...，將相應(yīng)的js貼到公告中即可(同樣需要src="http://" 改為src="//")。
關(guān)于微博API，今天還學(xué)到一招 - 微博未登陸時重定向提醒用戶登錄：
https://passport.weibo.cn/sig...
手機(jī)版passport.weibo.cn與PC版passport.weibo.com共用cookie喔~
原創(chuàng)不易，記得支持一下喔~
<br/>
本文首發(fā)于本人博客園博客：https://www.cnblogs.com/enjoy....
總結(jié)
以上是生活随笔為你收集整理的目前可用的微博秀的嵌入方法大全(亲测2019年2月仍有效)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 家庭记账本3
- 下一篇： runc容器逃逸漏洞最强后续：应对之策汇