自定义微信易信平台分享内容

jyluwen 2015-01-19

做人厚道，这是转载地址，是我见过写的比较好的自定义内容分享方法自定义微信易信平台分享内容

当一个链接在微信或易信浏览器里打开时，不管这个链接是公众号里的内容还是扫码打开的链接，分享给好友或是朋友圈时，分享的内容默认从网页中取，包括页面中的图片和title。当页面中没有图片时，会采用平台默认的图片，当页面没有title时，会使用页面的链接地址作为分享的标题。这里可以通过设置shareData对象和调用jsbridge方法自定义分享的数据，包括分享的图片，标题，描述等。

像这种代码太具有依赖性，使用方法完全取决于对方平台的接口，相对来说，维护成本也较高。不过有时为了项目的推广和流量，这样做也是值得的。

1.首先定义shareData对象来保存分享的数据

window.shareData = {
        "imgUrl": "图片链接",
        "tImgUrl": "分享到朋友圈的图片",
        "fImgUrl": "分享给好友的图片",
        "wImgUrl": "分享到微博的图片",
        "timeLineLink": "分享到朋友圈的链接",
        "sendFriendLink": "分享给好友的链接",
        "weiboLink": "分享到微博的连接",
        "tTitle": "分享到朋友圈的标题",
        "tContent": "分享到朋友圈的描述",
        "fTitle": "分享给好友的标题",
        "fContent": "分享给好友的描述",
        "wContent": "分享到微博的内容"
};

如果tImgUrl，fImgUrl，wImgUrl没有的话则从imgUrl里取值。

2.调用jsbridge方法

微信支持分享到好友，朋友圈。易信则支持分享到好友，朋友圈，新浪微博。

客户端处理流程为：

1.检测web是否监听相应的分享事件（'menu:share:appmessage'，'menu:share:timeline'，'menu:share:weibo'），如果web监听这些事件则触发这些事件，没有则到步骤2。

2.检查window下是否定义shareData，如果定义该数据则分享该数据中的内容，没有则到步骤3。

3.使用默认的分享机制(去网页抓取分享内容)。

方法调用，易信为例

1.分享给好友

YixinJSBridge.on('menu:share:appmessage', function (argv) {
    YixinJSBridge.invoke('sendAppMessage', { 
        "img_url": window.shareData.imgUrl,
        "img_width": "640",
        "img_height": "640",
        "link": window.shareData.sendFriendLink,
        "desc": window.shareData.fContent,
        "title": window.shareData.fTitle
    }, function (res) {
        不用处理，客户端会有分享结果提示
    })
});

2.分享到朋友圈

YixinJSBridge.on('menu:share:timeline', function (argv) {
    YixinJSBridge.invoke('shareTimeline', {
        "img_url": window.shareData.imgUrl,
        "img_width": "640",
        "img_height": "640",
        "link": window.shareData.timeLineLink,
        "desc": window.shareData.tContent,
        "title": window.shareData.tTitle
    }, function (res) {
        不用处理，客户端会有分享结果提示
    });
});

3.分享到微博

YixinJSBridge.on('menu:share:weibo', function (argv) {
    YixinJSBridge.invoke('shareWeibo', {
        "content": window.shareData.wContent,
        "url": window.shareData.weiboLink,
    }, function (res) {
        不用处理，客户端会有分享结果提示
    });
});

易信最新版本支持。

3.案例说 

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>个性化定制微信易信平台分享内容</title>
</head>

<body>
<div class="m-shareintro">当一个链接在微信或易信浏览器里打开时，不管这个链接是公众号里的内容还是扫码打开的链接，分享给好友或是朋友圈时，分享的内容默认从网页中取，包括页面中的图片和title。当页面中没有图片时，会采用平台默认的图片，当页面没有title时，会使用页面的链接地址作为分享的标题。这里可以通过设置shareData对象和调用jsbridge方法自定义分享的数据，包括分享的图片，标题，描述等。</div>
<script>
 window.shareData = {
     "imgUrl": 'http://m3.img.srcdd.com/farm5/d/2014/1012/21/791FDBCEFB8B31A0AF6EFBFE84CB41D7_B250_400_250_302.jpeg',   
     "tImgUrl": "http://m1.img.srcdd.com/farm4/d/2014/1012/21/E01EA983123F6279E784F17A37DFDC7B_B250_400_250_250.jpeg",
     "fImgUrl": "http://m2.img.srcdd.com/farm4/d/2014/1012/21/A77FB27F302693357F48BD6273768896_B250_400_250_270.jpeg",
     "wImgUrl": "http://m3.img.srcdd.com/farm5/d/2014/1012/21/B049FFAA94A568378BE08887609265E2_B250_400_250_265.jpeg",
     "timeLineLink": location.href,
     "sendFriendLink": location.href,
     "weiboLink": location.href,
     "tTitle": "分享到朋友圈的标题",
     "tContent": "分享到朋友圈的描述",
     "fTitle": "分享给好友的标题",
     "fContent": "分享给好友的描述",
     "wContent": "分享到微博的内容"
 };
 
 //分享给好友
 var _weixinSendAppMessage = function(){
     WeixinJSBridge.on('menu:share:appmessage', function (argv) {
         WeixinJSBridge.invoke('sendAppMessage', { 
             "img_url": window.shareData.imgUrl,
             "img_width": "640",
             "img_height": "640",
             "link": window.shareData.sendFriendLink,
             "desc": window.shareData.fContent,
             "title": window.shareData.fTitle    //必填项，分享的标题
         }, function (res) {
             //不用处理，客户端会有分享结果提示
         })
     });
 };
 
 //分享到朋友圈
 var _weixinShareTimeline = function(){
     WeixinJSBridge.on('menu:share:timeline', function (argv) {
         WeixinJSBridge.invoke('shareTimeline', {
             "img_url": window.shareData.imgUrl,
             "img_width": "640",
             "img_height": "640",
             "link": window.shareData.timeLineLink,
             "desc": window.shareData.tContent,
             "title": window.shareData.tTitle      
         }, function (res) {
             //不用处理，客户端会有分享结果提示
         });
     });
 };
     
 //分享给好友
 var _yixinSendAppMessage = function(){
     YixinJSBridge.on('menu:share:appmessage', function (argv) {
         YixinJSBridge.invoke('sendAppMessage', { 
             "img_url": window.shareData.imgUrl,
             "img_width": "640",
             "img_height": "640",
             "link": window.shareData.sendFriendLink,
             "desc": window.shareData.fContent,
             "title": window.shareData.fTitle    //必填项，分享的标题
         }, function (res) {
             //不用处理，客户端会有分享结果提示
         })
     });
 };
 
 //分享到朋友圈
 var _yixinShareTimeline = function(){
     YixinJSBridge.on('menu:share:timeline', function (argv) {
         YixinJSBridge.invoke('shareTimeline', {
             "img_url": window.shareData.imgUrl,
             "img_width": "640",
             "img_height": "640",
             "link": window.shareData.timeLineLink,
             "desc": window.shareData.tContent,
             "title": window.shareData.tTitle
         }, function (res) {
             //不用处理，客户端会有分享结果提示
         });
     });
 };
 
 //分享到微博
 var _yixinShareWeibo = function(){
     YixinJSBridge.on('menu:share:weibo', function (argv) {
         YixinJSBridge.invoke('shareWeibo', {
             "content": window.shareData.wContent,
             "url": window.shareData.weiboLink,
         }, function (res) {
             //不用处理，客户端会有分享结果提示
         });
     });    
 };
 
 if(navigator.userAgent.toLowerCase().indexOf('micromessenger')>0) {
     if(!!window.WeixinJSBridge){
         _weixinSendAppMessage();
         _weixinShareTimeline();
     }else{
         document.addEventListener('WeixinJSBridgeReady',function(){
             _weixinSendAppMessage();
             _weixinShareTimeline();
         },false);
     }
 }else if(navigator.userAgent.toLowerCase().indexOf('yixin') > 0){
     if(!!window.YixinJSBridge){
         _yixinSendAppMessage();
         _yixinShareTimeline();
     }else{
         document.addEventListener('YixinJSBridgeReady', function() {
             _yixinSendAppMessage();
             _yixinShareTimeline();
         },false);
     }
 }
</script>
</body>
</html>
jyluwen

jyluwen

相关推荐

SaaS下半场，企业服务厂商如何走？

近两年，在互联网领域，“下半场”一词被频频提及，对于基于互联网技术而生的SaaS，从上半场到下半场，又经历了什么呢？SaaS厂商又当做些什么来迎接未来的挑战呢？从2012年开始，SaaS行业涌现了第一批创业公司，他们平均融资金额为3700万，融资数量为31

85457200 / 0评论 2019-10-22

中电信携网易今日推即时通信工具“易信”

<Palign=center></P><Palign=center>此前曝光的易信的朋友圈</P><Pstyle="TEXT-INDENT:2em">腾讯科技讯8月19日消息，

kaifaer / 0评论 2013-10-08

为什么微信能干掉微博

传统APP和轻应用相比无非多了一些更加个性的设计，但是这些都不足够吸引用户。伴随着轻应用的崛起，传统的APP逐渐走向衰落。从微信公众号的火爆和百度轻应用的迅速崛起，可以看出来，移动APP的发展方向开始走向用户强关系化、功能便捷化、应用移动化的道路。下面是笔

timy0 / 0评论 2014-02-07

创建入口式SaaS平台 这些公司还要做什么？

近期，无论是上班时挤地铁、公司楼下等电梯，还是身处去出差的机场或高铁里，稍微关注一点SaaS行业的人士就会发现，似乎在哪里都能看到阿里钉钉和纷享销客的广告。两家都投入了上亿元巨额资金，将品牌广告覆盖到包括移动客户端在内的各媒体平台，以及地铁、机场、高铁、写

89427302 / 0评论 2016-01-14

易信青果进军互联网农业 打造看得见的食品安全

随着“互联网+”时代的到来，农业产品电商平台愈来愈注重线上线下的融合和客户的场景化体验，通过线上线下联动的模式提升农产品的附加值和核心竞争力。在这一契机的催化下，易信青果作为农业直播的前行者，牵手农仁街共同搭建“农业+直播+销售”的新型交易平台，利用当下风

新经济100人 / 0评论 2018-01-31

易信6.3版本智能优化升级：精准匹配 “碰”到更有趣的人

“斗的不过瘾，还想和刚刚那位帅气的小哥哥再玩一局斗脸！”易信“碰呗”模块下魔性十足的斗脸玩法一经上线，吸引大批玩家嗨玩不停。针对用户对斗脸游戏越来越多的心理诉求，日前于全平台上新的易信6.3版本完成了智能化升级，实现“斗脸”玩家的多次畅玩，还可参考用户的属

妇产科门诊第十一诊室 / 0评论 2018-01-10

钉钉悄然用户破亿, 异军突起后会不会突入个人社交市场?

自从马云的来往和丁磊的易信挑战微信失败之后，都以为中国互联网IM市场上微信一家独大的局面从此严丝合缝，再难撼动，但谁知道就在2017年年底，钉钉忽然为IM市场投下一块石头，掀起波澜。这一天，距离钉钉正式发版3周年正好还有20天。根据腾讯公布的2017年第三

小饭桌 / 0评论 2018-01-03

易信青果云管家开启智能监控 力助中国电信加速智慧家庭生态建设

12 月 19 日，中国电信 2017 智慧家庭产品发布会在广州塔“小蛮腰”举行，发布会现场围绕视频通话、智慧家庭统一手机客户端和智能家居开放平台等领域展出多款科技新品，其中，视频通话终端硬件之一易信青果智能摄像机搭配天翼高清机顶盒，涵盖家中老中青三代人，

故事贩卖机 / 0评论 2017-12-25