微信JS接口汇总及使用详解

JavaScript 前端之家
前端之家收集整理的这篇文章主要介绍了微信JS接口汇总及使用详解，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

基本说明

使用说明

1.引入JS文件

在需要调用JS接口的页面引入如下JS文件，（支持https）：

备注：支持使用 AMD/CMD 标准模块加载方法加载

2.注入配置config接口

所有需要使用JSSDK的页面必须先注入配置信息，否则将无法调用（同一个url仅需调用一次，对于变化url的SPA的web app可在每次url变化时进行调用）。

代码如下:
调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 appId: '',// 必填，公众号的唯一标识 timestamp:,// 必填，生成签名的时间戳 nonceStr: '',// 必填，生成签名的随机串 signature: '',// 必填，签名，见附录1 jsApiList: [] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 });

3.验证通过ready接口

代码如下:

// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。 });

4.验证失败error接口

代码如下:
函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。 });

接口调用说明

所有接口通过wx对象(也可使用jWeixin对象)来调用，参数是一个对象，除了每个接口本身需要传的参数之外，还有以下通用参数：

success：接口调用成功时执行的回调函数。 fail：接口调用失败时执行的回调函数。 complete：接口调用完成时执行的回调函数，无论成功或失败都会执行。 cancel：用户点击取消时的回调函数，仅部分有用户取消操作的api才会用到。 trigger: 监听Menu中的按钮点击时触发的方法，该方法仅支持Menu中的相关接口。

以上几个函数都带有一个参数，类型为对象，其中除了每个接口本身返回的数据之外，还有一个通用属性errMsg，其值格式如下：

调用成功时："xxx:ok" ，其中xxx为调用的接口名 用户取消时："xxx:cancel"，其中xxx为调用的接口名 调用失败时：其值为具体错误信息

基础接口

判断当前客户端版本是否支持指定JS接口

代码如下:

});

分享接口

获取“分享到朋友圈”按钮点击状态及自定义分享内容接口

代码如下:
分享标题 link: '',// 分享链接 imgUrl: '',// 分享图标 success: function () { // 用户确认分享后执行的回调函数 }, cancel: function () { // 用户取消分享后执行的回调函数 } });

获取“分享给朋友”按钮点击状态及自定义分享内容接口

代码如下:
分享标题 desc: '',// 分享描述 link: '',// 分享链接 imgUrl: '',// 分享图标 type: '',// 分享类型,music、video或link，不填默认为link dataUrl: '',// 如果type是music或video，则要提供数据链接，默认为空 success: function () { // 用户确认分享后执行的回调函数 }, cancel: function () { // 用户取消分享后执行的回调函数 } });

获取“分享到QQ”按钮点击状态及自定义分享内容接口

代码如下:
分享链接 imgUrl: '' // 分享图标 success: function () { // 用户确认分享后执行的回调函数 }, cancel: function () { // 用户取消分享后执行的回调函数 } });

获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口

代码如下:
用户取消分享后执行的回调函数 } });

图像接口

拍照或从手机相册中选图接口

代码如下:
img标签的src属性显示图片 } });

预览图片接口

代码如下:
显示的图片链接 urls: [] // 需要预览的图片链接列表 });

上传图片接口

代码如下:
上传的图片的本地ID，由chooseImage接口获得 isShowProgressTips: 1// 默认为1，显示进度提示 success: function (res) { var serverId = res.serverId; // 返回图片的服务器端ID } });

备注：可用微信下载多媒体文件接口下载上传的图片，此处获得的 serverId 即 media_id，参考文档../12/58bfcfabbd501c7cd77c19bd9cfa8354.html

下载图片接口

代码如下:
图片的服务器端ID，由uploadImage接口获得 isShowProgressTips: 1// 默认为1，显示进度提示 success: function (res) { var localId = res.localId; // 返回图片下载后的本地ID } });

音频接口

开始录音接口

代码如下:

停止录音接口

代码如下:

监听录音自动停止接口

代码如下:

播放语音接口

代码如下:

暂停播放接口

代码如下:

停止播放接口

代码如下:
4044"> wx.stopVoice({ localId: '' // 需要停止的音频的本地ID，由stopRecord接口获得 });

监听语音播放完毕接口

代码如下:

上传语音接口

代码如下:
上传的音频的本地ID，由stopRecord接口获得 isShowProgressTips: 1// 默认为1，显示进度提示 success: function (res) { var serverId = res.serverId; // 返回音频的服务器端ID } });

备注：可用微信下载多媒体文件接口下载上传的语音，此处获得的 serverId 即 media_id，参考文档../12/58bfcfabbd501c7cd77c19bd9cfa8354.html

下载语音接口

代码如下:
显示进度提示 success: function (res) { var localId = res.localId; // 返回音频的本地ID } });

智能接口

识别音频并返回识别结果接口

代码如下:
显示进度提示 success: function (res) { alert(res.translateResult); // 语音识别的结果 } });

设备信息

获取网络状态接口

代码如下:

地理位置

使用微信内置地图查看位置接口

代码如下:
底部显示的超链接,可点击跳转 });

获取地理位置接口

代码如下:
随机串，仅当需要兼容6.0.2版本之前时提供 addrSign: '',// 位置签名，仅当需要兼容6.0.2版本之前时提供，详见附录4 success: function (res) { var longitude = res.longitude; // 纬度，浮点数，范围为90 ~ -90 var latitude = res.latitude; // 经度，浮点数，范围为180 ~ -180。 var speed = res.speed; // 速度，以米/每秒计 var accuracy = res.accuracy; // 位置精度 } });

界面操作

代码如下:
菜单接口 wx.hideOptionMenu(); 显示右上角菜单接口 wx.showOptionMenu(); 关闭当前网页窗口接口 wx.closeWindow(); 批量隐藏功能按钮接口 wx.hideMenuItems({ menuList: [] // 要隐藏的菜单项，所有menu项见附录3 }); 批量显示功能按钮接口 wx.showMenuItems({ menuList: [] // 要显示的菜单项，所有menu项见附录3 }); 隐藏所有非基础按钮接口 wx.hideAllNonBaseMenuItem(); 显示所有功能按钮接口 wx.showAllNonBaseMenuItem(); 微信扫一扫 调起微信扫一扫接口 wx.scanQRCode({ desc: 'scanQRCode desc', needResult: 0,// 默认为0，扫描结果由微信处理，1则直接返回扫描结果， scanType: ["qrCode","barCode"],// 可以指定扫二维码还是一维码，默认二者都有 success: function () { var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果 } });

收获地址

编辑收货地址接口

@L_403_26@ 代码如下:

获取最近的收货地址接口

代码如下:

微信小店

跳转微信商品页接口

代码如下:

微信卡券

调起适用于门店的卡券列表并获取用户选择列表

代码如下:
随机串 cardSign: '',// 卡券签名，详见附录6 success: function (res) { var cardList= res.cardList; // 用户选中的卡券列表信息 } });

批量添加卡券接口

代码如下:
添加的卡券列表 success: function (res) { var cardList = res.cardList; // 添加的卡券列表信息 } });

查看微信卡包中的卡券接口

代码如下:

微信支付

发起一个微信支付请求

代码如下:
随机串 package: '',// 订单详情扩展字符串，详见附录5 paySign: '',// 支付签名，详见附录5 });

JS接口微信微信微信

猜你在找的JavaScript相关文章

Javascript中的事件冒泡与捕获
事件冒泡和事件捕获 起因：今天在封装一个bind函数的时候，发现el.addEventListener函数支...
搞懂js中小数运算精度问题原因及解决办法
js小数运算会出现精度问题 js number类型 JS 数字类型只有number类型，number类型相当于其...
搞懂：前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理
什么是跨域 跨域 ： 广义的跨域包含一下内容 ： 1.资源跳转（链接跳转，重定向跳转，表单提...
前端对base64编码的理解，原生js实现字符base64编码
@ "TOC" 常见对base64的认知(不完全正确) 首先对base64常见的认知，也是...
搞懂：MVVM模型以及VUE中的数据绑定数据劫持发布订阅模式
搞懂：MVVM模式和Vue中的MVVM模式 MVVM MVVM ： 的缩写，说都能直接说出来 ：模型， ：视图...
js判断浏览器是否支持webGL
起因是我之前开发的网页，用到了three.js制作了一个3d的旋转球体效果。 在各种浏览器上运行...
js判断undefined和null
js判断undefined js判断null js判断null和undefined
将文字自动转为banner打印形式的工具
http://patorjk.com/software/taag/
聊一聊 bootstrap 的轮播图插件
今天做工作的时候，轻车熟路的做完，又用到了bootstrap的轮播图，觉得有必要安利一下这个插...
js实现图片无缝循环跑马灯
html 代码 css js代码 function mylsRunHorseLight() { if (mylsTimer != null) { clearIn...
HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsTypeScriptVueDojoJsonElectronNode.jsextjsExpress XMLES6AjaxFlashUnityReactFlexAnt DesignWeb前端微信小程序微信公众号
关闭广告单独headers封装代码提示错误整数正则非0开头跳页出页码antd table提示URL未注册公众号支付vue hash模式iSlider车牌键盘循环图片echarts 双折左右布局DllPlugin对象创建打字游戏圈选两栏云函数蒙版ES2020橱窗无缝滚动轮播色块碰撞组件销毁文档操作