uni公众号和APP分享

uni公众号内嵌H5分享

我们首先要安装一个模块（jweixin-module） npm install jweixin-module
封装了一个js，内容为

import line from '../uni_modules/uview-ui/libs/config/props/line';

var jweixin = require('jweixin-module');
// import {
// 	get_jssdk
// } from '@/api/index.js' // 分享接口后台提供，用于获取appid，timestamp，nonceStr，signature

var Shares = {
	async get_jssdk(res) {
		jweixin.config({
			debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
			appId: res.appId, // 必填，公众号的唯一标识
			timestamp: res.timestamp, // 必填，生成签名的时间戳
			nonceStr: res.nonceStr, // 必填，生成签名的随机串
			signature: res.signature, // 必填，签名
			jsApiList: res.jsApiList // 必填，需要使用的JS接口列表
		})
	},
	get_share(aa = 0, title, desc, href, share_img, id, num = 0) {

		return new Promise((resolve, reject) => {
			if (aa == 1) {
				href = id ? href + '?id=' + id : href;
			}
			console.log(title, desc, href, share_img, id, num)
			//a:判断是否调用回调
			console.log(href)
			jweixin.error(function(res) {
				console.log(res, '错误')
			});
			var that = this
			jweixin.ready(function() {
				jweixin.updateAppMessageShareData({
					title: title, // 分享标题
					link: href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					desc: desc,
					imgUrl: share_img, // 分享图标
					success: (res) => {
						console.log('设置分享给朋友成功')
						console.log(res)
						if (aa == 1) {
							let nums = that.cabk(title, href, 1);
							nums.then(res => {
								console.log(num + res)
								resolve(num + res)
								// this.num = this.num + res
							})
						}

					},
					cancel: function(res) {
						alert('取消分享')
						// resolve(0)
					}
				});
				jweixin.updateTimelineShareData({
					title: title, // 分享标题
					link: href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					desc: desc,
					imgUrl: share_img, // 分享图标
					success: (res) => {
						console.log('设置分享到朋友圈成功')
						if (aa == 1) {
							let nums = that.cabk(title, href, 1);
							nums.then(res => {
								console.log(res)
								console.log(num + res)
								resolve(num + res)
								// this.num = this.num + res
							})
						}

					},
					cancel: function(res) {
						console.log('取消分享')
						// resolve(0)
					}
				});
			});
		})
	},
	cabk(title, href, api) { //分享回调
		return new Promise((resolve, reject) => {
			uni.request({
				url: 'https://shouyin.zhilongyihuo.com/app/card/shareBack',
				method: 'POST',
				data: {
					user_id: uni.getStorageSync("user_id"),
					link: href,
					jsapi: api,
					title: title
				},
				header: {
					'token': uni.getStorageSync("token"), //自定义请求头信息
				},
				success: (res) => {
					resolve(1)
				}
			});
		})
	},
//callback写法
	get_share1(aa = 0, title, desc, href, share_img, id, num = 0, callback) {
		if (aa == 1) {
			href = id ? href + '?id=' + id : href;
		}
		console.log(title, desc, href, share_img, id, num)
		//a:判断是否调用回调
		console.log(href)
		jweixin.error(function(res) {
			console.log(res, '错误')
		});
		var that = this
		jweixin.ready(function() {
			jweixin.updateAppMessageShareData({
				title: title, // 分享标题
				link: href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
				desc: desc,
				imgUrl: share_img, // 分享图标
				success: (res) => {
					console.log('设置分享给朋友成功')
					console.log(res)
					if (aa == 1) {
						that.cabk1(title, href, 1, function(res) {
							console.log(num + res)
							callback && callback(num + res)
						});
					}

				},
				cancel: function(res) {
					alert('取消分享')
					// resolve(0)
				}
			});
			jweixin.updateTimelineShareData({
				title: title, // 分享标题
				link: href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
				desc: desc,
				imgUrl: share_img, // 分享图标
				success: (res) => {
					console.log('设置分享到朋友圈成功')
					if (aa == 1) {
						that.cabk1(title, href, 1, function(res) {
							console.log(num + res)
							callback && callback(num + res)
						});
					}

				},
				cancel: function(res) {
					console.log('取消分享')
					// resolve(0)
				}
			});
		});
	},
	cabk1(title, href, api, callback) { //分享回调
		uni.request({
			url: 'https://shouyin.zhilongyihuo.com/app/card/shareBack',
			method: 'POST',
			data: {
				user_id: uni.getStorageSync("user_id"),
				link: href,
				jsapi: api,
				title: title
			},
			header: {
				'token': uni.getStorageSync("token"), //自定义请求头信息
			},
			success: (res) => {
				callback && callback(1)
			}
		});
	}
}
//抛出
export {
	Shares
}

main.js里引入

import {Shares} from './until/share.js'
		//挂载到全局
Vue.prototype.$wxH5Share = Shares

页面使用

	async fx() {
				console.log(window.location.href)
				const res = await this.$myrequest({
					url: '/app/user/getWechatJssdk',//示例接口获取微信的appid，timestamp，nonceStr，signature
					method: 'POST',
					header: {
						// 'token': uni.getStorageSync("token"), //自定义请求头信息
					},
					data: {
						url: window.location.href
					}
				})
				if (res.data.code == 1) {
					let img = "https://www.zhilongyihuo.com/down/logo.png"
					console.log(this.dect)
					console.log(this.num)
					// 初始化微信接口
					this.$wxH5Share.get_jssdk(res.data.data);
					// 初始化分享参数
					this.$wxH5Share.get_share1(1, this.radiovalue1, this.dect, this.shareLink, img, this.user_id, this.num,
						(res) => {
							console.log(res)
							this.num = res
						});//callback回调取值
					// const nums = this.$wxH5Share.get_share(1, this.radiovalue1, this.dect, this.shareLink, img, this.user_id,
					// 	this.num);
					// nums.then(res => {//promise用.than取值
					// 	console.log(res)
					// 	this.num = res
					// })
					// async () => {//promise用async，await取值
					// 	let nums = await this.$wxH5Share.get_share(1, this.radiovalue1, this.dect, this.shareLink,img, this.user_id, this.num);
					// 	console.log(nums)
					// 	this.num = nums
					// }
					console.log(this.num)
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: "error",
						duration: 2000
					})
				}
			},

提示：虽然写了成功回调，但是uniH5分享用的是微信分享的新版本，新版本的分享成功回调取消了，所以这个回调是不对的，写上是为了学习promise的使用和callback的使用

APP分享

html里面写两个按钮分别为好友和朋友圈分享

<button type="default" @click="sharef('WXSceneSession')">分享好友</button>
<button type="default" @click="sharef('WXSceneTimeline')">分享朋友圈</button>

js 代码

sharef(scene) {
                //this.shareLink分享的链接地址
                //this.user_id获取的user_id
				console.log(this.shareLink + '?id=' + this.user_id)
				// #ifdef APP-PLUS

				uni.share({
					provider: "weixin",
					scene: scene,
					type: 0,
					href: this.shareLink + '?id=' + this.user_id,
					title: this.radiovalue1,//分享的名称
					summary: this.dect,//分享的简介
					imageUrl: "https://www.zhilongyihuo.com/down/logo.png",//分享的图片
					success: (res) => {
						this.num += 1
						this.shareBack(scene)
						console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
				// #endif
				// #ifdef H5
				uni.showToast({
					title: "点击右上角分享",
					icon: "none",
					duration: 2000
				})

				// #endif

			},
			async shareBack(scene) {//分享成功回调
				var jsapi
				if (scene == "WXSceneSession") {
					jsapi = 1
				} else {
					jsapi = 2
				}
				const res = await this.$myrequest({
					url: '/app/card/shareBack',//示例接口
					method: 'POST',
					header: {
						'token': uni.getStorageSync("token"), //自定义请求头信息
					},
					data: {
						user_id: this.user_id,
						link: this.shareLink + '?id=' + this.user_id,
						jsapi: jsapi,
						title: this.radiovalue1
					}
				})
			}

完结，撒花，有不完整的，还请大佬指正~