微信小程序禁止PC端打开,防止白嫖和电脑抓接口搬砖的小易4个月前更新关注私信07711 教程简介: 每日靠着微薄的小程序广告度日,继之前检测手机端微信跳过小程序广告插件检测后又发现小程序广告在电脑端经常没广告,导致收入备降!虽然每天只有几块钱的收入,哈哈哈!那么怎么做到禁止小程序使用电脑端微信打开呢?想到获取设备信息判断是否为移动端设备不是就弹窗让用户扫码使用手机微信打开。 通过官方接口文档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 为实际的二维码图片路径。 供学习和研究使用,禁止商业用途 购买前可以联系作者确认资源信息,防止交易矛盾 © 版权声明 版权声明 1 本网站名称:易幻云资源网 2 本站永久网址:https://www.yihuanyun.cc 3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长 QQ2956667505进行删除处理。 4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。 5 本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报 6 本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。 THE END技术教程教程之家 喜欢就支持一下吧点赞11收藏