1.微信jssdk的使用
如果写过微信小程序你会发现,小程序里面的方法用起来是很舒服的,直接通过Api调用就可以了,但是微信公众号不是小程序,所以如果要使用微信的功能,那么你就必须要为当前的url注入权限,确保是安全的,这样才可以正常的使用它的功能。
先附上地址:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html
这里的一些配置项,就不需要我们前端人员去管了,都是由后台的人员去弄了,我们前端人员主要做的就是把当前页面的url传递给后台,从而后台人员拿到我们的url,返回给我们
** appId,nonceStr,signature, timestamp** 这四个参数,然后调用wx.config进行配置,还需要在jsApiList中写我们需要的哪些权限, 如果配置成功的话 在微信网页开发的控制台是可以看到当权注入了api功能权限。
npm install weixin-js-sdk -S
sdk前端代码:
import wx from'weixin-js-sdk'
import service from'../request/request'
async function wxconfig(){
const url = (window.location.href.split('#')[0]);
service.get(`wx/get\_signature?url=${url}`).then(({result})=>{
wx.config({
appId: result.appId,
nonceStr: result.nonceStr,
signature: result.signature,
timestamp: result.timestamp,
debug:true,// 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
jsApiList: [ // 必填,需要使用的JS接口列表
'chooseImage',
'scanQRCode',
"getLocation",
"getNetworkType",
"openLocation",
"uploadImage",
"downloadImage",
"getLocalImgData"
]
});
}
export default wxconfig;
然后在我们的App.vue的mounted里面调用一下就可以了 ,同一个url只需要调用一次就可以了的。