微信网页分享-配置与设置

首先需要登录微信公众平台:

  1、获取信息:开发者ID(AppId)、开发者密码(AppSecret),后端生成签名及参数需要用

     开发 - 基本设置 - 公众号开发信息

微信网页分享-配置与设置_第1张图片

 

  2、设置信息:

    设置IP白名单(通过开发者ID及密码调用获取access_token接口时,需要设置访问来源IP为白名单

    设置js接口安全域名(要分享的html地址)

 

 

 

接下来就是引入js文件,和配置了,直接上代码了:

  <script src="https://cdn.bootcss.com/zepto/1.1.7/zepto.min.js">script>
  <script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js ">script>
  <script>
    // var baseUrl = "https://finance.zhecaijinfu.com";
    var baseUrl = "http://192.168.1.148:8080";
    var href = window.location.href.replace(/#.*/, '');

    //    获取签名
    $.ajax({
      url: baseUrl + '/wx/sign',
      type: 'get',
      data: {
        url: href
      },
      success: function (resC) {
        wx.config({
          // debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
          appId: 'wx352c87cab48b123f', // 必填,公众号的唯一标识
          timestamp: resC.result.timestamp, // 必填,生成签名的时间戳
          nonceStr: resC.result.nonceStr, // 必填,生成签名的随机串
          signature: resC.result.signature,// 必填,签名
          jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ'] // 必填,需要使用的JS接口列表
        });

        wx.ready(function () {
          // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
          var shareData = {
            title: '注册送18888元体验金和688元现金礼包',
            desc: '浙财宝是专注于房贷、信用贷的互联网金融综合服务平台',
            link: 'https://apph5.zhecaijinfu.com/invite.html',
            imgUrl: 'https://www.zhecaijinfu.com/images/logo_txt.png'
          };
          //获取“分享给朋友”按钮点击状态及自定义分享内容接口
          wx.onMenuShareAppMessage(shareData);
          //获取“分享到朋友圈”按钮点击状态及自定义分享内容接口        
          wx.onMenuShareTimeline(shareData);
          //获取“分享到QQ”按钮点击状态及自定义分享内容接口        
          wx.onMenuShareQQ(shareData);
        });

      },
      error: function (err) {
        console.log(err);
      }
    })
  script>

 

通过开发者ID及密码调用获取access_token接口时,需要设置访问来源IP为白名单

转载于:https://www.cnblogs.com/LChenglong/p/9317474.html

你可能感兴趣的:(微信网页分享-配置与设置)