当前位置:首页 > 实用技巧 >

浏览器内容如何分享到朋友圈(网页内容如何分享到朋友圈)

来源:原点资讯(www.yd166.com)时间:2023-05-24 23:35:49作者:YD166手机阅读>>

官方文档

微信开放平台的介绍: http://open.weixin.qq.com/intro/

可以看出微信提供了“分享给好友”和“分享到朋友圈”官方接口,效果看起来也很不错。但是,这个接口只适用于 iOS/Android App,并不适用于网页。

除此以外,微信没有公开任何相关资料,也就是说,微信官方没有提供任何从网页分享到微信的解决方案。当然这也可以理解,毕竟微信的整个生态都是建立在手机客户端之上的,目前对网页端缺乏支持也是情理之中。

民间传说

官方不给力,还是求助于民间高人吧。很快,找到了这篇文章:《36氪:如何在网页中添加“分享到朋友圈”按钮》

(下图摘自该文章)

浏览器内容如何分享到朋友圈,网页内容如何分享到朋友圈(1)

有图有真相,36氪自己的网站就是这么做的。当用户使用微信浏览网站时,可以将当前页面分享至朋友圈。

其中的技术原理可以参考“我爱水煮鱼”的一篇教程。简单来说,微信在自己的浏览器(WebView)中埋了一个桥变量 WeixinJSBridge,可以实现 WebView 中的 JavaScript 对外层原生应用的功能调用。显然这是一个私有接口,而很多网站利用了这个未公开的桥变量实现了“分享给好友”、“分享到朋友圈”甚至是“关注微信”这样的功能。

既然如此,开工!

残酷真相

很快在详情页部署了相关脚本,并且确实可以获取到这个桥变量及其 .invoke() 方法,心中不禁一阵窃喜!

浏览器内容如何分享到朋友圈,网页内容如何分享到朋友圈(2)

上面这张图就是 alert() 出来的 WeixinJSBridge.invoke() 方法的源码。虽然是混淆过的,但基本上也可以看得出来它是干什么的。这里遇到一个小坑,WeixinJSBridge 对象会在页面加载一段时间之后才会埋入页面,并且其 .invoke() 方法也要再等一会儿才会生成。当然这都不算什么,因为更大的坑还在后面。

参照民间高人的示例,试着写了个分享到朋友圈的方法,放到微信里测试,怎么都出不来。

“程序写错了?” “不支持开发环境的假域名?” “人品问题?”

在经历了反复的自我否定和反复的否定自我否定之后,我只好继续搜索答案。果然,有网友反映说,从微信 4.2 版开始,这个 WeixinJSBridge 桥变量就不好用了。我一看自己手机上的微信,妈呀,都 4.5 了。

这么说,是微信把原先的“漏洞”给堵上了。好日子到头了,查了一下,果然连 36氪 自己的新版网站也已经找不到这功能了。

退求其次

既然如此,我也就不作梦了,从网页直接分享至微信的功能基本上是不可能实现了。

不过,这并不代表我们不能再做些努力。我发现,微信的浏览器已经整合了分享功能。点击微信浏览器右上角的动作按钮,可以选择各种分享方式和其它操作。既然如此,我们至少还可以提醒用户——“微信也能分享哦”!

浏览器内容如何分享到朋友圈,网页内容如何分享到朋友圈(3)

至此,这个需求算是告一段落,老板在了解到我的坎坷经历后,对这个结果还是比较满意的。

希望本文能帮助到您!

点赞 转发,让更多的人也能看到这篇内容(收藏不点赞,都是耍流氓-_-)

关注 {我},享受文章首发体验!

每周重点攻克一个前端技术难点。更多精彩前端内容私信 我 回复“教程”

原文链接:https://github.com/cssmagic/blog/issues/7

浏览器内容如何分享到朋友圈,网页内容如何分享到朋友圈(4)

栏目热文

浏览器里没有我喜欢的文章怎么办(怎么在浏览器上看自己发的文章)

浏览器里没有我喜欢的文章怎么办(怎么在浏览器上看自己发的文章)

对于一个网站的建设来说,一些高质量的优质文章内容,例如时事、资讯等等,对于网站整体质量的提升有一个很好的帮助。虽然对于各...

2023-05-24 23:44:05查看全文 >>

朋友圈发的文章在电脑上找不到(朋友圈发的文章打不开咋办)

朋友圈发的文章在电脑上找不到(朋友圈发的文章打不开咋办)

有时我们在朋友圈看到不错的文章,那么怎么保存呢?那怎么才能保存在电脑上,方法很简单,接下来小编给大家带来微信朋友圈中的文...

2023-05-24 23:45:00查看全文 >>

文章分享到朋友圈了却看不到(微信朋友圈分享的文章不在了)

文章分享到朋友圈了却看不到(微信朋友圈分享的文章不在了)

震惊了!成功转发至朋友圈的头条,居然只有自己可见?!只有我自己的朋友圈是这样的,还是大家都有同样的困扰?既然能发,我又没...

2023-05-24 23:38:13查看全文 >>

如何分享浏览器里的文章到朋友圈(网页里的文章怎么分享到朋友圈里)

如何分享浏览器里的文章到朋友圈(网页里的文章怎么分享到朋友圈里)

来源:烩运营公众号(微信号:hyyclub)作者:好运姐6月28日微信更新了两个功能1个是预览文章短期内会失效1个是留言...

2023-05-24 23:32:08查看全文 >>

浏览器里的东西怎么发送到朋友圈(怎么把浏览器原文发到朋友圈)

浏览器里的东西怎么发送到朋友圈(怎么把浏览器原文发到朋友圈)

朋友们大家好!我们又见面了,很高兴和大家一起讨论微信的使用技巧,我是一个专门分享实用小知识,小技巧的有心人。我自己懂得的...

2023-05-24 23:31:34查看全文 >>

发朋友圈没有浏览量怎么回事(朋友圈浏览量在哪里看)

发朋友圈没有浏览量怎么回事(朋友圈浏览量在哪里看)

我们或许有过这样的经历,不管什么时候发朋友圈,总像石沉大海。既没有人反馈和咨询,也没有人点赞,更没有人评论!如果是发一次...

2023-05-24 23:14:41查看全文 >>

发朋友圈怎样不显示浏览器(发朋友圈没有浏览量怎么回事)

发朋友圈怎样不显示浏览器(发朋友圈没有浏览量怎么回事)

微信 v8.0.3在昨日晚间,微信 iOS 版本推出了大版本更新 v8.0.3 ,本次对于微信用户而言,又是一次功能性上...

2023-05-24 23:44:41查看全文 >>

电视总是显示省电模式是怎么回事(电视显示省电模式黑屏)

电视总是显示省电模式是怎么回事(电视显示省电模式黑屏)

IFA 2017展会正在德国柏林如火如荼的进行当中,三星作为全球电子巨头,早已成为了IFA上的常客,并且每年三星都占据着...

2023-05-24 23:15:27查看全文 >>

电视开机显示省电模式怎么办(电视出现省电模式怎么调回来)

电视开机显示省电模式怎么办(电视出现省电模式怎么调回来)

近日,三星举办“画·壁”全球首发上市活动,并宣布启动全球展示会计划。全球展示会将从瑞士和挪威开启,并逐步进入其它国家,包...

2023-05-24 23:13:50查看全文 >>

电视打开一直待机状态(电视老是待机状态怎么办)

电视打开一直待机状态(电视老是待机状态怎么办)

我家电视机看了3年了,一直就是待机状态,请问TCL液晶电视关机除了拔电源插头,只能待机吗?我研究了三年也没找到电源开关,...

2023-05-24 23:40:33查看全文 >>

文档排行