uni-app 急需在App中调用微信公众号一次性订阅方法

发布于 1周前 作者 h691938207 来自 Uni-App

uni-app 急需在App中调用微信公众号一次性订阅方法

急需在App中调用微信公众号一次性订阅方法!!!

信息类型 信息
开发环境
版本号
项目创建方式
1 回复

uni-app 中调用微信公众号的一次性订阅方法,需要借助微信公众号的JSSDK来实现。以下是一个示例代码,展示了如何在 uni-app 中集成微信公众号的JSSDK并调用一次性订阅接口。

首先,确保你的公众号已经在微信公众平台配置了JS接口安全域名,并且你的App已经获取了用户的openid。

步骤一:引入微信JSSDK

uni-app 的页面或组件中,引入微信JSSDK。由于 uni-app 支持在H5端使用微信JSSDK,以下代码示例假定你在H5环境下运行。

// 在页面的onLoad或mounted生命周期中初始化微信JSSDK
onLoad() {
  if (typeof wx !== 'undefined') {
    // 引入微信JSSDK脚本
    const script = document.createElement('script');
    script.src = 'https://res.wx.qq.com/open/js/jweixin-1.6.0.js';
    script.onload = () => {
      this.initWeChatSDK();
    };
    document.head.appendChild(script);
  }
},

methods: {
  initWeChatSDK() {
    wx.config({
      debug: false, // 开启调试模式
      appId: 'YOUR_APPID', // 必填,公众号的唯一标识
      timestamp: TIMESTAMP, // 必填,生成签名的时间戳
      nonceStr: NONCESTR, // 必填,生成签名的随机串
      signature: SIGNATURE, // 必填,签名
      jsApiList: ['subscribeMessage'] // 必填,需要使用的JS接口列表
    });

    wx.ready(() => {
      // 调用一次性订阅接口
      wx.subscribeMessage({
        tmplIds: ['YOUR_TEMPLATE_ID'], // 传入一个或多个模板ID
        success(res) {
          console.log('订阅成功', res);
        },
        fail(err) {
          console.error('订阅失败', err);
        }
      });
    });

    wx.error((err) => {
      console.error('微信JS接口配置失败', err);
    });
  }
}

步骤二:后端生成签名

在上面的代码中,TIMESTAMP, NONCESTR, 和 SIGNATURE 需要由你的后端服务器生成。生成签名需要使用微信公众平台的AppID和AppSecret,以及当前的URL。

后端生成签名的示例(Node.js):

const crypto = require('crypto');

function generateSignature(jsapi_ticket, noncestr, timestamp, url) {
  const string1 = `jsapi_ticket=${jsapi_ticket}&noncestr=${noncestr}&timestamp=${timestamp}&url=${url}`;
  return crypto.createHash('sha1').update(string1).digest('hex');
}

// 获取jsapi_ticket逻辑省略...

const nonceStr = 'RANDOM_STRING';
const timestamp = Math.floor(Date.now() / 1000);
const url = 'CURRENT_PAGE_URL'; // 注意URL需要编码
const signature = generateSignature(jsapi_ticket, nonceStr, timestamp, url);

注意事项

  1. 确保 YOUR_APPIDYOUR_TEMPLATE_ID 替换为你的公众号AppID和模板ID。
  2. 签名生成需要后端配合,前端无法直接生成。
  3. 一次性订阅接口调用有限制,请仔细阅读微信官方文档。

通过上述步骤,你可以在 uni-app 中成功调用微信公众号的一次性订阅方法。

回到顶部