微信网页开发调用微信jssdk接口遇到的坑以及最终解决方法 (持续更新)

镇三山
• 阅读 9933

1.微信网页开发调用jssdk时报permission denied

大致是两个原因

(1)首先注册时未将你所调用的接口名字添加至jsApiList

(2)第二个就是你的这个公众号没有权限使用这个api,例如在开发环境中的微信页面就无法调取这个api,需要发布后,到对应的有权限的公众号中再打开对应的界面,调用api才成功

2.微信jssdk 使用微信内置地图查看位置【openLocation】接口 最终显示不精确

项目开发中,web端调用的是百度地图api,而微信项目中调用的是腾讯自己的地图,两者所使用的坐标系有所不同,百度用的是自己的百度坐标系,而高德地图和腾讯地图使用的是火星坐标系,两者之间需要做一下转换

火星坐标 转换到 百度地图坐标
function huoxingToBaidu(hxLongitude, hxLatitude){  
                var X_PI = Math.PI * 3000.0 / 180.0;  
                var x = hxLongitude, y = hxLatitude;  
                var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * X_PI);  
                var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * X_PI);  
                var bdLongitude = z * Math.cos(theta) + 0.0065;  
                var bdLatitude = z * Math.sin(theta) + 0.006;  
                return {  
                    bdLongitude: bdLongitude,  
                    bdLatitude: bdLatitude  
                };  
            }  
百度地图坐标 转换到 火星坐标
function baiduToHuoxing(bdLongitude,bdLatitude) {  
                var X_PI = Math.Pi * 3000.0 / 180.0;  
                var x = bdLongitude - 0.0065;  
                var y = bdLatitude - 0.006;  
                var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * X_PI);  
                var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * X_PI);  
                var hxLongitude = z * Math.cos(theta);  
                var hxLatitude = z * Math.sin(theta);  
                return {  
                    hxLongitude: hxLongitude,  
                    hxLatitude: hxLatitude  
                }  
            }  

3.微信JSSDK 预览图片【previewImage】接口的坑, 安卓手机上,图片预览需要点击两次才能退出预览

在微信网页开发过程中,测试提出的一个bug,在微信中预览图片是,点击图片,打开图片正常,当再次点击时,原本应该直接退出图片预览,但是却需要点击两次才能退出预览。

分析原因

应该是 previewImage 这个接口调用了两次,进行了图片的叠加。所以需要两次才能退出

最终得出的结果

代码中实际上只调用了一次。

  1. 在Android系统的手机中,其实微信点击网页的图片会自动调用这个接口一次。然后代码中又对对这个接口调用了一次,这就造成了以上的结果。
  2. 但是在ios系统的手机中,微信并不会调用这个接口。
解决方案

在方法的最前面进行手机系统的判断,当是Android系统直接return。
然后在在下面进行微信的previewImage接口的调用

js判断是Android还是ios
var u = navigator.userAgent;

isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端

isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

2018.8.1更新
这个bug好像微信自己修复了,现在无论Android还是ios,如果不调用这个方法,微信自己不会去调用了。

点赞
收藏
评论区
推荐文章
blmius blmius
4年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(
Jacquelyn38 Jacquelyn38
4年前
手写一个仿微信登录的nodejs程序
前言首先,我们看一下微信开放文档中的一张图:上面的一幅图中清楚地介绍了微信登录整个过程,下面对图上所示进行总结:一、二维码的获得1.用户打开登录网页后,登录网页后台根据微信OAuth2.0协议向微信开发平台请求授权登录,并传递事先在微信开发平台中审核通过的AppID和AppSecrect等参数;2.微信开发平台对AppID等参数进行验证,并向
梦
5年前
微信小程序new Date()转换时间异常问题
微信小程序苹果手机页面上显示时间异常,安卓机正常问题image(https://imghelloworld.osscnbeijing.aliyuncs.com/imgs/b691e1230e2f15efbd81fe11ef734d4f.png)错误代码vardate'2021030617:00:00'vardateT
Easter79 Easter79
4年前
Taro小程序自定义顶部导航栏
微信自带的顶部导航栏是无法支持自定义icon和增加元素的,在开发小程序的时候自带的根本满足不了需求,分享一个封装好的组件,支持自定义icon、扩展dom,适配安卓、ios、h5,全面屏。我用的是京东的Taro多端编译框架写的小程序,原生的也可以适用,用到的微信/taro的api做调整就行,实现效果如下。!在这里插入图片描述(https://i
Wesley13 Wesley13
4年前
h5 接入微信支付
我们公司,现在用ping做h5接入,用的是h5"壹收款"准备:如果公司,现在还没有公众号的话,支付宝。可以把这些工作,给ping来做这些事情 1.注册微信公众号,开通支付功能。2.注册ping (如果是自己开开通的微信支付,要填写相关信息)3.微信设置网页授权获取用户基本信
Wesley13 Wesley13
4年前
JAVA微信二次开发
大家首先自己有条件的,自己注册一个微信公众账号1.一个微信公众账号(供自己测试使用)2.一个百度开发账号3.myeclipse开发工具 4.需要熟悉jeecg开发5.微信开发代码如下标签:JEECG(http://www.oschina.net/code/tag/jeecg) MiniDao(h
Easter79 Easter79
4年前
Tiny微信框架是怎样设计的?
   微信对国人而言,想必大名鼎鼎,活跃用户数已经突破6.5亿,足以说明这款应用的生命力。但是使用人数众多,不代表微信的API设计优异,有过微信公众号开发经验的人,想必复杂的报文,众多的服务API以及各种公众号资源与权限设置搞得头痛。其实Tiny框架设计理念之一就是简化开发人员的工作,设计Tiny微信框架可以一定程度上减少一般开发人员的难度。  
LibraHeresy LibraHeresy
2年前
企业微信使用微信 jssdk 实现转发分享功能
前言又接到一个看似简单,实则难受的需求,实现企业微信环境转发H5页面到微信好友和朋友圈,并保留卡片形式。需求简单明了,但是和微信沾边的,都不是一条好走的路。一上手就发现问题了,企微的jssdk它不更新了。兜兜转转发现,好像企微和微信的jssdk统一用@we
liam liam
2年前
企业微信 API 接口调用教程:零基础学习企业微信 API 开发
本文通过accesstoken凭证的方式来讲解怎么调用,并一步步介绍如何获取企业微信API的corpsecret、corpid、accesstoken凭证以及怎么向企业微信的应用发送消息。企业微信API在线地址为:https://qiyeweixin.ap
Python进阶者 Python进阶者
2年前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这