mui实现分享新浪微博、QQ分享、微信分享的申请过程和分享成功过程

最新推荐文章于 2023-04-27 15:05:30 发布

你的美，让我痴迷

最新推荐文章于 2023-04-27 15:05:30 发布

阅读量539

点赞数

本文链接：https://blog.csdn.net/weixin_45932157/article/details/104667099

版权

第一：

分享新浪微博：

**
我们进入https://open.weibo.com/新浪微博
pc端。

进行注册，登录。
在这里插入图片描述
点击头像可以进行编辑：

在这里插入图片描述

进入编辑信息页：

在这里插入图片描述

如果三个步骤都完成后，那么，看下一步：

在这里插入图片描述

点击完善应用信息，

在这里插入图片描述
注意：包名就是你打包时的名称，那个签名是通过签名工具得来的。

不懂的看微信的获取操作就知道了。

往下：

在这里插入图片描述
这是App开发返回的App key 和App Secret :

有时会出错，可以进行高级设置：

在这里插入图片描述
这样新浪微博的配置就完了。

QQ配置项获取appid

首先进入qq互联平台：https://connect.qq.com/

在这里插入图片描述
点击登录：

在这里插入图片描述
点击头像进入个人信息完善：

在这里插入图片描述
下一步：

完善信息后点击应用管理：

在这里插入图片描述

在这里插入图片描述
选择移动应用，进行创建应用：.进入应用管理界面后，完善图标素材，.完善平台信息：
最终获取到我们要的值：

微信分享的申请过程

登录微信开放平台 https://open.weixin.qq.com/，创建开发者账号。
在这里插入图片描述
点击资源中心：

在这里插入图片描述

点击资源下载：

点击Android 资源下载找到签名生成工具。

对该工具进行安装。

使用该工具：

在这里插入图片描述
请求的是你要打包的名称：

在这里插入图片描述
生成的绿色的字符串就是微信分享的AppID。

注意事项：
微信开发者平台申请的 AppID 只有通过审核才能够正常分享，否则分享一次之后
便无法分享成功。

申请过程完结：

将要的信息显示到我们分享的信息。

在这里插入图片描述

注意：新浪的回调地址必须是：http://sns.whalecloud.com

最后一步：

简单的初步尝试分享代码：

<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title>首页</title>
        <script type="text/javascript" charset="utf-8">
      
        var shares=null;
        var Intent=null,File=null,Uri=null,main=null;
        // H5 plus事件处理
        function plusReady(){
            updateSerivces();
            if(plus.os.name=="Android"){
                main = plus.android.runtimeMainActivity();
                Intent = plus.android.importClass("android.content.Intent");
                File = plus.android.importClass("java.io.File");
                Uri = plus.android.importClass("android.net.Uri");
            }
        }
        if(window.plus){
            plusReady();
        }else{
            document.addEventListener("plusready",plusReady,false);
        }
        
        /**
         * 
         * 更新分享服务
         */
        function updateSerivces(){
            plus.share.getServices( function(s){
                shares={};
                for(var i in s){
                    var t=s[i];
                    shares[t.id]=t;
                }
            }, function(e){
                alert("获取分享服务列表失败："+e.message );
            } );
        }
        
        
        
        /**
           * 分享操作
           * @param {JSON} sb 分享操作对象s.s为分享通道对象(plus.share.ShareService)
           * @param {Boolean} bh 是否分享链接
           */
        function shareAction(sb,bh) {
            if(!sb||!sb.s){
                alert("无效的分享服务！");
                return;
            }
            
            var msg={content:sharehrefDes.value,extra:{scene:sb.x}};
            if(bh){
                msg.href=sharehref.value;
                if(sharehrefTitle&&sharehrefTitle.value!=""){
                    msg.title=sharehrefTitle.value;
                }
                if(sharehrefDes&&sharehrefDes.value!=""){
                    msg.content=sharehrefDes.value;
                }
                msg.thumbs=["_www/logo.png"];
                msg.pictures=["_www/logo.png"];
            }else{
                if(pic&&pic.realUrl){
                    msg.pictures=[pic.realUrl];
                }
            }
            // 发送分享
            if ( sb.s.authenticated ) {
                alert("---已授权---");
                shareMessage(msg,sb.s);
            } else {
                alert("---未授权---");
                sb.s.authorize( function(){
                        shareMessage(msg,sb.s);
                    },function(e){
                        alert("认证授权失败："+e.code+" - "+e.message );
                    
                });
            }
        }
        /**
           * 发送分享消息
           * @param {JSON} msg
           * @param {plus.share.ShareService} s
           */
        function shareMessage(msg,s){
            
            alert(JSON.stringify(msg));
            s.send( msg, function(){
                alert("分享到\""+s.description+"\"成功！ " );
                
            }, function(e){
                alert( "分享到\""+s.description+"\"失败: "+JSON.stringify(e) );
            
            } );
        }
        // 分析链接
        function shareHref(){
            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});
            // 弹出分享列表
            shareBts.length>0?plus.nativeUI.actionSheet({title:'分享链接',cancel:'取消',buttons:shareBts},function(e){
                (e.index>0)&&shareAction(shareBts[e.index-1],true);
            }):plus.nativeUI.alert('当前环境无法支持分享链接操作!');
        }
        
        </script>
    </head>

    <body>
            <!-- 主页面标题 -->    
            <p>链接地址：</p>
            <input id="sharehref"  type="url" value="http://www.baidu.com/" />
            <p>链接标题：</p>
            <input id="sharehrefTitle"  type="text" value="title" />
            <p>链接描述：</p>
            <input id="sharehrefDes"  type="text" value="test"/></br>
            
            <button type="button" onclick="shareHref()"> 分享链接</button>

    </body>
</html>

实现效果：

在这里插入图片描述

在这里插入图片描述
这就基本成功了。

你的美，让我痴迷

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
1
评论
mui实现分享新浪微博、QQ分享、微信分享的申请过程和分享成功过程

第一：**分享新浪微博：**我们进入https://open.weibo.com/新浪微博pc端。进行注册，登录。点击头像可以进行编辑：进入编辑信息页：如果三个步骤都完成后，那么，看下一步：点击完善应用信息，注意：包名就是你打包时的名称，那个签名是通过签名工具得来的。不懂的看微信的获取操作就知道了。往下：这是App开发返回的App key 和App S...
复制链接

扫一扫