介绍 import wx 得到& # 39;weixin-js-sdk& # 39;
import api 得到& # 39;@/api # 39;
const wxApi =, {
,,,/* *
,,*,[wxRegister 微信Api初始化)
,,*,@param ,{函数},callback [准备回调函数)
,,*/wxRegister 才能;(回调,url), {
,,,let query =, {
,,,,//,这里的url必须是你要分享的页面完全对应的url,并且需要转换,base64
,,,,,url:, url
,,,}
,,,api.getWxJsSdk(查询),然后(res =祝辞,{
,,,,,let data =res.data
,,,,,wx.config ({
,,,,,,,调试:,假的,,//,开启调试模式
,,,,,,,appId:, data.appId,,//,必填,公众号的唯一标识
,,,,,,,时间戳:,data.timestamp,,//,必填,生成签名的时间戳
,,,,,,,nonceStr:, data.nonceStr,,//,必填,生成签名的随机串
,,,,,,,签名:,data.signature,,//,必填,签的名,见附录1
,,,,,,,jsApiList:, data.jsApiList //,必填,需要使用的JS接口列表,所有JS接口列表见附录2
,,,,,})
,,,})
,,,wx.ready ((res),=祝辞,{
,,,,,//,如果需要定制做好了回调方法
,,,,,if (回调),{
,,,,,,,回调()
,,,,,}
,,,})
,,},
} //,在wxRegister函数后面添加/* *
*,[ShareTimeline 自定义微信分享到朋友圈)
*,@param {[型]},option [分享信息)
*,@param {[型]},success [成功回调)
*,@param {[型]},error ,,(失败回调)
*/ShareTimeline (选项),{
wx.updateTimelineShareData ({
标题:才能,option.title,,//,分享标题
链接:,才能option.link,,//,分享链接
,,imgUrl: option.imgUrl,,//,分享图标
success 才能;(),{
,,,//,设置成功
,,},
cancel 才能;(),{
,,,//,设置失败
,,}
})
}，/* *
*,[ShareAppMessage 自定义微信分享到朋友)
*,@param {[型]},option [分享信息)
*,@param {[型]},success [成功回调)
*,@param {[型]},error ,,(失败回调)
*/ShareAppMessage (选项),{
wx.updateAppMessageShareData ({
标题:才能,option.title,,//,分享标题
描述:,才能option.desc,,//,分享描述
链接:,才能option.link,,//,分享链接
,,imgUrl: option.imgUrl,,//,分享图标
success 才能;(),{
,,,//,设置成功
,,},
cancel 才能;(),{
,,,//,设置失败
,,}
})
} //, vue 为例//,以下的函数有形参请参考上面的方法
import wx 得到& # 39;你封装的文件& # 39;
安装(){
,,,let base64 =,需要(& # 39;js-base64& # 39;) .Base64
,,,let url =, base64.encode (window.location.href)
,,,wx.wxRegister (this.wxRegCallback、url)
}，
方法:{
,,,//,自定义的jdk回调
,,,wxRegCallback (), {},
,,,//,自定义的分享给朋友的函数
,,,wxShareAppMessage () {
,,,,,,,let option =, {
,,,,,,,,,,,标题:& # 39;& # 39;//,分享标题
,,,,,,,,,,,描述:,& # 39;& # 39;,,//,分享描述
,,,,,,,,,,,链接:,& # 39;& # 39;,,//,分享链接
,,,,,,,,,,,imgUrl:, & # 39; & # 39;,//,分享图标
,,,,,,,}
,,,,,,,//,注入通用方法
,,,,,,,wx.ShareAppMessage(选项)
,,,},
,,,//,自定义的分享给朋友圈的函数
,,,wxShareTimeline () {
null
null
null
null
null
null
null
null
null
null
这期内容当中小编将会给大家带来有关怎么在Html5中实现微信分享功能,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。
<强> 1,安装,weixin-js-sdk
<代码> npm安装weixin-js-sdk——save-dev
具体的使用说明查阅微信官方文档
<强> 2,初始化微信分享
,
因为本人正在做的项目多处需要使用到微信分享的功能,所以这里会对微信分享的代码进行封装
下面的代码中的Api其实就是axios请求
注:以上需要转换base64的可以使用,js-base64
3,配置微信分享自定义内容(发送给朋友,发送到朋友圈)
第二步对于微信初始化了封装配置,但是还缺少了相对应的分享等功能,这边就完善一下,
4页面调用时
