小葫芦
小葫芦
  • 发布:2017-03-03 15:00
  • 更新:2021-08-11 09:50
  • 阅读:12600

【源码分享】分享一个基于官方share.html简化的分享js代码(微信,朋友圈,QQ)

分类:HTML5+

基于官方demo中的share.hml中的分享内容或者链接到微博,微信,QQ,自己简化了一个通用的分享方法,进一步减少分享功能的开发量。

代码附件中,由于不能上传html文件,所以把文件扩展名改成了doc,下载下来后改成share.html就可以了

js代码如下,也可以把文件中的js代码直接放到js文件中。
用法:

//这里的入口方法是   
/**  
 * 分享内容或者链接  
 * @param  {JSON} msgdata 分享数据的对象  
 * msgdata = {‘title’:'','href':'','desc':'','pic':''} 包含4个字段  
 * @param  {Boolean} ishref  是否分享链接  
 */  
function appshare(msgdata, ishref){}  
//例如引入了js文件后,  
appshare({'title':'DCloud HBuilder-做最好的HTML5开发工具','href':'http://www.dcloud.io/','desc':'我正在使用HBuilder+HTML5开发移动应用,赶紧跟我一起来体验!','pic':'_www/img/logo.png'},true)

具体js代码:


var shares = null;  
mui.plusReady(function() {  
    // 更新分享服务  
    plus.share.getServices(function(s) {  
        shares = {};  
        for(var i in s) {  
            var t = s[i];  
            shares[t.id] = t;  
        }  
    }, function(e) {  
        mui.toast("无享服务!");  
        console.log("获取分享服务列表失败:" + e.message);  
    });  
});  

/**  
 * 分享操作  
 * @param {JSON} sb 分享操作对象s.s为分享通道对象(plus.share.ShareService)  
 * @param {Boolean} ishref 是否分享链接  
 * @param {JSON} msginfo 分享内容  
 */  

function shareAction(sb, ishref, msginfo) {  
    if(!sb || !sb.s) {  
        mui.toast("无效的分享服务!");  
        return;  
    }  
    var msg = { content: msginfo.content, extra: { scene: sb.x } };  
    if(ishref) {  
        msg.title = msginfo.title;  
        msg.href = msginfo.href;  
        msg.content = msginfo.content;  
        msg.thumbs = [msginfo.pic];  
        msg.pictures = [msginfo.pic];  
    }  
    // 发送分享  
    if(sb.s.authenticated) {  
        console.log("---已授权---");  
        shareMessage(msg, sb.s);  
    } else {  
        console.log("---未授权---");  
        sb.s.authorize(function() {  
            shareMessage(msg, sb.s);  
        }, function(e) {  
            console.log("认证授权失败:" + e.code + " - " + e.message);  
        });  
    }  
}  

/**  
 * 发送分享消息  
 * @param {JSON} msg  
 * @param {plus.share.ShareService} s  
 */  
function shareMessage(msg, s) {  
    s.send(  
        msg,  
        function() {  
            mui.toast("分享到\"" + s.description + "\"成功! ");  
        },  
        function(e) {  
            mui.toast("分享到\"" + s.description + "\"失败! ");  
            // console.log("分享到\"" + s.description + "\"失败: " + JSON.stringify(e));  
        }  
    );  
}  

/**  
 * 分享内容或者链接  
 * @param  {JSON} msgdata 分享数据的对象  
 * @param  {Boolean} ishref  是否分享链接  
 */  
var appshare = function (msgdata, ishref) {  
    // 分享参数  
    if(ishref){  
        var msginfo = { title: msgdata.title, href: msgdata.href, content: msgdata.desc, pic: msgdata.pic };  
    }else{  
        var msginfo = { content: msgdata.desc };  
    }  

    var shareBts = [];  
    // 更新分享列表  
    var ss = shares['weixin'];  
    ss && ss.nativeClient && (shareBts.push({ title: '微信朋友圈', s: ss, x: 'WXSceneTimeline' }), shareBts.push({ title: '微信好友', s: ss, x: 'WXSceneSession' }));  

    ss = shares['qq'];  
    ss && ss.nativeClient && shareBts.push({ title: 'QQ', s: ss });  

    if(!ishref){  
        ss = shares['sinaweibo'];  
        ss && shareBts.push({ title: '新浪微博', s: ss });  
    }  

    // 弹出分享列表  
    shareBts.length > 0 ? plus.nativeUI.actionSheet({  
            title: '分享',  
            cancel: '取消',  
            buttons: shareBts  
        },  
        function(e) {  
            (e.index > 0) && shareAction(shareBts[e.index - 1], ishref, msginfo);  
        }  
    ) : plus.nativeUI.alert('当前环境无法支持分享操作!');  
}  
5 关注 分享
BoredApe Trust lhyh 阎宸晏 aliang888

要回复文章请先登录注册

1***@qq.com

1***@qq.com

能否分享文件
2021-08-11 09:50
1***@qq.com

1***@qq.com

plus.share.getServices 返回是空是怎么回事啊
2020-05-21 09:50
_Denging

_Denging

安卓的qq 新浪微博无法分享
2019-04-17 10:07
7***@qq.com

7***@qq.com

谢谢,很有帮助。
2019-02-11 18:01
5***@qq.com

5***@qq.com

你好,如果我刚才安卓你的代码,不填写title,href,值,只是设置thumbs,pictures值,我想分享一张图片,选择微信朋友圈,会直接提示我分享成功,但是实际并没有成功,为什么会出现这样的问题呢
2017-12-23 14:00
bobplay

bobplay

安卓qq分享就是当前环境无法支持分享操作,微信是可以的为什么呢
2017-07-25 19:07