微信的H5页面调用第三方位置导航


本文摘自PHP中文网,作者php中世界最好的语言,侵删。

这次给大家带来微信的H5页面调用第三方位置导航,微信H5页面调用第三方位置导航的注意事项有哪些,下面就是实战案例,一起来看一下。

微信h5页面拉起第三方导航应用

需要准备的:

  1. 通过微信认证的公众号

  2. 有备案过的域名

背景:微信公众号点击菜单栏跳到h5页面,需要用到导航功能

需求:当用户点击导航按钮时,跳转到第三方app进行导航

参考:微信公众号开发文档

步骤:

在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/cgi-bin/index?lang=zh_CN

jssdk的签名权限,这个权限是由后台提供的,前端只需要把签名权限注入到wx.config中就可以了,相信用过微信其他api的这一步都可以省了

1

2

3

4

5

6

7

8

9

10

"

wx.config({

    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。

    appId: '', // 必填,公众号的唯一标识

    timestamp: , // 必填,生成签名的时间戳

    nonceStr: '', // 必填,生成签名的随机串

    signature: '',// 必填,签名

    jsApiList: ['openLocation'] // 必填,需要使用的JS接口列表 这里填写需要用到的微信api openlocation为使用微信内置地图查看位置接口

});

"

这里需要注意的地方debug在上线后要改为false,jsApiList里要填你要使用的接口,不然没有作用

给导航按钮注册点击事件,调用wx.openLocation方法

阅读剩余部分

相关阅读 >>

HTML5中怎么做五角星

HTML5新增加的标签和表单新增属性的代码实例

HTML5中返回音视频的当前媒体控制器的属性controller

自己动手打造HTML5星际迷航的示例代码分享

详细介绍HTML5 file api实现断点续传

HTML5多媒体audio和video详细介绍(一)

详解HTML5幻灯片系统--h5slides

h5移动端各种各样的列表的制作方法(七最终章)

HTML5标准学习-doctype头部分析

h5中meta标签及作用

更多相关阅读请进入《HTML5》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...