微信JSAPI模式与浏览器类型安全访问

摘要: 微信浏览器是在微信安装时内置在微信中的,针对浏览器的类型我们可以设置相应的安全策略——仅允许在微信内置浏览器中打开。本文选自《微信企业号开发完全自学手册》。

1 JSAPI模式介绍

  在介绍JSAPI模式之前,首先需要介绍一下微信内置浏览器。可能很多人注意到了,在打开微信“朋友圈”链接的时候会出现进度条,如图5.1所示,这实际上就是微信内置浏览器访问页面的进度。也就是说,“朋友圈”是通过微信内置的浏览器访问的手机页面,并且微信浏览器是在微信安装时内置在微信中的。

          

                    微信内置浏览器进度条

注意:iPhone(苹果)和Android(安卓)的微信内置浏览器不同,安卓手机上的微信使用的是QQ浏览器X5内核,苹果手机上的微信使用的则是Safari浏览器。

  JSAPI模式是通过调用微信JS-SDK开发手机Web页面的模式,本质上亦是开发B/S(Browser/Server,浏览器/服务器模式)服务,只是业务上较以往的PC业务更加方便,功能上也稍具差异。在微信JSAPI模式下,不仅可以调用微信拍照、选图、语音、位置等手机功能,还可以实现微信分享、扫一扫等微信特有的功能,同时,可以使用HTML5完成页面效果的丰富,实现更加完美的用户体验。

2 浏览器类型安全访问

  针对浏览器的类型我们可以设置相应的安全策略—仅允许在微信内置浏览器中打开。

  通过ServletActionContext.getRequest().getHeader("User-Agent")获得当前浏览器代理信息,各类型浏览器代理信息如下:

(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)手机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微信内置浏览器:

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微信内置浏览器:

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

  通过对比多个浏览器的代理信息,可以发现一个关键信息“MicroMessenger”。通过“MicroMessenger”便能够区分请求的来源,从而保证信息只能在微信中打开,示例代码如下:

    HttpServletRequest req = ServletActionContext.getRequest();
    //识别微信浏览器
    String userAgent=req.getHeader("User-Agent");//里面包含了设备类型
    if(-1==userAgent.indexOf("MicroMessenger")){
        //如果不是微信浏览器,则跳转到安全页
        return "safePage";
    }

  JSP页面中,防止外部浏览器打开方法的示例代码如下:

<%
    //识别微信浏览器
    String userAgent=request.getHeader("User-Agent");//里面包含了设备类型
    if(-1==userAgent.indexOf("MicroMessenger")){
        //如果不是微信浏览器,则跳转到安全页
        request.getRequestDispatcher("noRightPage.jsp").forward(request, response);
    }
%>

  备注:在微信中,可以通过userAgent.indexOf("iPhone")来区分是Android手机还是iPhone手机,示例代码如下:

HttpServletRequest req = ServletActionContext.getRequest();
String userAgent=req.getHeader("User-Agent");//里面包含了设备类型
if(-1!=userAgent.indexOf("iPhone")){
//-------如果是苹果手机----------//
//此方法需要浏览器自己能够打开,iOS可以,但是微信Android版内置浏览器不支持
}else{
//如果非苹果手机,则自己处理文档
}

  本文选自《微信企业号开发完全自学手册》,点此链接可在博文视点官网查看此书。

                    

  想及时获得更多精彩文章,可在微信中搜索“博文视点”或者扫描下方二维码并关注。

                       

时间: 2024-12-20 03:20:04

微信JSAPI模式与浏览器类型安全访问的相关文章

微信限制内置浏览器的访问方法

1.通过JS判断微信的独有标识UserAgent,但是对于伪造的UserAgent,还是可以绕过该限制. <script type="text/javascript"> // 对浏览器的UserAgent进行正则匹配,不含有微信独有标识的则为其他浏览器 var useragent = navigator.userAgent; if (useragent.match(/MicroMessenger/i) != 'MicroMessenger') { // 这里警告框会阻塞当前

微信jsApI及微信分享对应在手机浏览器的调用总结。

摘录自别人的博客: 第一篇:微信内置浏览器的JsAPI(WeixinJSBridge续) 之前有写过几篇关于微信内置浏览器(WebView)中特有的Javascript API(Javascript Interface)的文章,不过随着微信官方的调整,部分API已经不能直接使用,比如类似直接分享到朋友圈 WeixinJSBridge.invoke('shareTimeline',data,callback) 这样的功能,直接调用,会得到一个访问拒绝的response.后来重新调研了下,整理出来了

Javascript限制网页只能在微信内置浏览器中访问

转载:http://segmentfault.com/a/1190000000754332 最近正在开发一个微信公众账号,其中有一项功能是用户发送文字消息给公众号,然后公众号返回图文消息给用户,用户再点击图文消息即可跳转到一个网页链接,在微信的内置浏览器中打开.那么问题就来了,这个网页首先涉及到了移动web前端开发,我优先选择了用HTML5+bootstrap组合来实现页面的美观效果,前端其他的任务交给javascript解决(这里我是完全使用原生javascript代码,没有用到任何的框架,因

微信支付JSAPI模式及退款CodeIgniter集成篇

微信支付接口文档:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_1 首先你得知道这个jsapi是不能离开微信进行调用支付的,明白了这个道理我们好下手,页面是在微信内显示并通过jsapi调用微信支付组件进行支付. 可以看看我们上一篇文章,主要是Native扫码支付模式二 我们仍然继续使用wechatpay.php这个支付集成类,简单方便好理解,不过如果应用jsapi的话这个类有个bug 在我们构造jsapi需要的参数时有个时间

微信支付-JSAPI模式开发

之前写了两篇文章都不是关于技术类的,这个号主要还是以分享技术为主,第三篇必须得上技术类的文章,不然会对不起大家的,所以就有了今天的文章. 现在微信支付开发很火,也不是特别难,网上也很多别人整理的教程,也有官方开发文档.主要是每个人在开发的过程中常常会遇到一些不同的小问题,然后怎么去解决这才是最关键的.作为web开发者,尤其是后端开发者,不会微信支付开发的话就真的很low. 最近做了一个在线租车的微信项目,项目其中正好有微信支付这个功能,我在做的过程中也遇到了一些小问题,虽说之前也做过,但之前都没

微信jsapi签名

微信jsapi签名, 1,先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”.这个安全域名不用写到指定的页面,写个大概的范围就行,写到1级或者2级 2,引入jsapi ,jsapi分为两种,一种是http请求的,另一种是https的 http://res.wx.qq.com/open/js/jweixin-1.0.0.js     --http的 https://res.wx.qq.com/open/js/jweixin-1.0.0.js  --这个是https的 3,

微信JSAPI支付

最近在微信H5页面内集成微信JSAPI支付,遇到不少问题,现将集成步骤及遇到的问题记录如下: 1.官方下载SDK,下载地址:https://pay.weixin.qq.com/wiki/doc/api/download/WxpayAPI_php_v3.zip 2.下载之后,只保留存放证书的文件cert(从微信公众平台"API安全"中下载),库文件lib,日志文件logs,以及example里面的notify.php,jsapi.php文件 3.配置WxPay.Config.php文件(

chrome浏览器 模拟访问移动端

谷歌Chrome浏览器,可以很方便地用来当3G手机模拟器.在Windows的[开始]-->[运行]中输入以下命令,启动谷歌浏览器,即可模拟相应手机的浏览器去访问3G手机网页: 谷歌Android: chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile

微信自动打开手机浏览器实现原理

CommaTool工具是可以实现在微信中自动打开手机浏览器,访问链接的页面.全程完全自动执行,无需任何手动操作.效果如下面这样子: 用户点击下载按钮后,全过程自动化下载,大大减少用户操作. 工具可以免费试用 使用教程 Commatool官网:http://www.commatool.cn/ ①:输入需要在微信中打开的网址链接. ②:点击生成按钮,生成转换后的链接和二维码. ③:复制生成后的链接或者扫一扫二维码即可. 原文地址:https://www.cnblogs.com/bky4321/p/1