h5项目微信分享（以卡片形式，带标题和图片）

1. 注册成为微信开放平台开发者

首先，你需要有一个微信公众平台的账号，并且你的小程序或公众号需要获得网页授权能力。这一步骤涉及在微信开放平台注册并创建小程序或公众号，获取AppID和AppSecret。

2. 配置安全域名

在微信公众平台的小程序或公众号后台，你需要将你的H5项目的域名添加到“公众号/小程序”的“JS接口安全域名”中，这样微信JS-SDK才能在该域名下正常工作。

3. 获取Access Token和JSAPI Ticket

为了使用微信JS-SDK，你需要先通过AppID和AppSecret从微信服务器获取Access Token，然后再用Access Token换取JSAPI Ticket。这一步通常在你的服务器端完成，因为AppSecret不应暴露在前端。

4. 引入微信JS-SDK

在你的H5页面中，通过以下方式引入微信JS-SDK：（全局配置，建议在index.html页面）

<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

5. 配置微信JS-SDK(通过后端接口获取参数)

在页面加载完成后，使用获取到的JSAPI Ticket配置微信JS-SDK：

wx.config({
				debug: false, // 开启调试模式，调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				appId: 'yourAppId', // 必填，公众号的唯一标识
				timestamp: timestamp, // 必填，生成签名的时间戳
				nonceStr: nonceStr, // 必填，生成签名的随机串
				signature: signature, // 必填，签名
				jsApiList: [
					'updateAppMessageShareData',
					'updateTimelineShareData',
					'onMenuShareAppMessage',
					'onMenuShareTimeline'
				] // 必填，需要使用的JS接口列表
			});

6. 设置分享内容

配置好JS-SDK后，你可以设置分享到朋友圈或发送给朋友的分享卡片内容：

wx.ready(function() {
				// 分享给朋友
				wx.updateAppMessageShareData({
					title: 'title', // 分享标题
					desc: 'describ', // 分享描述
					link: 'link', // 分享链接，必须与当前页面对应的公众号 JS 接口安全域名一致
				
					imgUrl: 'imgurl', // 分享图标
					success: function(res) {
						// 分享成功后的回调函数
					},
					cancel: function() {
						// 用户取消分享后执行的回调函数
					}
				});
});

7. 完整代码如下：

getWxConfig(title, describ, imgurl, link) {
				console.log("这是getWxConfig")
				const self = this;
				var url = window.location.href;
				$.ajax({
					url: 'common/wxSharing',
					data: {
						url: url,
					},
					method: 'GET',
					success(res) {
						var configData = JSON.parse(res.data.signData)
						if (res.code == 200) {
							wx.config({
								debug: false, 生产环境需要关闭debug模式
								appId: configData.appId, //appId通过微信服务号后台查看
								timestamp: configData.timestamp, //生成签名的时间戳
								nonceStr: configData.nonceStr, //生成签名的随机字符串
								signature: configData.signature, //签名
								jsApiList: ['updateAppMessageShareData']
							});
							wx.ready(function() {
								// 分享给朋友
								wx.updateAppMessageShareData({
									title: title, // 分享标题
									desc: describ, // 分享描述
									link: link, // 分享链接，必须与当前页面对应的公众号 JS 接口安全域名一致

									imgUrl: imgurl, // 分享图标
									success: function(res) {
										// 分享成功后的回调函数
									},
									cancel: function() {
										// 用户取消分享后执行的回调函数
									}
								});
							});

							// 配置失败的回调
							wx.error(function(res) {
								console.log('微信配置错误:', res);
							});

						}
					},
					complete(data) {}
				})
			}