常用的分享源码(含微博、微信、QQ分享...) 互联网程序员开发移动开发
程序员文章站
2022-05-18 17:50:03
...
生活在大数据互联网时代下的我们,每天都在不停的刷新朋友圈、微博、QQ空间,看到好的文章、图片等都会不由自主的想分享。使用者可以一秒钟完成内容分享,可是开发者要跳过不少坑后,才能开发出这么便捷的分享功能。
![ 195713gggujro3j2q2h0j3.jpg ](/uploads/attachments/457950/20180119/2aaabede4560a9419e1191e3fb9bc256.jpg)
那么,开发者在开发微博、微信、QQ分享功能时,怎么做才能跳过这些坑,顺利完成分享功能?今天,柚子君直接分享源码给大家,帮你们缩短开发时间。
------ 这部分可以放在公共的JS里面 ------
var zShare = {};
zShare.dialog = function(title,text,url,img){
var shareItems = [
{text:'微信好友',icon:'widget://image/wxsession.png'},
{text:'微信朋友圈',icon:'widget://image/wxtimeline.png'},
{text:'新浪微博',icon:'widget://image/sinaWb.png'},
{text:'QQ',icon:'widget://image/qq.png'},
{text:'QQ空间',icon:'widget://image/qZone.png'}
]
var shareColumn = 5;
var dialogBox = api.require('dialogBox');
dialogBox.actionMenu ({
rect:{h:150},
texts:{cancel:'取消'},
items:shareItems,
styles:{
bg:'#FFF',
column:shareColumn,
itemText: {color:'#000',size: 12,marginT:8},
itemIcon: {size:50},
cancel: {color:'#000',h: 40,size: 14}
}
}, function(ret){
if(ret.eventType=='cancel'){
dialogBox.close({dialogName:'actionMenu'});
} else if(ret.eventType=='click'){
if(ret.index==0){
zShare.wxNews('session',title,text,url,img);
} else if(ret.index==1){
zShare.wxNews('timeline',title,text,url,img);
} else if(ret.index==2){
zShare.weiboNews('sinaWb',title,text,url,img);
} else if(ret.index==3){
zShare.qqNews('QFriend',title,text,url,img);
} else if(ret.index==4){
zShare.qqNews('QZone',title,text,url,img);
}
}
});
}
zShare.wxNews = function(tar,title,text,url,img){
filename = (new Date()).valueOf()+'.'+zShare.ext(img);
api.download({
url: img,
savePath: 'fs://'+filename,
report: false,
cache: true,
allowResume: true
}, function(ret, err) {
var wx = api.require('wx');
wx.isInstalled(function(ret){
if(ret.installed) {
api.toast({msg:'分享中,请稍候',duration:2000,location:"middle"});
} else {
api.toast({msg:'没有安装微信,无法进行分享',duration:2000,location:"middle"});
}
});
wx.shareWebpage({
apiKey: '',
scene: tar,
title: title,
description: text,
thumb: 'fs://'+filename,
contentUrl: url
}, function(ret, err) {
if (ret.status) {
api.toast({msg: '分享成功',duration:2000, location: "middle"});
}
});
});
}
zShare.qqNews = function(tar,title,text,url,img){
var qq = api.require('QQPlus');
qq.installed(function(ret){
if(ret.status) {
api.toast({msg:'分享中,请稍候',duration:2000,location:"middle"});
} else {
api.toast({msg:'没有安装QQ,无法进行分享',duration:2000,location:"middle"});
}
});
qq.shareNews({
url: url,
title: title,
description: text,
imgUrl: img,
type: tar
},function(ret,err){
if (ret.status){
api.toast({msg: '分享成功',duration:2000, location: "botoom"});
}
});
}
zShare.weiboNews = function(tar,title,text,url,img){
filename = (new Date()).valueOf()+'.'+zShare.ext(img);
api.download({
url: img,
savePath: 'fs://'+filename,
report: false,
cache: true,
allowResume: true
}, function(ret, err) {
var weibo = api.require('weibo');
weibo.shareImage({
text: title+text+url,
imageUrl: 'fs://'+filename
}, function(ret, err) {
if (ret.status) {
api.toast({msg:'分享成功',duration:2000,location:"middle"});
}
});
});
}
zShare.ext = function(fileName) {
return fileName.substring(fileName.lastIndexOf('.') + 1);
}
------ 这部分可以放在config.xml ------
<feature name="QQPlus">
<param name="urlScheme" value="tencent123456789"/>
<param name="apiKey" value="123456789"/>
</feature>
<feature name="wx">
<param name="urlScheme" value="wx1**********2e"/>
<param name="apiKey" value="wx1**********2e"/>
<param name="apiSecret" value="6a9*****************43c"/>
</feature>
<feature name="weibo">
<param name="urlScheme" value="wb123456789"/>
<param name="apiKey" value="123456789"/>
<param name="registUrl" value="http://www.apicloud.com"/>
</feature>
注意:这里有个坑,就是QQPlus区分安卓和iOS,不然在调用QQ空间分享的时候是能进入到QQ空间的界面的,但是一点提交,就会提示应用不存在。
------ 调用方法 ------
zShare.dialog('标题','文本','链接','图片')
------ 图片附件 ------
![ 2.png ](/uploads/attachments/457950/20180119/0164491b36a8cfe8a136d0f532249e5a.png)
![ ![ 3.png ](/uploads/attachments/457950/20180119/f8a8a9d056df17c420c63fa0e66944bf.png) ](/uploads/attachments/457950/20180119/de6661c3d123e1c27dd3a4eec3d138d6.png)
![ 4.png ](/uploads/attachments/457950/20180119/4fc22e68cbdc28e6fcc76cd13e6a8edf.png)
![ 5.png ](/uploads/attachments/457950/20180119/1de37963e3adc89df0b66da15863eadb.png)
![ 6.png ](/uploads/attachments/457950/20180119/af38ca2acefa552638c0d2249673296a.png)
另外:如果你在使用mobShare,想从mobShare换成独立的模块分享,你可能会遇到一个问题,就是不删除mobShare又加入weibo模块在编译的时候会提示模块冲突,那就要删掉mobShare,要删除的话你得先把config.xml中的mobShare代码删除,然后提交,再到APICloud模块管理里面删除,如果不删除代码的话APICloud模块管理是不能删除的。
![ 195713gggujro3j2q2h0j3.jpg ](/uploads/attachments/457950/20180119/2aaabede4560a9419e1191e3fb9bc256.jpg)
那么,开发者在开发微博、微信、QQ分享功能时,怎么做才能跳过这些坑,顺利完成分享功能?今天,柚子君直接分享源码给大家,帮你们缩短开发时间。
------ 这部分可以放在公共的JS里面 ------
var zShare = {};
zShare.dialog = function(title,text,url,img){
var shareItems = [
{text:'微信好友',icon:'widget://image/wxsession.png'},
{text:'微信朋友圈',icon:'widget://image/wxtimeline.png'},
{text:'新浪微博',icon:'widget://image/sinaWb.png'},
{text:'QQ',icon:'widget://image/qq.png'},
{text:'QQ空间',icon:'widget://image/qZone.png'}
]
var shareColumn = 5;
var dialogBox = api.require('dialogBox');
dialogBox.actionMenu ({
rect:{h:150},
texts:{cancel:'取消'},
items:shareItems,
styles:{
bg:'#FFF',
column:shareColumn,
itemText: {color:'#000',size: 12,marginT:8},
itemIcon: {size:50},
cancel: {color:'#000',h: 40,size: 14}
}
}, function(ret){
if(ret.eventType=='cancel'){
dialogBox.close({dialogName:'actionMenu'});
} else if(ret.eventType=='click'){
if(ret.index==0){
zShare.wxNews('session',title,text,url,img);
} else if(ret.index==1){
zShare.wxNews('timeline',title,text,url,img);
} else if(ret.index==2){
zShare.weiboNews('sinaWb',title,text,url,img);
} else if(ret.index==3){
zShare.qqNews('QFriend',title,text,url,img);
} else if(ret.index==4){
zShare.qqNews('QZone',title,text,url,img);
}
}
});
}
zShare.wxNews = function(tar,title,text,url,img){
filename = (new Date()).valueOf()+'.'+zShare.ext(img);
api.download({
url: img,
savePath: 'fs://'+filename,
report: false,
cache: true,
allowResume: true
}, function(ret, err) {
var wx = api.require('wx');
wx.isInstalled(function(ret){
if(ret.installed) {
api.toast({msg:'分享中,请稍候',duration:2000,location:"middle"});
} else {
api.toast({msg:'没有安装微信,无法进行分享',duration:2000,location:"middle"});
}
});
wx.shareWebpage({
apiKey: '',
scene: tar,
title: title,
description: text,
thumb: 'fs://'+filename,
contentUrl: url
}, function(ret, err) {
if (ret.status) {
api.toast({msg: '分享成功',duration:2000, location: "middle"});
}
});
});
}
zShare.qqNews = function(tar,title,text,url,img){
var qq = api.require('QQPlus');
qq.installed(function(ret){
if(ret.status) {
api.toast({msg:'分享中,请稍候',duration:2000,location:"middle"});
} else {
api.toast({msg:'没有安装QQ,无法进行分享',duration:2000,location:"middle"});
}
});
qq.shareNews({
url: url,
title: title,
description: text,
imgUrl: img,
type: tar
},function(ret,err){
if (ret.status){
api.toast({msg: '分享成功',duration:2000, location: "botoom"});
}
});
}
zShare.weiboNews = function(tar,title,text,url,img){
filename = (new Date()).valueOf()+'.'+zShare.ext(img);
api.download({
url: img,
savePath: 'fs://'+filename,
report: false,
cache: true,
allowResume: true
}, function(ret, err) {
var weibo = api.require('weibo');
weibo.shareImage({
text: title+text+url,
imageUrl: 'fs://'+filename
}, function(ret, err) {
if (ret.status) {
api.toast({msg:'分享成功',duration:2000,location:"middle"});
}
});
});
}
zShare.ext = function(fileName) {
return fileName.substring(fileName.lastIndexOf('.') + 1);
}
------ 这部分可以放在config.xml ------
<feature name="QQPlus">
<param name="urlScheme" value="tencent123456789"/>
<param name="apiKey" value="123456789"/>
</feature>
<feature name="wx">
<param name="urlScheme" value="wx1**********2e"/>
<param name="apiKey" value="wx1**********2e"/>
<param name="apiSecret" value="6a9*****************43c"/>
</feature>
<feature name="weibo">
<param name="urlScheme" value="wb123456789"/>
<param name="apiKey" value="123456789"/>
<param name="registUrl" value="http://www.apicloud.com"/>
</feature>
注意:这里有个坑,就是QQPlus区分安卓和iOS,不然在调用QQ空间分享的时候是能进入到QQ空间的界面的,但是一点提交,就会提示应用不存在。
------ 调用方法 ------
zShare.dialog('标题','文本','链接','图片')
------ 图片附件 ------
![ 2.png ](/uploads/attachments/457950/20180119/0164491b36a8cfe8a136d0f532249e5a.png)
![ ![ 3.png ](/uploads/attachments/457950/20180119/f8a8a9d056df17c420c63fa0e66944bf.png) ](/uploads/attachments/457950/20180119/de6661c3d123e1c27dd3a4eec3d138d6.png)
![ 4.png ](/uploads/attachments/457950/20180119/4fc22e68cbdc28e6fcc76cd13e6a8edf.png)
![ 5.png ](/uploads/attachments/457950/20180119/1de37963e3adc89df0b66da15863eadb.png)
![ 6.png ](/uploads/attachments/457950/20180119/af38ca2acefa552638c0d2249673296a.png)
另外:如果你在使用mobShare,想从mobShare换成独立的模块分享,你可能会遇到一个问题,就是不删除mobShare又加入weibo模块在编译的时候会提示模块冲突,那就要删掉mobShare,要删除的话你得先把config.xml中的mobShare代码删除,然后提交,再到APICloud模块管理里面删除,如果不删除代码的话APICloud模块管理是不能删除的。