微信小程序实现分享至朋友圈的功能来啦

新手学堂026

微信小程序实现分享至朋友圈的功能来啦,第1张

就在7月初,我看到了微信小程序的官网有了分享至微信朋友圈的功能上线beta板,目前只能在android手机显示分享至朋友圈的按钮,iphone手机暂时不支持,但是android手机分享出来的,iphone手机是可以查看的,不多说,先看一下最终的真机上的展示效果(android和iphone手机)

可将小程序页面分享到朋友圈。适用于内容型页面的分享,不适用于有较多交互的页面分享。

小程序页面默认不可被分享到朋友圈,开发者需主动设置“分享到朋友圈”。页面允许被分享到朋友圈,需满足两个条件:

满足上述两个条件的页面,可被分享到朋友圈。

用户在朋友圈打开分享的小程序页面,并不会真正打开小程序,而是进入一个“小程序单页模式”的页面,“单页模式”有以下特点:

可通过判断 场景值 等于 1154 的方法来进行页面适配。另外,在单页模式下,可设置顶部导航栏与页面的相交状态,具体参考 navigationBarFit 配置。

还需留意的是,在单页模式下, wxgetSystemInfo 接口返回的 safeArea 为整个屏幕空间。

小程序“单页模式”适用于纯内容展示场景,可实现的交互与接口能力有限,因此存在如下限制:

对于一些会产生交互的组件或接口,在点击后调用时,会弹 toast 提示“请前往小程序使用完整服务”。为达到良好的用户体验,请注意适配单页模式的接口能力,请勿大量使用被禁用的接口或组件。

需要了解更多,可以具体看看官方:

https://developersweixinqqcom/miniprogram/dev/framework/open-ability/share-timelinehtml

1、目前只支持android手机,但iphone手机可以查看

2、有部分的android手机也显示不了“分享至朋友圈”的按钮(因为目前知识beta版)

3、不久之后肯定会发布正式版本,到时候iphone和android手机都可以实现,现在小伙伴可以尝鲜一波。

4、还有一点值得注意的是:不得存在滥用分享违规行为。如强制用户分享行为;分享立即获得利益的诱导行为;以及通过明示或暗示的样式来达到诱导分享目的的行为等。这也是小程序一开始没推出这个功能的一大原因。

微信会抓取第一张大于300×300的,display不为none的。

微信公众平台有公布接口,毕竟是TX的产品,还是使用官方接口吧

官方的链接微信分享网页的缩略图、链接、标题和摘要

未注册的可能看不到,直接上代码,粗体的是修改

<script>

var imgUrl = 'your imgUrl';

var lineLink = 'your link';

var descContent = "万达狂欢节, 夺宝幸运星大抽奖活动开始啦!";

var shareTitle = '万达狂欢节';

var appid = ' ';//填入你的appid

function shareFriend() {

WeixinJSBridgeinvoke('sendAppMessage',{

"appid": appid,

"img_url": imgUrl,

"img_width": "640",

"img_height": "640",

"link": lineLink,

"desc": descContent,

"title": shareTitle

}, function(res) {

_report('send_msg', reserr_msg);

})

}

function shareTimeline() {

WeixinJSBridgeinvoke('shareTimeline',{

"img_url": imgUrl,

"img_width": "640",

"img_height": "640",

"link": lineLink,

"desc": descContent,

"title": shareTitle

}, function(res) {

_report('timeline', reserr_msg);

});

}

function shareWeibo() {

WeixinJSBridgeinvoke('shareWeibo',{

"content": descContent,

"url": lineLink,

}, function(res) {

_report('weibo', reserr_msg);

});

}

// 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。

documentaddEventListener('WeixinJSBridgeReady', function onBridgeReady() {

// 发送给好友

WeixinJSBridgeon('menu:share:appmessage', function(argv){

shareFriend();

});

// 分享到朋友圈

WeixinJSBridgeon('menu:share:timeline', function(argv){

shareTimeline();

});

// 分享到微博

WeixinJSBridgeon('menu:share:weibo', function(argv){

shareWeibo();

});

}, false);

</script>

1、打开你要分享给好友的网页,找到隐藏按钮,点击分享页面。

2、又或者在你要分享的网页,然后手指点住屏幕不动,过一两秒就有跳出小窗口,也能找到分享网页。

3、接着就会跳出分享方式,选择发送给朋友,并且是微信的分享方式,所以要注意微信的图标。

4、然后跳转到微信页面,点击创建新聊天。

5、输入要分享的好友名字,点击该好友头像。

6、就要看看你是要给几个好友分享,添加的好友会显示在最下面,如果是一个的话,点击确定。

7、接着会跳转到分享的窗口,点击分享。可以输入分享的理由。

8、提示已发送,返回第三方工具,就是回到你刚打开的网站页面。

9、然后回到微信找到该好友查看聊天消息就能看到你刚分享给好友的链接了。

1、如果你是直接使用群发的话,一次只能群发一张;

2、如果你是使用图文群发的话,可以把所有你需要的上传到文章内容里,记得内容必须打上最少一个字符,然后保存群发即可。

第二种方法能一次性发送多张,而第一种呢,只能一次群发一张哦。