微信公众号分享

如果不做任何的代码优化直接点击右上角的分享出来的效果只是当前的标题并且是没有任何图片效果的

例：

如果做了代码优化就可以把标题、描述、图片都可以替换成动态的

例：

实现方式：

1. 下载微信sdk包

npm install jweixin-module --save

2.需要分享的页面中引入

var jweixin = require('jweixin-module');

3. 掉接口拿sdk需要的参数可参考概述 | 微信开放文档

	onLoad() {
			 this.getDetail()
		},
		methods: {
      // 获取当前详情信息
      async getDetail(){
        try {
          const res = await getDetail(window.location.href)
          this.jssdk = res
          console.log('getDetail', res)
          this.share()
          // 保存数据
        } catch (err) {
        uni.showToast({ title:err,icon:'none' })
          console.log('getDetail', err)
        }
      },
      // 分享
      share() {
      	let that = this;
      	jweixin.config({
      		debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
      		appId: that.jssdk.appId, // 必填，公众号的唯一标识
      		timestamp: that.jssdk.timestamp, // 必填，生成签名的时间戳
      		nonceStr: that.jssdk.nonceStr, // 必填，生成签名的随机串
      		signature: that.jssdk.signature, // 必填，签名
      		jsApiList: that.jssdk.jsApiList // 必填，需要使用的JS接口列表
      	})
      	jweixin.error(function(res) {
      		console.log(res, '错误')
      	});
      	console.log('分享了', that.jssdk.signature);
      	jweixin.ready(function() {
      
      		//分享给朋友
      		jweixin.onMenuShareAppMessage({
      			title: '京采有你 文明北京', // 分享标题
      			link: window.location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      			desc: "京采有你 文明北京",
      			imgUrl: 'https://img-home.csdnimg.cn/images/20201124032511.png', // 分享图标
      			success: function() {
      				// 用户点击了分享后执行的回调函数
      				uni.showToast({
      					title: '分享成功',
      					duration: 2000
      				});
      			},
      			cancel: function(res) {
      				console.log('取消分享')
      			}
      		});
          //自定义“分享给朋友”及“分享到QQ”按钮的分享内容
      		jweixin.updateAppMessageShareData({
      			title: '京采有你 文明北京', // 分享标题
      			link: window.location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      			desc: "京采有你 文明北京",
      			imgUrl: 'https://img-home.csdnimg.cn/images/20201124032511.png', // 分享图标
      			success: function() {
      				console.log('设置分享给朋友成功')
      			},
      			cancel: function(res) {
      				console.log('取消分享')
      			}
      		});
      		//分享到朋友圈
      		jweixin.onMenuShareTimeline({
      			title: '京采有你 文明北京', // 分享标题
      			link: window.location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      			desc: "京采有你 文明北京",
      			imgUrl: 'https://img-home.csdnimg.cn/images/20201124032511.png', // 分享图标
      			success: function() {
      				// 用户点击了分享后执行的回调函数
      				uni.showToast({
      					title: '分享成功',
      					duration: 2000
      				});
      			},
      			cancel: function(res) {
      				console.log('取消分享')
      			}
      		});
      		jweixin.updateTimelineShareData({
      			title: '京采有你 文明北京', // 分享标题
      			link: window.location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
      			desc: "京采有你 文明北京",
      			imgUrl: 'https://img-home.csdnimg.cn/images/20201124032511.png', // 分享图标
      			success: function() {
      				console.log('设置分享到朋友圈成功')
      			},
      			cancel: function(res) {
      				console.log('取消分享')
      			}
      		});
      	});
      },

猜你喜欢