分享插件开发指南

概述

\n

HTML5+应用集成了分享功能,现在已经集成了“微信”“QQ”“新浪微博”“腾讯微博”分享SDK,用户可通过5+API调用接口分享消息到指定的分享平台。
用户在使用5+分享API时需要对应用进行配置,具体配置方法请参考“应用使用分享插件方法”。

除了通过SDK分享,Android用户还可以通过Native.js的方式调用OS的分享,任何三方软件都可以在Android分享里注册,此方式可实现分享到本机安装的各种app里,比如短信、邮件、蓝牙、evernote等方式。
并且系统分享无需向分享平台厂商申请appkey和配置SDK,但这种方式最大的问题微信不支持此方式分享到朋友圈。

相关代码示例均在Hello H5+示例里的share.html里。

开发指导

\n

用户可以调用5+API分享信息。用户调用分享API分享消息时,设备是否存在相应的应用,调用的效果不同。如用户没有安装“新浪微博”等应用,HBuilder应用则会在应用内调用SDK的分享页面。如安装了“新浪微博”等应用,则调用API会调用该应用进行分享。
使用分享5+ API的一般步骤如下:
1. 获取分享服务对象列表
首先要在plusready事件之后获取分享列表,获取分享服务列表可以调用
plus.share.getServices()接口。用户可以在回调中获取到分享服务对象的列表。用户需要保存返回的分享对象。在调用分享和授权接口时需要使用到该对象。

plus.share.getServices(function(s) {
shares = ss;
for (var i in ss ) {
var s = ss[i];
var item = document.createElement("li");
item.setAttribute("class", "ditem");
item.setAttribute("onclick", (s.id == "weixin") ? "shareWeiXin(this.plusShare)" : "shareAction(this.plusShare)");
item.innerText = s.description;
item.plusShare = s;
list.appendChild(item);
}
}, function(e) {
alert("获取分享服务列表失败:" + e.message);
});
\n

  1. 用户分享信息前需要对分享平台是否授权过进行判断,如果已经授权则可直接分享消息,如没有授权则需要调用已保存的分享对象的“authorize”接口对客户端进行授权。授权成功后再调用分享接口分享消息。
\n
function shareAction(s, ex) {
outSet("分享操作:");
if (!s) {
outLine("无效的分享服务!");
return;
}
if (s.authenticated) {
outLine("---已授权---");
shareMessage(s, ex);
} else {
outLine("---未授权---");
s.authorize(function() {
shareMessage(s, ex);
}, function(e) {
outLine("认证授权失败:" + e.code + " - " + e.message);
});
}
}
\n

  1. 对客户端授权成功之后用户可以调用分享对象的“send”方法发送要分享的消息,用户创建JSON对象设置要分享的数据。
    用户如需要在分享信息中插入图片,可以在消息中添加pictures节点,属性值为图片地址,图片地址可以为网络地址或者本地图片地址。
\n
function shareMessage(s,ex){
var msg={content:sharecontent.value,extra:{scene:ex}};
if(pic&&pic.realUrl){
msg.pictures=[pic.realUrl];
}

s.send( msg, function(){
alert( "分享到\""+s.description+"\"成功! " );
}, function(e){
alert( "分享到\""+s.description+"\"失败: "+e.code+" - "+e.message );
} );
}
\n

  1. 如用户需要取消授权可以调用分享对象方法“forbid”,取消分享服务。
\n
function cancelAuth(){try{

for ( var i in shares ) {
var s = shares[i];
if ( s.authenticated ) {
outLine( "取消\""+s.description+"\"");
}
s.forbid();
}
// 取消授权后需要更新服务列表
updateServices();
outLine( "操作成功!" );}catch(e){alert(e);}
}
\n

应用使用分享插件方法

\n

在HBuilder中为应用添加分享插件的步骤如下:
1. 点击manifest.json文件的“代码视图”,在permissions节点下添加Share节点:


2. 在plus -> distribute -> plugins 节点下添加share节点:

添加不同分享平台的方法

\n

当前HTML5+应用提供“新浪微博”“腾讯微博”和“微信”分享功能,用户可以根据需要进行配置,如需使用某种分享平台,则需要在manifest文件中配置该平台的appkey等信息,没配置的平台将无法获取分享服务器对象。
添加新浪微博分享
在plus->distribute->plugins->share节点下添加sina节点。
- appkey属性,填写新浪微博开发网站申请的appkey
- appsecret属性,填写新浪微博开发网站申请的appscret
- redirect_url属性,填写申请新浪微博应用时填写的RUL
- description属性(可选),填写节点描述信息
添加腾讯微博分享
在plus->distribute->plugins->share节点下添加tencent节点。
- appkey属性,填写腾讯微博开发网站申请的appkey
- appsecret属性,填写腾讯微博开发网站申请的appscret
- redirect_url属性,填写申请腾讯微博应用时填写的RUL
- description属性(可选),添加节点描述信息
添加微信分享
在plus->distribute->plugins->share节点下添加weixin节点。
- appid属性,填写微信开放平台申请的appid
- appsecret属性,填写微信开放平台申请的appscret
- description属性(可选),添加节点描述信息

打包设置

\n

用户在提交App云端打包时需要注意以下几点,否则将会导致生成的安装包分享功能失效。
IOS应用打包
App云端打包时填写的APPID需要和打包使用的Profile指定的APPID一致,并且要和“新浪微博”分享平台填写的BundleID一致。

安卓应用打包
1. manifest文件填写的redirect_url需要和申请应用appkey时填写的一致
2. 打包填写的APPID需要和申请应用appkey的ID一致

分享平台应用APPKEY申请

\n

在申请分享平台的APPKEY时应当注意,在填写IOS的APPID和安卓的包名时,一定要和App云端打包使用的APPID和包名一致。否则会导致信息分享失败。

新浪微博appkey申请步骤

\n

腾讯微博appkey申请方法

\n

微信appkey申请方法

\n

常见问题

\n

1.真机运行时新浪微博为什么分享失败
答:因为HBuilder应用在新浪开发平台还在审核中,目前仅有部分测试账号可成功 分享消息。如用户需要测试新浪微博的分享功能需要使用App云端打包生成安装 包测试。

2.“新浪微博”应用审核未通过时分享消息会失败,如何测试分享?
答: 用户需要在开发者账号下添加测试要使用的账号,具体使用步骤如下:
- 登陆“新浪微博”开放平台
- 找到要测试的应用,点击“应用信息”下的“测试信息”


- 点击“编辑”添加测试用户的昵称。
- 保存。

3.真机运行时分享的消息应用名为“HBuilder”如何修改?
答: 真机调试时应用内置的分享平台配置使用的应用名为“HBuilder”,真机联调时不能修改。用户需要使用App云端打包修改应用名称。
4. android平台打包后为啥微信分享失败?
答: 微信分享申请appkey时需要同时填写打包使用证书的MD5值,如果Android打包使用的证书和申请微信appkey时使用的证书不一致会导致微信分享失败,表现是微信登陆后点击“分享到朋友圈”,微信页面一闪就关闭


3 分享
hum 蔡繁荣 DCloud_客服_Trust
妙妙

妙妙

调用系统分享功能也要配置吗,比如说发送手机短信。现在是没有配置sdk,就打包的时候不能添加share模块了
0 赞 2017-08-06 21:34
xm3530@126.com

xm3530@126.com 回复 穿布鞋的coder

恩恩,就是你说的这样填,分享之后出现闪现失败,其实就是在微信开发者平台里填写的签名不对。我用的公司的开发者账号,一直闪现,然后仔细一看公司的管理人员填写的信息里签名少了一个数字6,当时和他说不对了,他还不信。然后直接到他电脑上改了。立马就可以发送分享了。
0 赞 2017-08-04 14:20
545109864@qq.com

545109864@qq.com 回复 failedtocopy

我也是这样的
0 赞 2017-07-11 12:02
Native_O

Native_O

具体的分享代码可以参考这篇文章http://blog.csdn.net/zhuming3834/article/details/51706256
0 赞 2017-07-04 10:23
Native_O

Native_O 回复 zhuhong02199@163.com

http://blog.csdn.net/zhuming3834/article/details/51706256
0 赞 2017-07-04 10:22
Native_O

Native_O

没有判断是否安装某个应用,比如分享到微信,如果没有安装微信,则点击分享没有任何反应?已安装的情况下都可以分享成功,微博则可以通过网页进行分享,微信和QQ不能通过网页分享,只能通过客户端!
0 赞 2017-07-04 10:18
zhuhong02199@163.com

zhuhong02199@163.com 回复 多多1

大神,ios和安卓QQ分享咋弄得呀?它这上面没写呀
0 赞 2017-03-31 11:14
zhuhong02199@163.com

zhuhong02199@163.com

QQ怎么分享呢?没写呀
0 赞 2017-03-31 11:13
292819829@qq.com

292819829@qq.com 回复 2290060594@qq.com

能加我QQ教我一下怎么弄分享的吗?
0 赞 2017-03-06 17:54
2290060594@qq.com

2290060594@qq.com 回复 多多1

我的也是这种情况,你现在解决了吗,打包后就无法分享了
0 赞 2017-03-06 17:06
多多1

多多1

有大神在吗? 安卓QQ分享失败 真机测试成功,但打成测试包安装就不可以了 提示应用不存在
0 赞 2017-02-16 16:41
多多1

多多1 回复 sunrise52java

你现在找到了吗 我也遇到这个问题了 我没找到使用第三方插件这个选项
0 赞 2017-02-16 16:18
315579792@qq.com

315579792@qq.com

解决了,包名什么的都要和打包时填写的一致,然后生成的签名信息配置好就行了
0 赞 2016-12-20 09:42
丿白开水

丿白开水 回复 315579792@qq.com

你的问题解决吗?
0 赞 2016-12-14 11:18
315579792@qq.com

315579792@qq.com

我生成的证书和微信开发平台的证书签名都是一致的还是出现闪退的问题,这到底是什么原因啊?
0 赞 2016-11-22 17:06
冰山

冰山 回复 底浪岩

你写死吧,不要调用这个值
0 赞 2016-08-11 10:47
HGDQ

HGDQ

前几天写的分享《HTML5 WebApp开发(七)微信/QQ/新浪分享》
http://blog.csdn.net/zhuming3834/article/details/51706256
4 赞 2016-06-20 21:38
大霸王

大霸王

这里面其中一个关键的东西,就是应用签名,这个签名要是搞错了,就会出现各种错误。
0 赞 2016-05-13 17:46
底浪岩

底浪岩

这个sharecontent.value 是怎么获得 id=“sharecontent”的值的。
0 赞 2016-03-10 17:15
damdmen

damdmen

感觉这么集成太累啊。。。应该把友盟的那个分享组件集成下。。。这样直接统计功能也有了

看了他们的文档,只有codova的,没有mui。。。

官方达达们,能做么?@DCloud_MUI_FXY @DCloud_App_Array @DCloud_heavensoft
0 赞 2016-01-31 18:43
Luyc

Luyc

什么文档,一个回复都没有,这框架不更新了么,群里没人回,论坛里也没人回。
0 赞 2015-10-11 21:47
炸鸡排超人

炸鸡排超人

为什么我勾选了 share,打包后还是说我未添加模块share??
0 赞 2015-09-10 14:12
炸鸡排超人

炸鸡排超人

我很好奇 在代码视图配置SDK的时候 是有qq好友该选项的
可是我找遍demo也没看到 有分享到QQ好友呀.
0 赞 2015-09-07 17:01
sunrise52java

sunrise52java 回复 小五

manifest.json文件一打开就会而看到“第三方插件”吗?为什么我的没有。。。好奇怪
0 赞 2015-08-27 19:14
sunrise52java

sunrise52java

我的manifest.json 文件里面没有第三方插件,请问这是怎么回事
0 赞 2015-08-27 19:13
穿布鞋的coder

穿布鞋的coder 回复 failedtocopy

包名是你发布前的包名吗,如:io.dcloud.H5D6A9D02,如果不是那生成AppID会错误,签名用这个59201CF6589202CB2CDAB26752472112,包名用类似的io.dcloud.H5D6A9D02才可以
1 赞 2015-08-26 09:09
failedtocopy

failedtocopy

可能不能用这个,如果大家都用这个去申请的话那就不是唯一的签名了
0 赞 2015-07-06 10:57
sunnidy

sunnidy 回复 failedtocopy

同问。我也出现这个问题、
0 赞 2015-07-06 10:52
failedtocopy

failedtocopy

用公用的那个 “证书的MD5值” 打包后为啥不能分享呢 , 现象和上面文档说的一样 “ 微信页面一闪就关闭 ”
1 赞 2015-07-02 22:47
laosan02025

laosan02025

按照说明配置后,debug版本的微信分享正常,一旦应用签名后就不能分享了,点击分享无任何反应,正常情况下应该会弹一个微信的提示框;签名验证也是正确的,用微信分享demo测试是正常能分享的
0 赞 2015-04-29 10:31
小五

小五

iOS分享到微博成功,Android分享到微博提示10007
0 赞 2015-01-07 14:52

要回复文章请先登录注册