小米技术社区
小米技术社区管理员 关于小米

27岁,山西运城人,职业电商经理人,前端开发工作者,从事过网站建设、网络推广、SEO、SEM、信息流推广、二类电商、网络运维、软件开发,等相关电商工作,经验较为丰富,小米技术社区致力于为广大从事Web前端开发的人员提供一些力所能及的引导和帮助 ...[更多]

E-mail:mzze@163.com

Q Q:32362389

W X:xiaomi168527

小米技术社区大牛王飞 关于王飞

27岁,山西运城人,职业电商经理人,网络工程师兼运维,从事过运营商网络建设,企业网络建设、优化。数据中心网络维护等通过,经验丰富,座右铭:当自己休息的时候,别忘了别人还在奔跑。 ...[更多]

E-mail:wf_live@126.com

Q Q:3940019

微博:王小贱ss

小米技术社区设计小艳 关于小艳

大于花一样的年龄,河南郑州是我家,2010年在北京接触团购网,2011年进入天猫淘宝一待就是四年,如今已经将设计走向国际化(ps:误打误撞开始进入阿里巴巴国际站的设计,嘿嘿)五年电商设计,丰富经验,从事过天猫淘宝阿里各项设计,店铺运营,产品拍摄;我将我的经历与您分享是我的快乐!座右铭:越努力越幸运! ...[更多]

E-mail:97157726@qq.com

Q Q:97157726

标签云
精品推荐
  • html5弹性布局display:flex;的具体用法

    html5弹性布局display:flex;的具体用法

    首先我们来了解一下flex的定义:Flex是Flexible Box的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性。在我们开发网站的时候,碰见如下图两边对齐的时候回很头疼,不管是用cl……
    401人已经看过了
您的位置:首页 > 前端开发 > Htm l+ Css > Html5 + Css3

百度分享不支持https,本地化部署的步骤

分类: Html5 + Css329个赞

我们知道百度分享不支持HTTPS网站的调用,如果你的站开通了SSL,调用时就没效果。

我们要做的就是本地化百度分享js,需要下载静态文件并部署到本地即可。


百度线上的分享不支持https,解决步骤:


一、下载静态包(安装包里已下载)

https://github.com/hrwhisper/baiduShare

在此网址里面下载一个static包


二、重命名上传到网站

下载后解压到站点根目录,文件夹名为static,把你的调用代码里面的:

http://bdimg.share.baidu.com/static/api/js/share.js

修改为:

https://你的域名/static/api/js/share.js

或者去掉域名直接用

/static/api/js/share.js


如果你不想用上面路径,想用自己指定的路径。那static/api/js/目录里share.js必须经过修改,否则因为路径问题,将会无法正常使用百度分享,会报错。

share.js修改位置:

_bd_share_main.jscfg.domain.staticUrl + "static/"  修改static/为你想要的位置即可


百度分享测试页

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>小米技术社区-www.bbsxiaomi.com</title>
    <meta name="description" content="">
    <meta name="keywords" content="小米技术社区,bbsxiaomi.com">
    <link href="" rel="stylesheet">
    <style>
    .share-zdy .bdsharebuttonbox a {
        display: flex;
        width: 40px;
        height: 40px;
        background-color: #7D818A;
        margin: 0 0 1px 0;
        float: none;
        padding: 0;
        background-position: center;
        background-repeat: no-repeat;
        transition: .7s;
        -ms-transition: .7s;
        -moz-transition: .7s;
        -webkit-transition: .7s;
        -o-transition: .7s;
        text-align: center;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        color: #fff;
        cursor: pointer;
        background-image: none;
    }

    .share-zdy .bdsharebuttonbox a:hover {
        opacity: 1;
        background-color: #06c;
        color: #fff
    }
    </style>
</head>

<body>
    <div class="share">
        <div class="bdsharebuttonbox">
            <a href="#" class="bds_more" data-cmd="more"></a>
            <a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a>
            <a href="#" class="bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
            <a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
            <a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
            <a href="#" class="bds_tieba" data-cmd="tieba" title="分享到百度贴吧"></a>
            <a href="#" class="bds_douban" data-cmd="douban" title="分享到豆瓣网"></a>
            <a href="#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>
            <a href="#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a>
            <a href="#" class="bds_youdao" data-cmd="youdao" title="分享到有道云笔记"></a>
            <a href="#" class="bds_evernotecn" data-cmd="evernotecn" title="分享到印象笔记"></a>
            <a href="#" class="bds_ty" data-cmd="ty" title="分享到天涯社区"></a>
            <a href="#" class="bds_copy" data-cmd="copy" title="分享到复制网址"></a>
        </div>
    </div>
    <p>
        有好几个平台都已经成为历史了,但是微信可用、QQ可用、QQ空间可用、新浪微博等一些渠道还可用
    </p>
    <div class="share-zdy">
        <div class="bdsharebuttonbox">
            <a class="bds_weixin iconfont icon-weixin" data-cmd="weixin" title="分享到微信">微信</a>
            <a class="bds_sqq iconfont icon-qq" id="share-qq" data-cmd="sqq" title="分享到QQ好友">QQ</a>
            <a class="bds_tsina iconfont icon-weibo" id="share-sina" data-cmd="tsina" title="分享到新浪微博">新浪</a>
        </div>
    </div>
    <script>
    window._bd_share_config = {
        "common": {
            "bdSnsKey": {},
            "bdText": "", //文章标题
            "bdMini": "2",
            "bdMiniList": false,
            "bdPic": "", //文章图片
            "bdStyle": "0",
            "bdSize": "16"
        },
        "share": {}
    };
    with(document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = 'http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=' + ~(-new Date() / 36e5)];
    </script>
    <!-- 上线后请把static文件夹上传到根目录,并把这里的http://bdimg.share.baidu.com/static/api/js/share.js改为https://你的域名/static/api/js/share.js -->
</body>

</html>


小米技术社区

本站内容均为小米原创,转载请注明出处:小米技术社区>> 百度分享不支持https,本地化部署的步骤