VUE项目引入微信jssdk

我们的一个vue + webpack的 SPA项目需要在微信中使用,因此需要导入微信的jssdk库。

通过搜索发现npm有微信jssdk的依赖包: weixin-js-sdk, 于是

  • 导入依赖包
npm i -S weixin-js-sdk
  • 前端页面Usage
import wx from 'weixin-js-sdk'

export default {
    created(){
     let param = {
        debug:true,
        url:'http://localhost:8081/productgroups',
        jsApiList: [
          'chooseWXPay',
          'checkJsApi'
      ]};
      wechatlib.queryJsConfig(param,(err,obj)=>{
        if(err){
          return this.$toast(err);
        }

        console.log('jsconfig ',obj);

        wx.config(obj);

        wx.ready(()=>{
          console.log('wx.ready');
        });

        wx.error(function(res){

          console.log('wx err',res);

          //可以更新签名
        });
      });
    }
}

wechatlib中获取jsconfig的方法

queryJsConfig(param,callback){
    networklib.post('/wechat/jsconfig',param).then(obj=>{

      callback(null,obj);
    })
        .catch(err=>{callback(err)});
  },

这里的jsconfig由后端服务器API生成

TO BE CONTINUE

你可能感兴趣的:(vue-js,vue)