首页 > 说说大全 正文
发朋友圈给人分享到朋友圈

时间:2022-12-02 05:43:13 阅读: 评论: 作者:佚名

在Uniapp开发中,如果要执行微信共享功能(例如共享微信朋友或发布朋友圈),则只需使用uniapp提供的界面(uni.share)之一。但是这个接口只支持小程序和APP端,H5端不能使用该接口,也不能实现共享功能。

在H5端,我们通常使用以下方案来解决,在给出例子代码之前,我们首先要安装一个模块(jweixin-module),这个模块可以通过NPM的方式来安装(如果没有使用过NPM的,可以先下载Node.js安装到自己电脑后就可以执行NPM命令了),如下图:

Node.js

定位到自己的项目目录后(比如我这里是study)执行NPM命令安装jweixin-module模块到项目

npm install jweixin-module

jweixin-module

安装成功后,会在项目的 node_modules 下生成 jweixin-module ,说明模块安装成功了,接下来我们就可以使用它了。

在任何您想使用该功能的vue/js文件中编写以下代码:

var wx = require('jweixin-module') // 必须获取本地网址进行签名,要不签名会不正确 let url = loca('#')[0] uni.request({ url: 'weixin/signature', // 这个是从服务端获取微信signature签名的接口,可以根据自己的情况修改 data: { url: url } }, function(res) { if == 0 && res.data) { wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId: res.da, // 必填,公众号的唯一标识 timestamp: res.da, // 必填,生成签名的时间戳 nonceStr: res.da, // 必填,生成签名的随机串 signature: res.da, // 必填,签名 jsApiList: ['updateAppMessageShareData','updateTimelineShareData'] }); wx.ready(function() { // 分享给微信好友 wx.updateAppMessageShareData({ title: '分享的标题', imgUrl: '分享的图片' }) // 分享给微信朋友圈 wx.updateTimelineShareData({ title: '分享的图片', imgUrl: '分享的标题' }) }) } })

注意事项:

1)获取微信signature签名的方式在服务端完成,这里不做介绍,具体的可以参考微信开发文档

2)必须先获取signature,然后执行wx.config后才能调用微信分享接口

3)签名传送的url地址,最好是从客户端传参,如果是在服务端生成大概率会签名失败

4)只支持在微信内置浏览器(即公众号)中发起分享,不支持非微信的普通浏览器。

5)此处的微信分享并不是直接调起原生微信分享操作,具体来讲只是设置分享内容,如果需要实际分享,需要点击微信右上角的 原生分享按钮 来实现分享(tips:直接分享的接口微信已不再提供)

以下是总结几个终端的微信分享支持情况:

APP: 好友,朋友圈

微信小程序:好友, 朋友圈(点原生胶囊按钮才可以)

微信公众号(h5):好友(需点页面按钮设置分享内容,然后点原生胶囊按钮实现分享),朋友圈(需点页面按钮设置分享内容,然后点原生胶囊按钮实现分享)

普通浏览器: 不支持

ShopWind电商系统

  • 相关阅读
  • 评论列表

发表评论: