微信分享遇到的問題
一開始的時(shí)候，微信的sdk召噩，是通過script引入的母赵。
但是，因?yàn)槲覀兊捻撁媸嵌替溄泳叩危瑫?huì)有一次轉(zhuǎn)換變成長(zhǎng)鏈接，這就造成了在我們的系統(tǒng)不能正常使用微信分享师倔。
最終經(jīng)過N多次失敗构韵，不得不重頭再來，一步步的走下來趋艘，最終發(fā)現(xiàn)是還是短鏈接轉(zhuǎn)長(zhǎng)鏈接造成的問題疲恢，因?yàn)樵诔跏蓟臅r(shí)候是進(jìn)來的時(shí)候是短鏈接，因?yàn)槭峭ㄟ^script在開頭引入的瓷胧，所以微信sdk已經(jīng)監(jiān)控到了显拳，但是我們 wxsdk 配置里面的 link 是我們要分享的長(zhǎng)鏈接，微信會(huì)認(rèn)為這是無效配置搓萧，所以微信分享不生效杂数。
如果你的微信分享還是使用script引入的方式，但是微信分享不生效瘸洛，可以試試換一種方式
解決問題的代碼
PS：多余代碼就不寫了
main.js
import wxInit from '@/utils/wxjsdk'
wxInit.install()
wxsdk.js
// 微信的配置
import Vue from 'vue'
// 我們自己查要分享的數(shù)據(jù)的接口
import { getWxConfig, getWxShareData } from '../api/bvent.js'
import Store from '@/store'
// 引入微信sdk的包
import wx from 'weixin-js-sdk'
window.wx = wx
const wxSdk = {
install() {
Vue.prototype.$wxSdkInit = wxSdk.init
},
init() {
getWxConfig({ url: location.href }).then(res => {
wx.config({
debug: false, // 生產(chǎn)環(huán)境需要關(guān)閉debug模式
appId: res.appId, // appId通過微信服務(wù)號(hào)后臺(tái)查看
timestamp: res.timestamp, // 生成簽名的時(shí)間戳
nonceStr: res.nonceStr, // 生成簽名的隨機(jī)字符串
signature: res.signature, // 簽名
jsApiList: [
// 需要調(diào)用的JS接口列表
'updateTimelineShareData', // 分享給好友
'updateAppMessageShareData', // 分享到朋友圈
'onMenuShareAppMessage', // 1.0 分享到朋友
'onMenuShareTimeline' // 1.0分享到朋友圈
]
})
wx.ready(function() {
getWxShareData({ id: Store.getters.bventId }).then(e => {
let shareData = {
title: e.shareTitle, // 分享標(biāo)題
desc: e.shareDescribe, // 分享描述
link: e.shareLink, // 分享鏈接
imgUrl:
e.shareImage && e.shareImage.indexOf('http') === -1
? window.domainConfig.fileServer + '/' + e.shareImage
: e.shareImage // 分享圖標(biāo)
}
wx.ready(function() {
wx.onMenuShareAppMessage(shareData)
wx.onMenuShareTimeline(shareData)
wx.updateAppMessageShareData(shareData)
wx.updateTimelineShareData(shareData)
})
})
})
})
}
}
export default wxSdk
App.vue
<template>
<router-view />
</template>
<script>
export default {
name: 'App',
mounted() {
// 微信分享使用的揍移，所以判斷微信瀏覽器執(zhí)行該方法
let ua = navigator.userAgent.toLowerCase()
var isWeixin = ua.indexOf('micromessenger') !== -1
if (isWeixin && !/miniprogram/.test(ua)) {
this.$wxSdkInit()
}
}
}
</script>
