zoukankan      html  css  js  c++  java
  • H5实现 微信分享功能

    1丶首先需要获取微信配置信息,需要调后端提供的接口数据

    2丶然后调用 wx.config  配置你需要调用的的微信接口  jsApiList

    3丶微信官方的jsAPI接口  只能在 wx.ready()这个函数中调用

       // 获取微信配置信息
        setWxConfig() {
          // 进行签名的时候  Android 不用使用之前的链接, ios 需要
          let signLink =
            navigator && navigator.userAgent && /(Android)/i.test(navigator.userAgent)
              ? location.href.split("#")[0]
              : window.entryUrl;
          getWxConfig(signLink).then((res) => {
            console.log("这里是wxconfig配置信息", res);
            var result = res.data;
            if (!wx) {
              alert("请升级当前微信版本!");
            }
            // eslint-disable-next-line
            wx.config({
              debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
              appId: result.appId, // 必填,公众号的唯一标识
              timestamp: result.timestamp, // 必填,生成签名的时间戳
              nonceStr: result.nonceStr, // 必填,生成签名的随机串
              signature: result.signature, // 必填,签名
              jsApiList: [
                "onMenuShareAppMessage",
                "onMenuShareTimeline",
                "updateAppMessageShareData",
                "updateTimelineShareData",
              ], // 必填,需要使用的JS接口列表
            });
            // eslint-disable-next-line
            this.wxShare();
          });
        },
        wxShare() {
          //  wx分享
          let _this = this;
          window.wx.ready(function () {
            // 分享朋友圈
            window.wx.updateTimelineShareData({
              title: _this.articleTitle,// 分享标题
              link: _this.pageUrl,// 分享urk
              imgUrl: _this.articleImg, // 分享图标
              success: function () {
                // 用户确认分享后执行的回调函数
                // _this.$Toast("分享朋友圈成功");
              },
            });
            // 分享朋友
            window.wx.updateAppMessageShareData({
              title: _this.articleTitle,// 分享标题
              desc: _this.articleCount,// 分享urk
              link: _this.pageUrl,
              imgUrl: _this.articleImg, // 分享图标
              type: "", // 分享类型,music、video或link,不填默认为link
              dataUrl: "", // 如果type是music或video,则要提供数据链接,默认为空
              success: function () {
                // 用户确认分享后执行的回调函数
                // _this.$Toast("分享好友成功");
              },
            });
            window.wx.error(function (res) {
              // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
              console.log("errorMSG:" + res);
            });
          });
        },
      
    
    
    
     
  • 相关阅读:
    由自身经历谈“不谋全局者,不足以谋一域”
    MySQL 常用SQL语句
    举例说明android中ListPreference的使用方法
    cookie机制和session机制的区别
    thinkphp浏览历史功能实现方法
    利用PHP获取访客IP、地区位置、浏览器及来源页面等信息
    PHP+Ajax点击加载更多内容 -这个效果好,速度快,只能点击更多加载,不能滚动自动加载...
    php用正则表达式匹配URL的简单方法(亲测可行)
    PHP实现记录浏览历史页面
    [译] 流言终结者 —— “SQL Server 是Sybase的产品而不是微软的”
  • 原文地址:https://www.cnblogs.com/llive/p/14880943.html
Copyright © 2011-2022 走看看