需要注意的是签名的url需要与当前url一致。
分享的url,即link可以是当前域名下任意链接
- api获取签名
import axios from 'common/js/axios'
const path = '/woa'
/// web-auth
export const createJsSignature = () => { return axios.post(`${path}/web-auth/create-js-signature`, {url: document.URL}) }
- 封装的wxShareRegister
import Vue from 'vue'
import { Toast } from 'vant'
import {createJsSignature} from 'api/woa'
Vue.use(Toast)
const wx = require('weixin-js-sdk')
export default{
install (Vue) {
// 微信分享注册
Vue.prototype.wxShareRegister = (url) => {
createJsSignature().then(res => {
const {data} = res
wx.config({
debug: false, // 开启调试模式,开发时可以开启
appId: 'wxc11abfdbcasd5a31', // 必填,公众号的唯一标识 由接口返回
timestamp: data.timestamp, // 必填,生成签名的时间戳 由接口返回
nonceStr: data.nonceStr, // 必填,生成签名的随机串 由接口返回
signature: data.signature, // 必填,签名 由接口返回
jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline'] // 此处填你所用到的方法
})
const shareData = {
title: '招工啦,点击即可报名',
desc: '名额有限,速来报名吧',
link: url,
imgUrl: `${location.protocol}//${location.hostname}/share-logo.png`
}
wx.ready(() => {
wx.onMenuShareTimeline(shareData)
wx.onMenuShareAppMessage(shareData)
})
wx.error(function (res) {
console.log('errorMSG-->')
console.log(res)
})
}).catch(err => {
console.log(err)
return false
})
}
}
}
- 引入
npm i weixin-js-sdk -S
!#main.js
// wx-jssdk
import wxShare from 'common/js/wx-share'
Vue.use(wxShare)
- to use
mounted(){
this.wxShareRegister(`${location.protocol}//${location.hostname}/share-page`)
}
网友评论