// 引用微信分享 sdk
//安装方法
npm install weixin-js-sdk
var wx = require('weixin-js-sdk');
methods: {
// 微信商品详情分享
fenXBtn() {
const url = 'Index/ajaxGetWxConfig'; //location.href.split('#')[0]
let idS = window.location.href;
let shareShopId = this.$store.state.shop_id;
// console.log(idS.replace(/shop_id/,));
// let askUrl = this.IndexDemo('shop_id') != -1 ? idS : `${idS}&shop_id=${this.$store.state.shop_id}`
let askUrl = this.$uti.IndexDemo('shop_id') != -1 ? idS : (shareShopId ? `${idS}&shop_id=${shareShopId}` :
`${idS}`);
// let askUrl = `${window.location.href}&shop_id=${this.$store.state.shop_id}`
let wxTitle = this.shopInfo.name
let wxDesc = this.shopInfo.goods_remark
let imgBox = this.$uti.getImgCon(this.imgBx) //图片路径封装
let bodyParam = {
askUrl
}
this.$http.postRequest(url, bodyParam).then(res => {
// console.log(res);
const {
appId,
nonceStr,
rawString,
signature,
timestamp
} = res
// 微信分享授权
wx.config({
debug: !1, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出
appId, // 必填，公众号的唯一标识，填自己的！
timestamp, // 必填，生成签名的时间戳，刚才接口拿到的数据
nonceStr, // 必填，生成签名的随机串
rawString,
signature, // 必填，签名，见附录1
jsApiList: [ // 需要使用的JS接口列表
'onMenuShareTimeline',
'onMenuShareAppMessage',
'updateTimelineShareData',
'updateAppMessageShareData'
]
})
})
wx.ready(function() {
// 分享到朋友圈
wx.onMenuShareTimeline({
title: wxTitle, // 分享标题
// link: 'http://tksn.shangpreechina.com/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
link: askUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
// imgUrl: that.$uti.getImgCon(this.imgBx), // 分享图标
imgUrl: imgBox, // 分享图标
success: function() {
// 设置成功
alert("分享成功");
// console.log("分享成功");
}
})
//分享给朋友
wx.onMenuShareAppMessage({
title: wxTitle,
desc: wxDesc,
link: askUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgBox, // 分享图标
success: function() {
console.log("分享成功");
},
cancel: function() {
console.log("取消分享");
}
});
})
}
}util.js 在页面调用是为了判断分享路径携不携带shop_id(店铺id)
// 判断 页面王志忠书否存在str
const IndexDemo = (str2) => {
let str1 = window.location.href
let s = str1.indexOf(str2);
return (s);
}2.分享方法封装 分享页面
let commoneUrl = 'http:/xxxxxxxxxxxxxxxxxxxxxx/'
//post请求封装
function postRequest222(url, data) {
var promise = new Promise((resolve, reject) => {
var postData = data;
uni.request({
url: commoneUrl + url,
data: postData,
method: 'POST',
// withCredentials:true,
header: {
'content-type': 'application/x-www-form-urlencoded',
// "Authorization":'22'
},
success: function(res) {
// console.log(res);
if (res.statusCode === 200 && res.data.resultCode == 0) {
resolve(res.data);
} else {
resolve(res.data)
}
},
error: function(e) {
reject('网络出错');
}
})
});
return promise;
}
// 获取网站基础配置信息
const webConfig = (shop_id) => {
const url = 'Index/getWebconfig';
postRequest222(url).then(res => {
console.log("配置Uti", res);
if (res.code == 200) {
uni.setStorageSync('Webconfig', res.data);
uni.setStorageSync('phone', res.data.MOBILE);
getApp().globalData.phone = res.data.MOBILE
uni.setNavigationBarTitle({
title: res.data.CFG_WEBNAME
})
let shop_id = shop_id
let title = res.data.SYS_SHARE_TITLE
let remark = res.data.SYS_SHARE_DESC
let Image = getImgCon(res.data.SYS_SHARE_IMG)
shareFun(shop_id, title, remark, Image)
return res.data
}
if (res.code == 200) {
// this.$store.commit('saveWX_Webconfig', res)
// // 页面标题文字
// uni.setNavigationBarTitle({
// title: res.data.CFG_WEBNAME
// })
// this.phoneNumber = res.data.MOBILE
// getApp().globalData.phone = res.data.MOBILE
// this.$store.commit('saveWX_APPID', res.data.WX_APPID)
// try {
// uni.setStorageSync('phone', res.data.MOBILE);
// } catch (e) {
// // error
// }
}
})
}
// 引入分享 sdk 安装 npm i weixin-js-sdk
let wx = require('weixin-js-sdk');
// 判断 页面王志忠书否存在str
const IndexDemo = (str2) => {
let str1 = window.location.href
let s = str1.indexOf(str2);
return (s);
}
//.微信分享
/**
* shop_id 店铺id 从全局取
* title 分享标题
* remark 分享描述
* Image 分享封面图
*/
const shareFun = (shop_id, title, remark, Image) => {
let idS = window.location.href;
let shareShopId = shop_id;
let askUrl = IndexDemo('shop_id') != -1 ? idS : (shareShopId ? `${idS}&shop_id=${shareShopId}` :
`${idS}`);
let wxTitle = title
let wxDesc = remark
let imgBox = Image
// console.log(askUrl,wxTitle,wxDesc,imgBox);
const url = 'Index/ajaxGetWxConfig';
let bodyParam = {
askUrl
}
postRequest222(url, bodyParam).then(res => {
console.log(res);
const {
appId,
nonceStr,
rawString,
signature,
timestamp
} = res
// 微信分享授权
wx.config({
debug: !1, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出
appId, // 必填，公众号的唯一标识，填自己的！
timestamp, // 必填，生成签名的时间戳，刚才接口拿到的数据
nonceStr, // 必填，生成签名的随机串
rawString,
signature, // 必填，签名，见附录1
jsApiList: [ // 需要使用的JS接口列表
'onMenuShareTimeline',
'onMenuShareAppMessage',
'updateTimelineShareData',
'updateAppMessageShareData'
]
})
})
wx.ready(function() {
// 分享到朋友圈
wx.onMenuShareTimeline({
title: wxTitle, // 分享标题
// link: 'http://tksn.shangpreechina.com/', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
link: askUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
// imgUrl: that.$uti.getImgCon(this.imgBx), // 分享图标
imgUrl: imgBox, // 分享图标
success: function() {
// 设置成功
alert("分享成功");
// console.log("分享成功");
}
})
//分享给朋友
wx.onMenuShareAppMessage({
title: wxTitle,
desc: wxDesc,
link: askUrl, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgBox, // 分享图标
success: function() {
console.log("分享成功");
},
cancel: function() {
console.log("取消分享");
}
});
})
}
module.exports = {
webConfig: webConfig,
}页面调用方法
onLoad(e) {
// 分享
setTimeout(() => {
let shop_id = this.$store.state.shop_id
this.$uti.webConfig(shop_id)
}, 1000)
}效果图展示
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/144804.html
