统计
  • 建站日期:2021-03-10
  • 文章总数:1093 篇
  • 评论总数:2254 条
  • 分类总数:14 个
  • 最后更新:2月13日
文章 未分类

微信小程序禁止PC端打开,防止白嫖和电脑抓接口

安小熙
首页 未分类 正文
广告

每日靠着微薄的小程序广告度日,继之前检测手机端微信跳过小程序广告插件检测后又发现小程序广告在电脑端经常没广告,导致收入备降!虽然每天只有几块钱的收入,哈哈哈!那么怎么做到禁止小程序使用电脑端微信打开呢?想到获取设备信息判断是否为移动端设备不是就弹窗让用户扫码使用手机微信打开。

通过官方接口文档wx.getSystemInfoSync() 发现platform返参刚好符合我的需求。然后设计一个组件方便后期页面调用。

代码

1.创建一个弹窗组件

a. components/Popup/Popup.wxml:

<view wx:if="{{show}}" class="popup">
  <view class="popup-content">
    <view class="popup-header">
      <text>提示</text>
    </view>
    <image src="{{qrCodeSrc}}" class="qr-code" />
    <view class="popup-footer">
      <text>请用手机端微信扫一扫继续体验</text>
    </view>
  </view>
</view>

b. components/Popup/Popup.wxss:

.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(128, 128, 128);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999;
}

.popup-content {
  background-color: #fff;
  padding: 20px;
  width: 100%;
  border-radius: 10px;
  text-align: center;
}

.popup-header {
  margin-bottom: 20px;
}

.qr-code {
  width: 200px;
  height: 200px;
  margin-bottom: 20px;
}

.popup-footer {
  margin-top: 20px;
}

c. components/Popup/Popup.js:

Component({
  properties: {
    show: {
      type: Boolean,
      value: false
    },
    qrCodeSrc: {
      type: String,
      value: '/path/to/your/QRCodeImage.png'
    }
  }
});

d. components/Popup/Popup.json:

{
  "component": true
}

2.使用弹窗组件

a. pages/index/index.wxml:

<view class="container">
  <!-- 其他内容 -->
  <Popup show="{{showPopup}}" qrCodeSrc="/path/to/your/QRCodeImage.png" />
</view>

b. pages/index/index.js:

Page({
  data: {
    showPopup: false
  },
  onLoad: function() {
    const systemInfo = wx.getSystemInfoSync();
    if (systemInfo.platform !== 'android' && systemInfo.platform !== 'ios') {
      this.setData({
        showPopup: true
      });
    }
  }
});

c. pages/index/index.json:

{
  "usingComponents": {
    "Popup": "/components/Popup/Popup"
  },
  "navigationBarTitleText": "软件接口平台",
  "navigationBarBackgroundColor": "#ffffff",
  "navigationBarTextStyle": "black"
}

弹窗功能封装成了一个模块组件,并且可以在需要的页面中调用它。确保替换 /path/to/your/QRCodeImage.png 为实际的二维码图片路径。

微信小程序禁止PC端打开,防止白嫖和电脑抓接口
-安小熙博客
-第1
张图片

版权说明
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络收集整理,如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件:axxgzs@qq.com与我们联系处理。敬请谅解!!

07日24日,星期三,在这里每天60秒读懂世界!
« 上一篇
07日23日,星期二,在这里每天60秒读懂世界!
下一篇 »
为了防止灌水评论,登录后即可评论!

HI ! 请登录
注册会员,享受下载全站资源特权。

🔎百度一下

帮忙seo优化一下吧

☁天气预报

标签

最新文章