当你网站需要微信分享的时候,你很多时候都是分享出去都是直接带着链接且没有图片,这个时候都很难看。

织梦微信分享开发_jquery

于是我们这边需要开发出新的微信分享样式,这个样式需要有自动获取标题图片等功能,然后在文章页面直接分享即可。

需求:

1.在网站页面可以直接转发到朋友圈或者好友功能

2.自动获取标题

3.自动获取缩略图做分享图片

分析:

1.拥有微信服务号接口

2.对公众号进行调试匹配,ip加入白名单

3.网页链接代码

实施:

1.在调用页面加入当下代码

<script type="text/javascript">window.jQuery || document.write("<script src='https://cdn.dedemao.com/jquery/1.11.3/jquery.min.js'>"+"<"+"/script>");</script>
<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script><script>
   timestamp = '';
   noncestr = '';
   signature = '';
   url = '';
   var is_debug = '{dede:global.wx_appdebug/}';
   is_debug = parseInt(is_debug);
   is_debug = is_debug==1 ? true : false;
   $(function(){
      $.ajaxSettings.async = false;  //重要:开启同步
      url = window.location.href.split('#')[0];
      //请求第二步添加的php文件获取timestamp、noncestr、signature等信息
      $.getJSON("你的网站/plus/weixin_share.php",{url:url},function(data){
         if (data.errmsg){
            alert('微信分享配置错误:'+data.errmsg);
         }
         timestamp = data.timestamp;
         noncestr = data.noncestr;
         signature = data.signature;
      });
      wx.config({
      debug: is_debug,
      appId: '{dede:global.ws_appid/}',   //填写你的appid
      timestamp: timestamp,
      nonceStr: noncestr,
      signature: signature,
      jsApiList: [
         'checkJsApi',
         'onMenuShareTimeline',
         'onMenuShareAppMessage',
         'onMenuShareQQ',
         'onMenuShareWeibo',
         'onMenuShareQZone'
      ]
   });
   wx.ready(function (){
      //获取“分享给朋友”按钮点击状态及自定义分享内容接口
      url = window.location.href.split('#')[0];
      wx.onMenuShareAppMessage({
         title: "{dede:field.title/}",
         desc: "{dede:field.description functinotallow='html2text(@me)'/}",
         link: url,
         imgUrl: '{dede:global.cfg_basehost/}{dede:field.litpic/}',
         trigger: function (res) {
         },
         success: function (res) {
         },
         cancel: function (res) {
         },
         fail: function (res) {
         }
      });
      //获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
      wx.onMenuShareTimeline({
         title: '{dede:field.title/}', // 分享标题
         desc: "{dede:field.description functinotallow='html2text(@me)'/}",
         link: url, // 分享链接
         imgUrl: '{dede:global.cfg_basehost/}{dede:field.litpic/}', // 分享图标
         success: function () {
            // 用户确认分享后执行的回调函数
         },
         cancel: function () {
            // 用户取消分享后执行的回调函数
         }
      });
   });
   });

</script>

2.公众号进入设置与开发-基本配置将ip白名单里加入你的服务器ip

3.进入后台,将你的{dede:global.ws_appid/}等信息填入即可

然后,我们的微信分享就好啦~~~

织梦微信分享开发_回调函数_02