微信朋友圈API分享代码自定义图标和分享链接

时间:2014-08-06 15:48:54

最近在做微信公众号,在设计一些html5页面时,通过微信内置浏览器访问页面分享后,希望可以自定义小图标(imgUrl)和分享链接(lineLink),下面下微信内置浏览器分享功能的JS代码,希望对大家有所帮助。

微信朋友圈API分享代码自定义图标和分享链接

       var imgUrl = "https://www.huceo.com/logo.jpg";  //注意必须是绝对路径

       var lineLink = "https://www.huceo.com/wdt.html";   //同样,必须是绝对路径
       var descContent = '最轻便的微电台精选,天天更新,你听或是不听,我都这里等着你。'; //分享给朋友或朋友圈时的文字简介
       var shareTitle = '微信电台精选';  //分享title
       var appid = ''; //apiID,可留空
       
       function shareFriend() {
           WeixinJSBridge.invoke('sendAppMessage',{
               "appid": appid,
               "img_url": imgUrl,
               "img_width": "200",
               "img_height": "200",
               "link": lineLink,
               "desc": descContent,
               "title": shareTitle
           }, function(res) {
               //_report('send_msg', res.err_msg);
           })
       }
       function shareTimeline() {
           WeixinJSBridge.invoke('shareTimeline',{
               "img_url": imgUrl,
               "img_width": "200",
               "img_height": "200",
               "link": lineLink,
               "desc": descContent,
               "title": shareTitle
           }, function(res) {
                  //_report('timeline', res.err_msg);
           });
       }
       function shareWeibo() {
           WeixinJSBridge.invoke('shareWeibo',{
               "content": descContent,
               "url": lineLink,
           }, function(res) {
               //_report('weibo', res.err_msg);
           });
       }
       // 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。
       document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
           // 发送给好友
           WeixinJSBridge.on('menu:share:appmessage', function(argv){
               shareFriend();
           });
           // 分享到朋友圈
           WeixinJSBridge.on('menu:share:timeline', function(argv){
               shareTimeline();
           });
           // 分享到微博
           WeixinJSBridge.on('menu:share:weibo', function(argv){
               shareWeibo();
           });
       }, false);


免费分享了微信html5小游戏源码大家可以点击进入下载哦,游戏空间或开发平台建议使用新浪云SAE,邀请注册地址:https://www.sinacloud.com/public/login/inviter/gaimrn-mddmzeKWrhKWnaoGem699eIGvfoy6dg.html ,除了一定的免费额度外,新用户通过邀请地址首次注册可获得200云豆奖励,首次充值可获得600云豆奖励。


2015.01.09微信开放了JS-SDK,原有的分享方式全部失效,新的方法:怎么使用微信JSSDK的自定义分享功能



本站所有文章均为小宇博客原创,转载请注明来源及出处!

作者:宇天行 (关于我

本文首发地址:https://www.huceo.com/post/368.html

或许您还会喜欢这些文章:

Tags: 作者:宇天行 | 分类:开发技术 | 评论:78 | 浏览:132765

您正在以游客身份发表评论:

必填

选填

选填

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

电商专供2021-07-03 10:38:29回复评论
了解了,努力!
访客2020-09-24 11:28:09回复评论
我网上找的这个,可以自己设置标题图片
http://www.1024p.cn/index.html
luozhiyuan2017-07-25 23:00:22回复评论
2017最新方案,外部链接可以直接WAP跳转到微信中打开链接,支持支付接入,可携带支付参数完成付款,支持安卓和IOS,方法我已经系统化,直接给普通用户提供API接口,需要的可以直接找我拿 QQ 7 7 4 0 8 0 2 6
微信疑难工具http://www.api-export.com/
很好得文章啊,学习到了很多。
谢谢分享
博主文章写得不错,赞一个
爱峰2016-12-21 14:33:06回复评论
这个可以直接用吗?
宇天行2016-12-22 13:22:08回复评论
不可以了,请问新的JSSDK分享代码
seo2016-12-18 14:12:00回复评论
博主的博文内容丰富 顶一个
宇天行2016-12-18 14:12:00回复评论
做微信自媒体的朋友可以关注我的公众号,在天行微社区或者加微信群与众多大神一起交流。
e广告联盟2016-12-18 14:12:00回复评论
博主文章写得不错 赞一个
文哥2016-12-18 14:12:00回复评论
楼主您的QQ是什么。我有个问题想请教一下您,可以吗?就是我做个网站,用了这些代码,为什么在分享的时候还是在显示,网址呢?
宇天行2016-12-18 14:12:00回复评论
加微信xxpwxzh
seo2016-12-18 14:12:00回复评论
我喜欢你的文章
我正想弄,一直找不到相关的代码。
宇天行2016-12-18 14:12:00回复评论
微信刚刚开放了JS-SDK。新的分享接口看这里https://www.huceo.com/post/391.html
mike2016-12-18 14:12:00回复评论
现在微信6.0.2里不管用了,这个怎么解决呢?
评论者2016-12-18 14:12:00回复评论
https://github.com/zxlie/WeixinApi 这个应该有帮助的
宇天行2016-12-18 14:12:00回复评论
微信取消了接口,暂时还没啥办法。
评论者2016-12-18 14:12:00回复评论
感谢博主的分享,代码使用时发现在6.0的版本起作用,而最新的6.0.2的分享时候,能取到图片,分享的内容描述那不起作用,不知博主那可以吗?
宇天行2016-12-18 14:12:00回复评论
我测试下,可能是微信6.0.2更改了分享接口
deng2016-12-18 14:12:00回复评论
使用你的方法进行了实验,试验转发给好友功能,发现在使用安卓+微信6.0时,描述信息能正常显示,但是使用 iphone 5s + 微信 6.0.2 时,描述信息不能正常显示,取而代之在描述信息位置显示的是链接地址。请问怎么才能让描述信息正常显示出来。
宇天行2016-12-18 14:12:00回复评论
我估计是分享函数容易被利用造成欺骗性网页信息,微信取消了接口。
deng2016-12-18 14:12:00回复评论
嗯,结合一些其它的信息表明,应该是干掉了微信分享接口,谢谢楼主帮了我一个大忙,不然我还要在这个问题上花费比较多时间,谢谢。
宇天行2016-12-18 14:12:00回复评论
不客气!
评论者2016-12-18 14:12:00回复评论
同谢博主!
宇天行2016-12-18 14:12:00回复评论
我试下,可能是微信6.0.2更改了分享接口。。
评论者2016-12-18 14:12:00回复评论
hi,我刚才也是发现了这个问题,不知你是否解决了呢?猜测是微信那里做了什么更改了又~
deng2016-12-18 14:12:00回复评论
还没解决这个问题,我仔细看了一下,发现不仅仅是描述信息获取不到,而且连title的获取,也不是从js代码里面来的,在转发给好友时,上面显示的title其实是从来的,而不是从我们回调函数的那个“title" 那里来的,所以我怀疑这个函数可能根本就没有调用到,或者是微信的接口变了。
deng2016-12-18 14:12:00回复评论
刚才文字被截掉了一些,完整的说法是,title是从title标签来的,而不是从回调函数的那个"title"那里来的。
评论者2016-12-18 14:12:00回复评论
嗯嗯,了解,是从title 标签里取出来的。
api网址呢?
问道网2016-07-29 14:41:51回复评论
评论不给百度收录,隐藏了,留外链的没用
东南亚电商2016-03-07 01:04:23回复评论
[吃惊] 不错哦,赞一个。
晨晨2016-03-01 17:18:58回复评论
博主大神,原谅小女子是个初学者,想请教一下,php页面的话,这段代码要怎么引入好使呢?
宇天行2016-03-01 17:39:04回复评论
这样,你先加下我微信吧,右上角扫一下二维码我看到了就回你。
晨晨2016-03-01 17:29:39回复评论
找到你的另一篇博客了 非常实用
mygia2015-12-07 16:22:41回复评论
我刚好今天研究了
很丰富,不错
鞍山旅行社2015-12-07 16:19:34回复评论
赞一个
seo2015-04-24 00:12:04回复评论
博主的博文内容丰富 顶一个
宇天行2015-04-17 15:26:31回复评论
做微信自媒体的朋友可以关注我的公众号,在天行微社区或者加微信群与众多大神一起交流。<br/><img src="http://down.huceo.com/js/huceo.png" alt="huceo.png" />
宇天行2015-04-17 15:13:27回复评论
做微信自媒体的朋友可以关注我的公众号,<img src="http://down.huceo.com/js/huceo.png" alt="huceo.png" />,在天行微社区或者加微信群与众多大神一起交流。
e广告联盟2015-04-14 21:21:57回复评论
博主文章写得不错 赞一个
宇天行2015-04-14 12:38:55回复评论
加微信xxpwxzh
文哥2015-04-13 10:35:48回复评论
楼主您的QQ是什么。我有个问题想请教一下您,可以吗?就是我做个网站,用了这些代码,为什么在分享的时候还是在显示,网址呢?
宇天行2015-04-14 12:38:55回复评论
加微信xxpwxzh
seo2015-04-11 16:42:23回复评论
我喜欢你的文章
游客2015-01-28 13:40:49回复评论
我正想弄,一直找不到相关的代码。
宇天行2015-01-09 20:32:29回复评论
微信刚刚开放了JS-SDK。新的分享接口看这里<a href="http://www.huceo.com/post/391.html" target="_blank">http://www.huceo.com/post/391.html</a>
游客2015-01-09 16:12:43回复评论
https://github.com/zxlie/WeixinApi 这个应该有帮助的
宇天行2015-01-08 09:14:37回复评论
微信取消了接口,暂时还没啥办法。
mike2015-01-07 12:24:33回复评论
现在微信6.0.2里不管用了,这个怎么解决呢?
游客2015-01-09 16:12:43回复评论
https://github.com/zxlie/WeixinApi 这个应该有帮助的
宇天行2015-01-08 09:14:37回复评论
微信取消了接口,暂时还没啥办法。
游客2015-01-06 21:21:11回复评论
同谢博主! <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0c/ws_org.gif" alt="[握手]" title="[握手]" class="ds-smiley" />
宇天行2015-01-06 19:43:06回复评论
不客气!
游客2015-01-06 21:21:11回复评论
同谢博主! <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0c/ws_org.gif" alt="[握手]" title="[握手]" class="ds-smiley" />
deng2015-01-06 17:26:46回复评论
嗯,结合一些其它的信息表明,应该是干掉了微信分享接口,谢谢楼主帮了我一个大忙,不然我还要在这个问题上花费比较多时间,谢谢。 <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/36/gza_org.gif" alt="[鼓掌]" title="[鼓掌]" class="ds-smiley" />
宇天行2015-01-06 19:43:06回复评论
不客气!
游客2015-01-06 21:21:11回复评论
同谢博主! <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0c/ws_org.gif" alt="[握手]" title="[握手]" class="ds-smiley" />
宇天行2015-01-06 16:24:37回复评论
我估计是分享函数容易被利用造成欺骗性网页信息,微信取消了接口。
deng2015-01-06 17:26:46回复评论
嗯,结合一些其它的信息表明,应该是干掉了微信分享接口,谢谢楼主帮了我一个大忙,不然我还要在这个问题上花费比较多时间,谢谢。 <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/36/gza_org.gif" alt="[鼓掌]" title="[鼓掌]" class="ds-smiley" />
宇天行2015-01-06 19:43:06回复评论
不客气!
游客2015-01-06 21:21:11回复评论
同谢博主! <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0c/ws_org.gif" alt="[握手]" title="[握手]" class="ds-smiley" />
宇天行2015-01-06 16:16:29回复评论
我测试下,可能是微信6.0.2更改了分享接口
宇天行2015-01-06 16:15:48回复评论
我试下,可能是微信6.0.2更改了分享接口。。
游客2015-01-06 15:15:46回复评论
嗯嗯,了解,是从title 标签里取出来的。
deng2015-01-06 15:03:38回复评论
刚才文字被截掉了一些,完整的说法是,title是从title标签来的,而不是从回调函数的那个"title"那里来的。
游客2015-01-06 15:15:46回复评论
嗯嗯,了解,是从title 标签里取出来的。
deng2015-01-06 14:47:04回复评论
还没解决这个问题,我仔细看了一下,发现不仅仅是描述信息获取不到,而且连title的获取,也不是从js代码里面来的,在转发给好友时,上面显示的title其实是从来的,而不是从我们回调函数的那个“title" 那里来的,所以我怀疑这个函数可能根本就没有调用到,或者是微信的接口变了。
deng2015-01-06 15:03:38回复评论
刚才文字被截掉了一些,完整的说法是,title是从title标签来的,而不是从回调函数的那个"title"那里来的。
游客2015-01-06 15:15:46回复评论
嗯嗯,了解,是从title 标签里取出来的。
游客2015-01-06 14:33:44回复评论
hi,我刚才也是发现了这个问题,不知你是否解决了呢?猜测是微信那里做了什么更改了又~
deng2015-01-06 14:47:04回复评论
还没解决这个问题,我仔细看了一下,发现不仅仅是描述信息获取不到,而且连title的获取,也不是从js代码里面来的,在转发给好友时,上面显示的title其实是从来的,而不是从我们回调函数的那个“title" 那里来的,所以我怀疑这个函数可能根本就没有调用到,或者是微信的接口变了。
deng2015-01-06 15:03:38回复评论
刚才文字被截掉了一些,完整的说法是,title是从title标签来的,而不是从回调函数的那个"title"那里来的。
游客2015-01-06 15:15:46回复评论
嗯嗯,了解,是从title 标签里取出来的。
游客2015-01-06 14:32:59回复评论
感谢博主的分享,代码使用时发现在6.0的版本起作用,而最新的6.0.2的分享时候,能取到图片,分享的内容描述那不起作用,不知博主那可以吗?
宇天行2015-01-06 16:16:29回复评论
我测试下,可能是微信6.0.2更改了分享接口
deng2015-01-06 14:15:25回复评论
使用你的方法进行了实验,试验转发给好友功能,发现在使用安卓+微信6.0时,描述信息能正常显示,但是使用 iphone 5s + 微信 6.0.2 时,描述信息不能正常显示,取而代之在描述信息位置显示的是链接地址。请问怎么才能让描述信息正常显示出来。
宇天行2015-01-06 16:24:37回复评论
我估计是分享函数容易被利用造成欺骗性网页信息,微信取消了接口。
deng2015-01-06 17:26:46回复评论
嗯,结合一些其它的信息表明,应该是干掉了微信分享接口,谢谢楼主帮了我一个大忙,不然我还要在这个问题上花费比较多时间,谢谢。 <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/36/gza_org.gif" alt="[鼓掌]" title="[鼓掌]" class="ds-smiley" />
宇天行2015-01-06 19:43:06回复评论
不客气!
游客2015-01-06 21:21:11回复评论
同谢博主! <img src="http://img.t.sinajs.cn/t35/style/images/common/face/ext/normal/0c/ws_org.gif" alt="[握手]" title="[握手]" class="ds-smiley" />
宇天行2015-01-06 16:15:48回复评论
我试下,可能是微信6.0.2更改了分享接口。。
游客2015-01-06 14:33:44回复评论
hi,我刚才也是发现了这个问题,不知你是否解决了呢?猜测是微信那里做了什么更改了又~
deng2015-01-06 14:47:04回复评论
还没解决这个问题,我仔细看了一下,发现不仅仅是描述信息获取不到,而且连title的获取,也不是从js代码里面来的,在转发给好友时,上面显示的title其实是从来的,而不是从我们回调函数的那个“title" 那里来的,所以我怀疑这个函数可能根本就没有调用到,或者是微信的接口变了。
deng2015-01-06 15:03:38回复评论
刚才文字被截掉了一些,完整的说法是,title是从title标签来的,而不是从回调函数的那个"title"那里来的。
游客2015-01-06 15:15:46回复评论
嗯嗯,了解,是从title 标签里取出来的。
api网址呢?
宇天行2014-10-19 13:53:19回复评论
var lineLink的示例链接是随便写的大家不要访问了。。