vue项目history模式下微信分享相关问题
import wx from '@/utils/wx' import { shareApi } from '@/api' // 微信验证 export function requireConfig() { let url = window.location.href shareApi.share({ url: url }).then(res => { if (res.code === 200) { wx.config({ debug: false, appId: res.data.appid, // 必填,企业号的唯一标识,此处填写企业号corpid timestamp: res.data.timestamp, // 必填,生成签名的时间戳 nonceStr: res.data.nonceStr, // 必填,生成签名的随机串 signature: res.data.signature, // 必填,签名,见附录1 jsApiList: [ 'onMenuShareTimeline', 'onMenuShareAppMessage' ] }) } }) } // 验证分享 export function requireShare(title, desc, link, imgUrl) { let u = navigator.userAgent // 安卓需要重新验证 if (u.indexOf('Android') > -1) { requireConfig() } wx.ready(function() { // 分享给朋友 wx.onMenuShareAppMessage({ title: title, // 分享标题 desc: desc, // 分享描述 link: `http://share.tcm317.com${link}`, // 分享链接 imgUrl: imgUrl, // 分享图标 type: '', // 分享类型,music、video或link,不填默认为link dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空 success: function() { // 用户确认分享后执行的回调函数 }, cancel: function() { // 用户取消分享后执行的回调函数 } }) // 分享给朋友圈 wx.onMenuShareTimeline({ title: title, // 分享标题 link: `http://share.tcm317.com${link}`, // 分享链接 imgUrl: imgUrl, // 分享图标 success: function() { // 用户确认分享后执行的回调函数 }, cancel: function() { // 用户取消分享后执行的回调函数 } }) }) }
APP.vue
<template> <div id="app"> <router-view/> </div> </template> <script> import { requireConfig } from '@/utils' export default { data() { return { } }, mounted() { requireConfig() }, methods: { } } </script> <style lang="scss"> </style>
需要分享的页面
requireShare( '分享标题', '分享简介', '分享地址', '分享封面' )