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,如果不调用这个方法,微信自己不会去调用了。

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

  1. 10天学会phpWeChat——第十天:phpWeChat的会员注册、登录以及微信网页开发

    通过前面的系列教程,我们系统的讲解了phpWeChat从视图端.控制器端到模型端的操作流程:熟悉了phpWeChat的目录结构:掌握了视图端模板如何创建一个丰富的表单和模型端如何操作数据库.这一切都是 ...

  2. 微信开发+百度AI学习:微信网页开发环境搭建

    参考微信官方文档:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 两步即可获取微信网页开发能力 STEP1: ...

  3. 手把手实现微信网页授权和微信支付,附源代码(VUE and thinkPHP)

    wechat github 手把手实现微信网页授权和微信支付,附源代码(VUE and thinkPHP) 概述 公众号开发是痛苦的,痛苦在好多问题开发者文档是没有提到的,是需要你猜的. 在开发过程中 ...

  4. VueJs单页应用实现微信网页授权及微信分享功能

    在实际开发中,无论是做PC端.WebApp端还是微信公众号等类型的项目的时候,或多或少都会涉及到微信相关的开发,最近公司项目要求实现微信网页授权,并获取微信用户基本信息的功能及微信分享的功能,现在总算 ...

  5. .Net微信网页开发之使用微信JS-SDK调用微信扫一扫功能

    前言: 之前有个项目需要调用微信扫描二维码的功能,通过调用微信扫码二维码功能,然后去获取到系统中生成的二维码信息.正好微信JS-SDK提供了调用微信扫一扫的功能接口,下面让我们来看看是如何实现的吧. ...

  6. 夺命雷公狗---微信开发56----微信js-sdk接口开发(3)所有接口功能

    按照上节课程里面的介绍,我们可以先将刚才在signatrue.php里获取到的信息填写进jssdk.htm模版文件里填写各个权限的参数 jssdk.htm代码如下: <!DOCTYPE html ...

  7. 夺命雷公狗---微信开发55----微信js-sdk接口开发(2)接口功能介绍之签名算法

    我们JS-SDK里面其实有不少的接口 startRecord---录音 stopRecord---停止录音 playVoice---播放 pauseVoice---暂停播放 uploadImage-- ...

  8. 夺命雷公狗---微信开发54----微信js-sdk接口开发(1)之快速入门

    js-sdk基本介绍 除去服务号的九大接口外,微信提供了JS-SDK接口,所谓JS-SDK接口也就是在网页中使用javascript来更改网页设置, (比如隐藏右上角的菜单)获取用户状态(比如地理位置 ...

  9. .Net微信网页开发之使用微信JS-SDK自定义微信分享内容

    第一步.微信JS-SDK的使用步骤,配置信息的生成获取讲解: 关于JS-SDK的使用步骤和timestamp(时间戳),nonceStr(随机串),signature(签名),access_token ...

随机推荐

  1. 使用rdb文件进行redis数据迁移--python脚本

    查找了一些redis迁移的方法,一般做法就是 1. 从源数据库把rdb文件保存,然后传到新的主机上,启动新的redis即可 2. 把新的redis当做源数据库的slave,同步数据 今天开发提了一个测 ...

  2. Bootstrap 学习笔记12 轮播插件

    轮播插件: <!-- data-ride="carousel"自动播放 --> <div id="myCarousel" class=&quo ...

  3. Oracle11g安装步骤

    plsql安装等:https://blog.csdn.net/li66934791/article/details/83856225      https://www.cnblogs.com/gaoz ...

  4. 洛谷P1168 中位数——set/线段树

    先上一波链接 https://www.luogu.com.cn/problem/P1168 这道题我们有两种写法 第一种呢是线段树,我们首先需要将原本的数据离散化,线段树维护的信息就是区间内有多少个数 ...

  5. php开启xdebug扩展及xdebug通信原理

    xdebug调试原理 IDE(如PHPStorm)已经集成了一个遵循BGDP的XDebug插件,当开启它的时候, 会在本地开一个XDebug调试服务,监听在调试器中所设置的端口上,默认是9000,这个 ...

  6. 常用颜色的RGB分布

    RGB色彩模式是工业界的一种颜色标准,它通过对红(RED).绿(GREEN).蓝(BLUE)三种基本颜色的相互组合从而叠加出各种颜色.RGB色彩模式为每一个红.绿.蓝分类了0-255范围内的亮度值. ...

  7. elasticsearch 深入 —— Post Filter后置过滤器

    过滤查询以及聚合 A natural extension to aggregation scoping is filtering. Because the aggregation operates i ...

  8. 2018-8-10-win10-UWP-序列化

    title author date CreateTime categories win10 UWP 序列化 lindexi 2018-08-10 19:16:50 +0800 2018-2-13 17 ...

  9. quotastats - 显示与配额子系统相关的统计信息

    SYNOPSIS(总览) quotastats DESCRIPTION(描述) 该命令显示与配额子系统相关的统计信息.

  10. TMS320C6455BCTZA 原厂订购 原装正品

    作为一家科研公司,保证芯片的原厂品质和正规采购渠道是科学严谨的研发工作中重要的一环,更是保证研发产品可靠.稳定的基础.而研发中所遇到的各种不可预测的情况更是每个工程师向技术的山峰攀登中时会遇到的各种难 ...