安装

npm run weixin-js-sdk

初始化

import wx from 'weixin-js-sdk'

wx.config({
  debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
  appId: '', // 必填，公众号的唯一标识
  timestamp: , // 必填，生成签名的时间戳
  nonceStr: '', // 必填，生成签名的随机串
  signature: '',// 必填，签名
  jsApiList: [] // 必填，需要使用的JS接口列表
})
 wx.ready(() => {
        wx.checkJsApi({
        jsApiList: [],
            success: () => {},
            fail: (err) => {},
        })
  })

JS接口列表

updateAppMessageShareData
updateTimelineShareData
onMenuShareTimeline（即将废弃）
onMenuShareAppMessage（即将废弃）
onMenuShareQQ（即将废弃）
onMenuShareWeibo
onMenuShareQZone
startRecord
stopRecord
onVoiceRecordEnd
playVoice
pauseVoice
stopVoice
onVoicePlayEnd
uploadVoice
downloadVoice
chooseImage
previewImage
uploadImage
downloadImage
translateVoice
getNetworkType
openLocation
getLocation
hideOptionMenu
showOptionMenu
hideMenuItems
showMenuItems
hideAllNonBaseMenuItem
showAllNonBaseMenuItem
closeWindow
scanQRCode
chooseWXPay
openProductSpecificView
addCard
chooseCard
openCard

注意：
公众号后台一定要绑定域名（域名不需要写http或https）！
公众号后台一定要绑定域名（域名不需要写http或https）！
公众号后台一定要绑定域名（域名不需要写http或https）！

绑定之前需要把MP_verify_mf0rvMed51lDhKID.txt放到web服务器下.(一般前端发布把这个文件放到dist目录中即可)

调式

• 下载SwitchHost!
• 下载Charles

1、SwitchHost修改host如下

image.png

2、Charles修改

image.png

端口你随意，尽量不要80。

3、手机连在同一个WiFi下，修改配置代理

image.png

服务器填你电脑的ip地址
端口填你Charles写的端口

在微信里访问 http://xxx.com 即可

参考知乎：https://www.zhihu.com/question/25456655
参考文档：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#2