公众号分享

Posted 2022-11-29 奥特曼　

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

例：

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

例：

 

实现方式：

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('取消分享')
      			
      		);
      	);
      ,