首页 > Windows开发 > 详细

使用百度分享api实现网页分享功能

时间:2020-01-05 09:38:40      阅读:367      评论:0      收藏:0      [点我收藏+]

百度官方文档:http://share.baidu.com/code/advance#toid

线上demo:https://my.weblf.cn/xly/demo/web_share.html

首先先引入外部文件:

with(document)0[(getElementsByTagName(head)[0]||body).appendChild(createElement(script)).src=http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion=+~(-new Date()/36e5)];

这段代码会自动加载一段js与css。

然后你需要有dom树,

<div class="bdsharebuttonbox" data-tag="share_1">
    <a class="bds_mshare" data-cmd="mshare"></a>
    <a class="bds_qzone" data-cmd="qzone" href="#"></a>
    <a class="bds_tsina" data-cmd="tsina"></a>
    <a class="bds_baidu" data-cmd="baidu"></a>
    <a class="bds_renren" data-cmd="renren"></a>
    <a class="bds_tqq" data-cmd="tqq"></a>
    <a class="bds_more" data-cmd="more">更多</a>
    <a class="bds_count" data-cmd="count"></a>
</div>

这里的a标签不用写地址。

然后我们实现一个简易的分享功能:

window._bd_share_config = {
                  "common" : {
                   "bdText" : 这是分享的标题,
                   "bdComment" : 我是通用分享设置,会出现在发送给QQ好友里的描述,
                   "bdPic" : "http://test.miniwangdai.com/public/images/invite/wechat.png",//分享的图像地址
                   "bdStyle" : "0",//按钮样式
                   "bdSize" : "32",//按钮大小
                   "bdUrl" : https://www.baidu.com,//分享的地址
                   "bdDesc":给你的好友留一句话吧,
                  },
                  "share" : {},
                };

这样最简单的分享功能就做好了。

技术分享图片

 

技术分享图片

 

技术分享图片

使用百度分享api实现网页分享功能

原文:https://www.cnblogs.com/linfblog/p/12151014.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!