日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 >

目前可用的微博秀的嵌入方法大全(亲测2019年2月仍有效)

發布時間:2025/6/17 57 豆豆
生活随笔 收集整理的這篇文章主要介紹了 目前可用的微博秀的嵌入方法大全(亲测2019年2月仍有效) 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

當今最全面可用的微博分享組件嵌入方法(親測2019年2月仍有效)

最近一直在找一種目前可用的微博分享組件的使用方法,發現有3個大坑:

  • 向網頁嵌入微博秀時,需要的uid簡單,但需要的verifier值有點難獲取,原因在于原生成微博秀頁面的 url 及其子鏈接均會被強制從http重定向跳轉到https,此外其response中部分css引用失敗導致頁面無法完整顯示;
  • https頁面是沒法調用http下的js和css的;
  • 微博秀是需要用iframe來嵌入的,博客園默認不支持iframe標簽,可通過構造字符串的方式添加iframe來解決,也可以直接用embed標簽替換掉iframe。
  • 對于微博第5版(weibo v5),其相應的微博組件的網址為: https://open.weibo.com/widgets ,
    及其具體使用方法為: 微博秀-新浪微博JSSDK官方網站,而對于微博第4版(weibo v4),相應的微博組件的網址為: http://app.weibo.com/tool ,相比之下第5版的組件中丟失了第4版中很重要的"微博秀"組件.

    下面來介紹我解決向博客園中成功嵌入微博秀且在http/https下均能顯示的方法:
    1.獲取微博秀的參數uid和verifier
    使用Chrome打開微博登錄頁面 https://weibo.com, 然后打開微博秀頁面 https://app.weibo.com/tool/we... ,接下來按F12,點擊開發者工具導航欄中的Source。

    選擇灰色的那個點開,就可以看到相應的html代碼:

    然后另存為weiboshow.html放在本地,

    最后修改代碼中光標處的https為http,接著使用Chrome瀏覽器打開本地的weiboshow.html,此時在左下角的框框中已出現uid和verifier。

    事實上不保存為本地的html文件也行,在第2張圖對應的html代碼中分別搜索"$uid", "$CONFIG.$checkKey",取出=右邊的值,即可知uid='2606405674'和verifier='d5cf5ffc'。

    2.對于第2個問題,為使得微博秀既能在http 和https形式(分別對應于https://www.cnblogs.com/enjoy233 和 http://www.cnblogs.com/enjoy2...,方法也很簡單。
    將從網頁左下角復制到的代碼中的src="http://" 改為src="//" 即可。

    3.解決問題3目前已知如下3種方法(以上述截圖上微博的uid=2606405674&verifier=d5cf5ffc為例):
    a.復制左下角的代碼,在其基礎上 將iframe改為embed,刪除 frameborder="0",貼進公告即可,
    相應代碼為:

    <embed width="100%" height="550" class="share_self" 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"></embed>

    b.使用html5的另一個標簽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去動態拼接iframe,相應代碼為:

    <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>

    將其貼進公告即可。

    d.將微博v5的版本應用到微博秀上,直接使用微博官方提供的wb.js來解決,該方法微博v5的組件接口中"贊同"就是類似的(參看網頁
    https://open.weibo.com/widget... 末尾)。

    <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><wb:show uid="2606405674" width="850" verifier="d5cf5ffc"></wb:show>

    最后一步還是將其貼進公告。
    親測可知,后面這種官方推薦的方法在移動端也能正常顯示,但iframe有些瀏覽器(比如: iPhone自帶的Safari就不顯示)不支持。

    ps: 點贊按鈕的相應代碼為:

    <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換為自己微博的相應值即可。

    如果偶爾出現如下問題,是正常的,刷新一下就可以解決,原因是微博官方的API有時會出故障。

    好啦,此時所以的問題都解決了,希望對君有用。至于豆瓣秀就很簡單了,打開豆瓣收藏秀 https://www.douban.com/servic...,將相應的js貼到公告中即可(同樣需要src="http://" 改為src="//")。

    關于微博API,今天還學到一招 - 微博未登陸時重定向提醒用戶登錄:
    https://passport.weibo.cn/sig...
    手機版passport.weibo.cn與PC版passport.weibo.com共用cookie喔~

    原創不易,記得支持一下喔~
    <br/>

    本文首發于本人博客園博客:https://www.cnblogs.com/enjoy....

    總結

    以上是生活随笔為你收集整理的目前可用的微博秀的嵌入方法大全(亲测2019年2月仍有效)的全部內容,希望文章能夠幫你解決所遇到的問題。

    如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。