uni-app 微信公众号(H5)自定义分享,禁止分享

先放一个官方文档的链接

https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#48


上代码:

禁止分享:

async hideShare() {
    let locationHref = {url: window.location.href};
    let info = await request({
      url: `这个是后台提供的接口地址,会提供你分享的一些基本配置详细见微信官方文档`,
      method: 'post',
      data: locationHref
    });
    const data = info.data.result;
    // 这个要先npm install jweixin-module --save(具体命令行各位在百度一下吧,我忘了)然后在这样=一下
    const wx = require('jweixin-module'); 
    wx.config({
      debug: false,
      appId: data.appId, // 和获取Ticke的必须一样------必填,公众号的唯一标识
      timestamp: data.timestamp, // 必填,生成签名的时间戳
      nonceStr: data.nonceStr, // 必填,生成签名的随机串
      signature: data.signature, // 必填,签名,见附录1
      jsApiList: [
        'hideMenuItems'
      ]
    });
    console.log('禁止分享');
    // 禁止分享
    wx.hideMenuItems({// 要隐藏的菜单项,只能隐藏“传播类”和“保护类”按钮,所有menu项见附录3
      menuList: ['menuItem:share:appMessage','menuItem:share:timeline','menuItem:share:timeline', 'menuItem:share:qq', 'menuItem:favorite', 'menuItem:share:QZone','menuItem:openWithSafari']
    });
  }

分享:

 let locationHref = {url: window.location.href};
    let info = await request({
      url: `/xxx/xx/xx/xx`,
      method: 'post',
      data: locationHref
    });
    const _this = this;
    const data = info.data.result;
    const wx = require('jweixin-module');
    wx.config({
      debug: false,
      appId: data.appId, // 和获取Ticke的必须一样------必填,公众号的唯一标识
      timestamp: data.timestamp, // 必填,生成签名的时间戳
      nonceStr: data.nonceStr, // 必填,生成签名的随机串
      signature: data.signature, // 必填,签名,见附录1
      //需要分享的列表项:发送给朋友,分享到朋友圈,分享到QQ,分享到QQ空间
      jsApiList: [
        "updateAppMessageShareData",
        "updateTimelineShareData",
        'showMenuItems'
      ]
    });
// 安卓这块不用showMenuItems也可以,但是ios情况下,去了禁止分享的页面在去可以分享的页面,就不能 
// 分享,所以需要在开启一下
    wx.showMenuItems({
      menuList: ['menuItem:share:appMessage','menuItem:share:timeline','menuItem:share:timeline', 'menuItem:share:qq', 'menuItem:favorite', 'menuItem:share:QZone','menuItem:openWithSafari'] // 要显示的菜单项,所有menu项见附录3
    });
    //处理验证失败的信息
    wx.error(function(res) {
    });
    let imgUrl = getImgUrl(shareObj.imgUrl);
    imgUrl = imgUrl ? imgUrl : this.currentObject.defaultConfigs.shareDefaultImgUrl;
    //处理验证成功的信息
    wx.ready(function() {
      //分享到朋友圈
      wx.updateTimelineShareData({
        title: shareObj.title ? shareObj.title : this.currentObject.defaultConfigs.shareDefaultTitle, // 分享标题
        desc: shareObj.desc ? shareObj.desc : '',
        link: shareObj.link? shareObj.link : window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
        imgUrl: imgUrl, // 分享图标
        success: function(res) {
          // 用户确认分享后执行的回调函数
          _this.shareSuccess(res);
        }
      });
      //分享给朋友
      wx.updateAppMessageShareData({
        title: shareObj.title ? shareObj.title : this.currentObject.defaultConfigs.shareDefaultTitle, // 分享标题
        desc: shareObj.desc ? shareObj.desc : '', // 分享描述
        link: shareObj.link? shareObj.link : window.location.href, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
        imgUrl: imgUrl, // 分享图标
        type: "", // 分享类型,music、video或link,不填默认为link
        dataUrl: "", // 如果type是music或video,则要提供数据链接,默认为空
        success: function(res) {
          // 用户确认分享后执行的回调函数
        }
      });
    });

效果:

禁止分享给朋友,朋友圈,qq啥的,效果图如下:

 

可以分享至朋友,朋友圈,qq啥的效果图:

 

***uni-app 初学者,以上代码均为自己摸索得出,如有错误,请指正。***

  • 1
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uni.app 中使用微信公众号 H5 支付,你可以按照以下步骤进行操作: 1. 首先,确保你已经配置好了微信公众号支付功能,并且已经获取到了支付的相关参数,例如订单号、支付金额等。 2. 在 uni-app 中,可以使用 `uni.request` 或其他网络请求库来发起支付请求。你需要向微信支付接口发送一个 POST 请求,包含支付相关的参数。 例如: ```javascript uni.request({ url: 'https://api.mch.weixin.qq.com/pay/unifiedorder', // 微信支付接口地址 method: 'POST', data: { // 支付参数,例如 appid、mch_id、nonce_str、body、out_trade_no、total_fee 等 }, success: (res) => { // 请求成功的回调函数 // 解析返回的数据,获取预支付交易会话标识 prepay_id const prepayId = res.data.prepay_id; // 调用 H5 支付接口进行支付 uni.requestPayment({ provider: 'wxpay', timeStamp: '', // 时间戳 nonceStr: '', // 随机字符串 package: '', // 统一下单接口返回的 prepay_id 参数值 signType: 'MD5', paySign: '', // 签名 success: (res) => { // 支付成功的回调函数 console.log(res); }, fail: (err) => { // 支付失败的回调函数 console.log(err); } }); }, fail: (err) => { // 请求失败的回调函数 console.log(err); } }); ``` 在上述代码中,你需要根据实际情况填写支付接口地址、支付参数、预支付交易会话标识 prepay_id 以及支付的回调函数。 3. 当用户点击支付按钮后,会触发支付请求,用户将会跳转到微信支付页面完成支付操作。 请注意,以上代码仅为示例,实际使用时需要根据 uni-app 中的具体语法和微信支付接口的要求进行相应的调整和处理。同时,确保在后端服务器中进行订单处理和验证,以确保支付的安全和准确性。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值