微信JSAPI模式與瀏覽器類型安全訪問(wèn)

摘要： 微信瀏覽器是在微信安裝時(shí)內(nèi)置在微信中的，針對(duì)瀏覽器的類型我們可以設(shè)置相應(yīng)的安全策略——僅允許在微信內(nèi)置瀏覽器中打開(kāi)。本文選自《微信企業(yè)號(hào)開(kāi)發(fā)完全自學(xué)手冊(cè)》。

1 JSAPI模式介紹

　　在介紹JSAPI模式之前，首先需要介紹一下微信內(nèi)置瀏覽器?？赡芎芏嗳俗⒁獾搅?，在打開(kāi)微信“朋友圈”鏈接的時(shí)候會(huì)出現(xiàn)進(jìn)度條，如圖5.1所示，這實(shí)際上就是微信內(nèi)置瀏覽器訪問(wèn)頁(yè)面的進(jìn)度。也就是說(shuō)，“朋友圈”是通過(guò)微信內(nèi)置的瀏覽器訪問(wèn)的手機(jī)頁(yè)面，并且微信瀏覽器是在微信安裝時(shí)內(nèi)置在微信中的。
　　　　　　　　　　
　　　　　　　　　　　　　　　　　　　　微信內(nèi)置瀏覽器進(jìn)度條

注意：iPhone（蘋果）和Android（安卓）的微信內(nèi)置瀏覽器不同，安卓手機(jī)上的微信使用的是QQ瀏覽器X5內(nèi)核，蘋果手機(jī)上的微信使用的則是Safari瀏覽器。

　　JSAPI模式是通過(guò)調(diào)用微信JS-SDK開(kāi)發(fā)手機(jī)Web頁(yè)面的模式，本質(zhì)上亦是開(kāi)發(fā)B/S（Browser/Server，瀏覽器/服務(wù)器模式）服務(wù)，只是業(yè)務(wù)上較以往的PC業(yè)務(wù)更加方便，功能上也稍具差異。在微信JSAPI模式下，不僅可以調(diào)用微信拍照、選圖、語(yǔ)音、位置等手機(jī)功能，還可以實(shí)現(xiàn)微信分享、掃一掃等微信特有的功能，同時(shí)，可以使用HTML5完成頁(yè)面效果的豐富，實(shí)現(xiàn)更加完美的用戶體驗(yàn)。

2 瀏覽器類型安全訪問(wèn)

　　針對(duì)瀏覽器的類型我們可以設(shè)置相應(yīng)的安全策略—僅允許在微信內(nèi)置瀏覽器中打開(kāi)。
　　通過(guò)ServletActionContext.getRequest().getHeader("User-Agent")獲得當(dāng)前瀏覽器代理信息，各類型瀏覽器代理信息如下：
（1）IE瀏覽器：

Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Win64; x64; Trident/5.0)

（2）Google瀏覽器：

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.93 Safari/537.36

（3）360安全瀏覽器：

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36

（4）UC瀏覽器：

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 UBrowser/5.7.15319.202 Safari/537.36

（5）手機(jī)QQ瀏覽器：

Mozilla/5.0 (Linux; Android 4.2.2; N1W Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/37.0.0.0 Mobile MQQBrowser/6.2 TBS/036558 Safari/537.36 V1_AND_SQ_6.5.0_390_YYB_D QQ/6.5.0.2835 NetType/WIFI WebP/0.3.0 Pixel/1080

（6）Android微信內(nèi)置瀏覽器：

Mozilla/5.0 (Linux; Android 4.2.2; N1W Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/37.0.0.0 Mobile MQQBrowser/6.2 TBS/036558 Safari/537.36 MicroMessenger/6.3.23.840 NetType/WIFI Language/zh_CN

（7）iPhone微信內(nèi)置瀏覽器：

Mozilla/5.0 (iPhone; CPU iPhone OS 9_3_5 like Mac OS X) AppleWebKit/601.1.46 (KHTML, like Gecko) Mobile/13G36 MicroMessenger/6.3.24 NetType/4G Language/zh_CN

　　通過(guò)對(duì)比多個(gè)瀏覽器的代理信息，可以發(fā)現(xiàn)一個(gè)關(guān)鍵信息“MicroMessenger”。通過(guò)“MicroMessenger”便能夠區(qū)分請(qǐng)求的來(lái)源，從而保證信息只能在微信中打開(kāi)，示例代碼如下：

    HttpServletRequest req = ServletActionContext.getRequest();    //識(shí)別微信瀏覽器
    String userAgent=req.getHeader("User-Agent");//里面包含了設(shè)備類型
    if(-1==userAgent.indexOf("MicroMessenger")){        //如果不是微信瀏覽器,則跳轉(zhuǎn)到安全頁(yè)
        return "safePage";
    }

　　JSP頁(yè)面中，防止外部瀏覽器打開(kāi)方法的示例代碼如下：

<%
    //識(shí)別微信瀏覽器    String userAgent=request.getHeader("User-Agent");//里面包含了設(shè)備類型    if(-1==userAgent.indexOf("MicroMessenger")){
        //如果不是微信瀏覽器,則跳轉(zhuǎn)到安全頁(yè)        request.getRequestDispatcher("noRightPage.jsp").forward(request, response);
    }
%>

　　備注：在微信中，可以通過(guò)userAgent.indexOf("iPhone")來(lái)區(qū)分是Android手機(jī)還是iPhone手機(jī)，示例代碼如下：

HttpServletRequest req = ServletActionContext.getRequest();String userAgent=req.getHeader("User-Agent");//里面包含了設(shè)備類型if(-1!=userAgent.indexOf("iPhone")){//-------如果是蘋果手機(jī)----------////此方法需要瀏覽器自己能夠打開(kāi)，iOS可以，但是微信Android版內(nèi)置瀏覽器不支持}else{//如果非蘋果手機(jī)，則自己處理文檔}

　　本文選自《微信企業(yè)號(hào)開(kāi)發(fā)完全自學(xué)手冊(cè)》，點(diǎn)此鏈接可在博文視點(diǎn)官網(wǎng)查看此書(shū)。
　　　　　　　　　　　　　　　　　　　　
　　想及時(shí)獲得更多精彩文章，可在微信中搜索“博文視點(diǎn)”或者掃描下方二維碼并關(guān)注。