Reactでの微信共有の使用
5622 ワード
import wx from 'weixin-js-sdk'
const title = {
myCollect: ' ',
goodsDetail: ' ',
loginCpn: ' ',
registerCpn: ' ',
forgetPasswordCpn: ' ',
modifyPwdCpn: ' ',
bindPhone: ' ',
accountInfoCpn: ' ',
modifyNickNameCpn: ' ',
modifyPhoneCpn: ' ',
modifyResetPwdCpn: ' ',
searchListCpn: ' ',
hotProducts: ' ',
firstPage: ' - ',
searchPage: ' ',
specialPage: ' ',
personalCenter: ' ',
goodsClassifyCpn: ' ',
registerPhoneCpn: ' ',
promotionPage: ' ',
womenFashion: ' ',
newProductHeat: ' ',
};
componentDidMount() {
this.commonFun();
this.props.history.listen((e) => {
this.commonFun(e.pathname);
});
wx.error((res) => {
// config error , , config debug , res , SPA 。
});
}
commonFun = (pathNames = '') => {
const session = window.sessionStorage, storage = window.localStorage;
if (!session.getItem('initLink')) {
session.setItem('initLink', window.location.href)
}
// ios ,
if (window.__wxjs_is_wkwebview !== true) {
this.isIosFlag = false;
}
// ios js-sdk
if (window.__wxjs_is_wkwebview === true) {
this.isIosFlag = true;
}
let name = pathNames || this.props.history.location.pathname;
let pathname = name.substring(1).split('/')[0];
let detailPage = session.getItem('detailPages');
this.origin = '';
this.shareDesc = ' 、 , , , 。';
if ((pathname === 'newProductHeat' || pathname === 'myCollect' || pathname === 'specialPage' || pathname === 'searchPage') && detailPage) { //
let productId = session.getItem('productId');
this.pathname = storage.getItem('shareTitle');
this.shareImg = storage.getItem('shareImg');
this.shareDesc = storage.getItem('shareDesc');
this.origin = window.location.origin + '/goodsDetail/' + productId;
} else if (pathname === 'goodsDetail') { //
this.pathname = storage.getItem('shareTitle');
this.shareImg = storage.getItem('shareImg');
this.shareDesc = storage.getItem('shareDesc');
// this.origin = '';
} else if (pathname === 'specialPage') {
this.pathname = storage.getItem('shareTitle');
this.shareImg = config.serverUrl + 'shareLogo.png';
} else {
// this.shareDesc = '';
// this.origin = '';
this.pathname = title[pathname];
this.shareImg = config.serverUrl + 'shareLogo.png';
}
document.title = this.pathname || ' ';
this.getJsSdkSignatureHttp();
};
// url
getJsSdkSignatureHttp = () => { // jssdk
// , url , ? , encodeURIComponent
axiosHttp('api/WeiXin/WeixinLogin/GetJsSdkSignature?url=' + (this.isIosFlag ? encodeURIComponent(window.sessionStorage.getItem('initLink')) : encodeURIComponent(window.location.href)), "", "GET").then((res) => {
if (res.code === 200) {
const {appId, timestamp, nonceStr, signature} = res.data;
wx.config({
debug: false, // , api alert , , pc , log , pc 。
appId: appId, // ,
timestamp: timestamp, // ,
nonceStr: nonceStr, // ,
signature: signature,// , , 1
jsApiList: [
'onMenuShareAppMessage',
'onMenuShareTimeline',
// 'updateAppMessageShareData',
// 'updateTimelineShareData',
// 1.4.0 ,
] // , JS , JS 2
});
let data = {
link: this.origin || window.location.href,
imgUrl: this.shareImg, //
title: document.title || ' ', //
desc: '',
success: () => {
//
},
cancel: function () {
//
}
};
wx.ready(() => {
//
wx.onMenuShareAppMessage({...data, desc: this.shareDesc});
// wx.updateAppMessageShareData({...data, desc: this.shareDesc});
//
wx.onMenuShareTimeline(data);
// wx.updateTimelineShareData(data);
});
}
}).catch(e => {
console.log(e);
});
};