uniapp 开发H5做微信分享

1. 安装引入js

 //npm安装的引用 （推荐用npm安装）
 var jweixin = require('jweixin-module')
 //网上下载根据路径引用 
 var jweixin = require('../../common/jweixin-module')

2. 在app.vue的onLaunch中配置

//#ifdef H5
 var jweixin = require('jweixin-module')
 const url = encodeURIComponent(window.location.href.split('#')[0]);
 getJSSDK(url).then((res) => {
    if (res.data.code == 200) {
	jweixin.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
            appId: '**********', // 必填，公众号的唯一标识
            timestamp: res.data.data.timestamp, // 必填，生成签名的时间戳
            nonceStr: res.data.data.noncestr, // 必填，生成签名的随机串
            signature: res.data.data.signature, // 必填，签名
            jsApiList: ['updateAppMessageShareData',
            'updateTimelineShareData'] // 必填，需要使用的JS接口列表
	});
					// 在配置分享内容之前，还可以先检测一下jsApi是否可用
	jweixin.checkJsApi({
            jsApiList: ['updateAppMessageShareData','updateTimelineShareData'
		], // 需要检测的JS接口列表，所有JS接口列表见附录2,
            success: (res) => {
		// 以键值对的形式返回，可用的api值true，不可用为false
		console.log(res);
            // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
            }
	});
	jweixin.ready(function() { //需在用户可能点击分享按钮前就先调用
	///配置自定义分享内容
            let options = {
		title: '粤达富', // 分享标题
		desc: '粤达富', // 分享描述
		link: location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号 JS 安全域名一致
		imgUrl: 'https://www.yuedayunzhi.com/images/weixinfenxiang.png', // 分享图标
		success: function() {
			console.log('设置成功2222222')
		},
		cancel: function() {}
            }
	jweixin.updateAppMessageShareData(options)
	jweixin.updateTimelineShareData(options)
	});
    jweixin.error(function(res) {
        console.log('wx.----err---------', res)
    })
}
})
//#endif`

3. 服务端接收到url返回签名信息数据样例

{
  "data": {
    "signature": "fe11b8b14c987ee80a106fbfa2ffac219c8d77",
    "noncestr": "iYW03CmbqinmnB3nMr01Q6CunADvFw",
    "timestamp": 1662436212
  },
  "success": true,
  "code": 200,
  "message": null
}

4. 调试

• 对于微信中的调试可以借助微信开发者工具，具体可以在官网下载
• 在调试过程中可能会遇到诸如签名错误等问题，可以借助微信 JS 接口签名校验工具

5. 遇到的问题

• 一开始我使用官网下载的js_sdk然后调试就一直报 { "noPermissionJsApi": [], "errMsg": "config:ok" }这个问题 ，后通过npm重新安装js_sdk替换官网下载的解决了此问题。

6. 总结

• 一开始遇到问题搜了很多社区都没有解决方法，只能自己慢慢试，看源码，然后对比，我也是第一次开发这个，大家有问题可以一起讨论！！！ 前端菜鸟卷起来！！！