首页 > 建站教程 > APP开发,混合APP >  MUI 分享功能(微信、QQ 、朋友圈)正文

MUI 分享功能(微信、QQ 、朋友圈)

分享一篇详细的关于mui分享到微信、朋友圈和QQ的参考文档:

配置文件:manifest.json

plus ->plugins 下边
01"share": {/*配置应用使用分享功能,参考http://ask.dcloud.net.cn/article/27*/
02     "qq": {
03        "appid": "",/*腾讯QQ开放平台申请应用的AppID值*/
04        "description": "QQ分享"
05       },
06     "weixin": {
07         "appid": "",/*微信开放平台申请应用的AppID值*/
08         "appsecret": "",/*微信开放平台申请应用的AppSecret值*/
09          "description": "微信分享"
10          }
11},
html 代码文件
001<html>
002    <head>
003        <meta charset="utf-8">
004        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
005        <title>首页</title>
006        <script type="text/javascript" charset="utf-8">
007        var shares=null;
008        var Intent=null,File=null,Uri=null,main=null;
009        // H5 plus事件处理
010        function plusReady(){
011            updateSerivces();
012            if(plus.os.name=="Android"){
013                main = plus.android.runtimeMainActivity();
014                Intent = plus.android.importClass("android.content.Intent");
015                File = plus.android.importClass("java.io.File");
016                Uri = plus.android.importClass("android.net.Uri");
017            }
018        }
019        if(window.plus){
020            plusReady();
021        }else{
022            document.addEventListener("plusready",plusReady,false);
023        }
024        /**
025         *
026         * 更新分享服务
027         */
028        function updateSerivces(){
029            plus.share.getServices( function(s){
030                shares={};
031                for(var i in s){
032                    var t=s[i];
033                    shares[t.id]=t;
034                }
035            }, function(e){
036                alert("获取分享服务列表失败:"+e.message );
037            } );
038        }
039        /**
040           * 分享操作
041           * @param {JSON} sb 分享操作对象s.s为分享通道对象(plus.share.ShareService)
042           * @param {Boolean} bh 是否分享链接
043           */
044        function shareAction(sb,bh) {
045            if(!sb||!sb.s){
046                alert("无效的分享服务!");
047                return;
048            }           
049            var msg={content:sharehrefDes.value,extra:{scene:sb.x}};
050            if(bh){
051                msg.href=sharehref.value;
052                if(sharehrefTitle&&sharehrefTitle.value!=""){
053                    msg.title=sharehrefTitle.value;
054                }
055                if(sharehrefDes&&sharehrefDes.value!=""){
056                    msg.content=sharehrefDes.value;
057                }
058                msg.thumbs=["_www/logo.png"];
059                msg.pictures=["_www/logo.png"];
060            }else{
061                if(pic&&pic.realUrl){
062                    msg.pictures=[pic.realUrl];
063                }
064            }
065            // 发送分享
066            if ( sb.s.authenticated ) {
067                alert("---已授权---");
068                shareMessage(msg,sb.s);
069            } else {
070                alert("---未授权---");
071                sb.s.authorize( function(){
072                        shareMessage(msg,sb.s);
073                    },function(e){
074                        alert("认证授权失败:"+e.code+" - "+e.message );
075                     
076                });
077            }
078        }
079        /**
080           * 发送分享消息
081           * @param {JSON} msg
082           * @param {plus.share.ShareService} s
083           */
084        function shareMessage(msg,s){           
085            alert(JSON.stringify(msg));
086            s.send( msg, function(){
087                alert("分享到\""+s.description+"\"成功! " );
088                 
089            }, function(e){
090                alert( "分享到\""+s.description+"\"失败: "+JSON.stringify(e) );
091             
092            } );
093        }
094        // 分析链接
095        function shareHref(){
096            var shareBts=[];
097            // 更新分享列表
098            var ss=shares['weixin'];
099            ss&&ss.nativeClient&&(shareBts.push({title:'微信朋友圈',s:ss,x:'WXSceneTimeline'}),
100            shareBts.push({title:'微信好友',s:ss,x:'WXSceneSession'}));
101            ss=shares['qq'];
102            ss&&ss.nativeClient&&shareBts.push({title:'QQ',s:ss});
103            // 弹出分享列表
104            shareBts.length>0?plus.nativeUI.actionSheet({title:'分享链接',cancel:'取消',buttons:shareBts},function(e){
105                (e.index>0)&&shareAction(shareBts[e.index-1],true);
106            }):plus.nativeUI.alert('当前环境无法支持分享链接操作!');
107        }       
108        </script>
109    </head>
110 
111    <body>
112            <!-- 主页面标题 -->   
113            <p>链接地址:</p>
114            <input id="sharehref"  type="url" value="http://www.baidu.com/" />
115            <p>链接标题:</p>
116            <input id="sharehrefTitle"  type="text" value="title" />
117            <p>链接描述:</p>
118            <input id="sharehrefDes"  type="text" value="test"/></br>
119             
120            <button type="button" onclick="shareHref()"> 分享链接</button>
121 
122    </body>
123</html>