引言
一、微信JSSDK简介
二、Vue项目接入微信JSSDK步骤
1. 准备工作
2. 引入JS文件
// 安装weixin-js-sdk
yarn add weixin-js-sdk
// 在所需页面的代码里导入
import wx from "weixin-js-sdk";
3. 注入权限验证配置
通过config
接口注入权限验证配置,以下是示例代码:
wx.config({
debug: true, // 开启调试模式,调用的所有 api 的返回值会在客户端 alert 出来
appId: '你的公众号appId', // 公众号唯一标识
timestamp: '时间戳', // 自定义时间戳
nonceStr: '随机字符串', // 自定义随机字符串
signature: '签名', // 自定义签名
jsApiList: ['chooseImage', 'uploadImage', 'getLocation'] // 需要使用的JS接口列表
});
4. 调用微信接口
wx.getLocation({
type: 'wgs84', // 返回经纬度坐标类型
success: function (res) {
var latitude = res.latitude; // 纬度
var longitude = res.longitude; // 经度
// 使用经纬度坐标进行地图选点等功能
}
});
三、实现原生交互体验
- 地图选点
- 拍照、选图
- 语音识别
- 分享
- 扫一扫
- 支付