微信分享到朋友圈的腳本奧祕(轉)

微信最近推出的一個社交工具網站 www.faxinxi.la ，能發投票、活動、文章。

但在微信外的瀏覽器包括PC端和移動端的都沒法瀏覽這個網站任何內容，那是經過什麼來控制的呢？經過微信內輸出特定JS接口不太可能，那就只能經過Header信息裏的User-agent了，實驗後證明沒錯，經過探測能夠知道微信內的User-agent信息：

Mozilla/5.0 (iPhone; CPU iPhone OS 6_1_3 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Mobile/10B329 MicroMessenger/5.0.1

就是經過識別MicroMessenger這個關鍵字來肯定是否來自微信，經過瀏覽器的user-agent插件就能夠輕鬆繞過這個限制。

接下來就能夠輕鬆得到www.faxinxi.la的網頁源碼，其實這不是一個微信官方的應用，服務端是用ASP.NET寫的，並且是IIS服務器，有沒有注入漏洞就不知道了，不過注入了也沒什麼實際價值，呵呵。

爲何要挖掘他的網頁源碼呢，這纔是關鍵。譬如你發一個投票，網址是http://www.faxinxila.com/post/vote， 但你填完全部信息按提交後，網頁地址並無發生跳轉，而是ajax提交信息後彈出一個遮罩層，提示你點右上角的分享按鈕，注意，點分享前網址一直保持在 /post/vote路徑，但點開分享裏的信息已經發生了變化，分享出去後，網址也發生了變化，變成了/vote/3投票實際的展現路徑。 這是怎麼作到的呢？

查看faxinxi裏惟一js文件，你會發現一個WeixinJSBridge的輸出對象，再對比下經過微信公衆平臺發出來的文章源文件，也有 WeixinJSBridge對象腳本，問題迎刃而解，微信在內嵌webview裏輸出了WeixinJSBridge對象供web端js調用。 faxinxi已經將有用的js提取出來了，詳細腳本以下：

var dataForWeixin={
   appId:"",
   MsgImg:"http://img1.faxinxila.net/images/share_msg.png",
   TLImg:"http://img1.faxinxila.net/images/share.png",
   url:"http://faxinxi.la/vote/1",
   title:"input title here",
   desc:"input description here",
   fakeid:"",
   callback:function(){}
};
(function(){
   var onBridgeReady=function(){
   WeixinJSBridge.on('menu:share:appmessage', function(argv){
      WeixinJSBridge.invoke('sendAppMessage',{
         "appid":dataForWeixin.appId,
         "img_url":dataForWeixin.MsgImg,
         "img_width":"120",
         "img_height":"120",
         "link":dataForWeixin.url,
         "desc":dataForWeixin.desc,
         "title":dataForWeixin.title
      }, function(res){(dataForWeixin.callback)();});
   });
   WeixinJSBridge.on('menu:share:timeline', function(argv){
      (dataForWeixin.callback)();
      WeixinJSBridge.invoke('shareTimeline',{
         "img_url":dataForWeixin.TLImg,
         "img_width":"120",
         "img_height":"120",
         "link":dataForWeixin.url,
         "desc":dataForWeixin.desc,
         "title":dataForWeixin.title
      }, function(res){});
   });
   WeixinJSBridge.on('menu:share:weibo', function(argv){
      WeixinJSBridge.invoke('shareWeibo',{
         "content":dataForWeixin.title,
         "url":dataForWeixin.url
      }, function(res){(dataForWeixin.callback)();});
   });
   WeixinJSBridge.on('menu:share:facebook', function(argv){
      (dataForWeixin.callback)();
      WeixinJSBridge.invoke('shareFB',{
         "img_url":dataForWeixin.TLImg,
         "img_width":"120",
         "img_height":"120",
         "link":dataForWeixin.url,
         "desc":dataForWeixin.desc,
         "title":dataForWeixin.title
      }, function(res){});
   });
};
if(document.addEventListener){
   document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
}else if(document.attachEvent){
   document.attachEvent('WeixinJSBridgeReady'   , onBridgeReady);
   document.attachEvent('onWeixinJSBridgeReady' , onBridgeReady);
}
})();

 轉至：http://blog.4wer.com/wechat-timeline-share