- 【简单高效】全面深度解析微信生态应用安全防护策略
作为开发者,最令我们头疼的可能并不是产品需求开发,而是在产品上线后出现的各种安全风险问题。 这些年,我们收到很多开发者提供的真实案例: 投票功能,本来要提供公平公正的投票服务,结果因为有人雇佣水军刷赞,造成投票严重不公平;发放活动优惠券,本来是刺激用户活跃的好活动,好不容易申请了经费,结果被羊毛党用非法手段拿走了90%,变价买卖。信息发布应用,访问人数很少但是服务器压力很大,因为每天会收到几十个爬虫的千万次请求。 ......这些案例一次次的发生,让我们产生了思考,到底哪个环节出问题了? 风险在哪里? 用户在使用小程序或H5应用时,业务请求从客户端发起,经过网络链路,到服务端;然后服务端根据请求处理事项并返回相应的内容,这是一个正常预期内的过程。 这里的客户端、网络链路、服务端,每一个部分都会成为被攻击的对象。我们一个个来盘点: 1. 客户端 小程序本身有代码加密插件,可以对上传的小程序代码混淆加密,并且从小程序发送的请求有明显的特征,只要服务端对应配置可以识别这些特征,攻击者破解和伪造的难度是非常高的。 但从诸多案例中我们发现,大部分攻击者不会直接从源码中破解请求体,而是使用模拟器、群控及设备农场的方式,通过外部辅助脚本或物理外挂的形式来去攻击。 比如“跳一跳”小游戏,很多玩家为了拿高分,不是去搞小游戏代码包伪造请求,而是直接搬上摄像头识别,通过距离识别,停顿秒数的计算,物理触发屏幕完成刷高分的成就。(网络搜一搜跳一跳外挂,八仙过海各显神通) [图片] 一般来说群控设备的解法要比直接破解代码包去伪造请求隐蔽的多,如果我们开发者只做了简单的 header 特征的识别,是很难抓到群控设备发出的请求的,从特征看,这些就是正常的手机直接点击完成的。 2. 网络链路 从客户端到服务端,一定是要经过本地网络和运营商网络,运营商网络直接做攻击行为的可能性很小,绝大部分的网络链路攻击都来源于本地网络。 攻击者通过对你正常的请求域名进行DNS污染,或通过代理你的网络,对客户端发出的请求做劫持和重放等,来达到TA的目的。 比如,因为开发者的逻辑失误,导致一个游戏道具的领取接口没有做校验和限制,发一个请求就领取一个道具,那么攻击者可以直接通过在链路上劫持并重放接口请求来刷道具。 除此之外还有很多很多,一半以上的攻击者目的都是为了自身,而不是去偷他人的数据,因为主观能动性,本地网络的链路劫持基本都能轻松完成。 3. 服务端 服务端是最容易被攻击的,并且大部分的攻击行为都是绕开客户端和网络链路(从客户端发来的链路),直接去搞服务端。这里列举一些常见的攻击手段: DDos攻击:分布式拒绝服务攻击,攻击者直接不择手段想把你的服务器打挂掉,从而影响你的正常业务。CC攻击:人海攻击手段,通过绑架大量肉鸡或者号召一大波人,直接把你服务端挤爆,让你无法服务正常的用户。BOT攻击:一般不会对你的服务器造成影响,只是通过后端接口缺陷,批量自动化获取你的业务信息,或者定时来获取你的信息,有部分是爬虫。黑客攻击手段:比如SQL注入、0day漏洞、加密凭证破解、网络阻塞攻击等,这些就不是用户抢道具这种的目标行为,而是有预谋的直接攻击你的基建。应该如何防范? 针对不同层面的攻击,我们应该有不同的防范方法,在这里我们给开发者整理了一些有效的方法: 1. 客户端 应用中尽量使用代码保护插件,对小程序代码进行混淆和加密,增加逆向工程的难度。应用中设置合理的操作频率限制和阈值警报,比如在页面打开后不允许立刻点击按钮,按钮加上防抖和节流。实现基于时间或挑战-响应的动态令牌机制,防止请求重放攻击。结合多维度信息(如硬件ID、网络特征、行为模式等)生成唯一标识,识别和追踪异常设备行为。接入用户行为分析监听,检测异常操作模式;比如跳一跳长时间有节奏的操作停顿,点击位置无变化,可以判定物理外挂。2. 网络链路 小程序强制使用HTTPS协议,但在其他客户端也应全面采用HTTPS协议,防止中间人攻击和数据窃听;另外有条件可以采取证书固定,防止SSL劫持。有能力的话,对每个请求进行签名,包含时间戳、nonce 等信息,服务端验证签名有效性。有条件可以进行双向认证,服务端也要对客户端证书做认证,确保通信双方身份。扩展使用 DNSSEC 或 HTTP-DNS 技术,防止DNS污染。3. 服务端 使用专业的DDoS防护服务器,实现流量清洗和智能负载均衡;另外应用层面要基于IP或者用户openid做访问频率限制。使用验证码或其他人机交互验证来辅助判断,比如关键接口滑动验证,或使用短信验证码确认。API层面要做细粒度的接口权限控制,对敏感接口应该有更严格的认证和授权机制。引入一些BOT检测机制,通过特征标记来识别和阻止自动化脚本;配合动态黑名单系统,自动封禁异常IP。部署WAF,防御常见的Web攻击,如SQL注入、XSS等;另外对服务器和后端服务软件的安全更新和补丁要及时处理。使用API网关,集中管理和监控API调用,将多个服务受攻击面缩减到一个,集中精力防护。 通过实现上述手段,我们能阻止绝大部分的安全攻击,但也对各位开发者提出了更高的要求;如果因为自身理解或者配置不当,很有可能会遗漏一些重要的点,造成防护失效,对业务服务造成损失。 那么有没有什么方法,能够让开发者简单操作就能实现上述所有防护手段,从而高效的处理的自己的业务开发呢? 微信做了什么? 微信官方团队,在去年就推出了集API网关、网络加速、请求加密、安全防护、流量管控于一体的「安全网关」,有一套完整的端到端的防护体系。从客户端到服务端,全面覆盖业务服务过程,为开发者提供简单、高效的保护和治理。 [图片] 「安全网关」的防护能力分链路层面、客户端层面、服务端层面,我们分别来看下几个层面的防护特点。 在链路层面上,实现了三层防护 第一层:请求进入网关的微信私有协议时,可以精准识别协议外挂、爬虫特征、模拟器攻击、黑灰产IP、DDos和CC攻击等各种异常请求,并及时拦截。第二层:经过第一层的初步清洗,在这一层会对伪造、篡改协议的请求进行清洗;同时结合用户请求频率、权限校验等风控能力拦截掉非法请求、越权请求、高频请求等;前两层的清洗已经拦截90%的异常流量,将剩余正常流量转发给业务源站。第三层:为了防止漏网之鱼,开发者可以选择接入第三层,网关会结合请求特征、设备信息、账号信息形成多维智能分析模型,对请求进行风险的判别,并将判别结果一同提交给业务源站,开发者可以参照或结合自己的数据,综合判断请求的合法性。开发者也可以授权网关直接对高风险的请求直接拦截,不转发给业务源站。在客户端层面,请求加密和风险识别 「安全网关」提供微信私有协议,二次封装,100%加密数据和接口,全程无明文数据传输,极大的提高外部抓包破解门槛。 并且「安全网关」支持在小程序、WEB、H5、APP等多端场景接入。尤其在微信小程序中,平台能在 wx.request 中直接转发请求到网关安全链路,无需开发者改代码;支持一键断连,恢复为普通请求链路。 [图片] 风险识别上,「安全网关」在微信小程序中推出「安全检测插件」,插件会根据设备环境、网络环境、用户行为、账号风险等多维度综合判断当前运行环境的可信情况,给出判断结果;开发者接入后可以在敏感业务前调用检测,检测通过才进行业务请求。 该扩展插件可以帮助开发者拦截群控、模拟器、设备农场等端场景的攻击行为,极大降低了游戏刷高分,集赞水军,自动羊毛党对正常业务的影响。 服务端层面提供信任参考 「安全网关」之所以称之为网关,是因为TA代理了所有客户端发送的请求,集中转发到开发者业务服务器中。在这个集中处理的过程中,实现了加密、加速、安全防护等多个效果。 作为服务端的开发者,我们在接入「安全网关」后,可以充分利用网关转发请求的附加信息,比如请求来源小程序appid、用户openid、用户unionid、用户风险标识等等,根据这些网关标记结合自身业务需求予以处理。 你可以在服务端对「安全网关」转发流量以外的其他流量设置限制访问,只接受「安全网关」的IP发过来的请求,将自己服务器隐藏在安全网关后面,更加安全;也可以设置其他更丰富化的防护策略,一切自由决定。 [图片] 如何接入安全网关? 目前网关控制台(请在 PC 端访问:https://dev.weixin.qq.com/console/gateway )已支持自助接入。 我们针对微信小程序提供一键接入方式,你可以无需任何代码改动和版本发布就可以体验。支持全量、URL灰度、用户灰度等策略,体验出现问题也支持一键断连。 针对其他客户端,如WEB、H5、PC端场景,也提供手动接入方案。 我们还推出了系列视频课程,全面讲解「安全网关」的各方面使用细节,让开发者上手更容易:微信网关系列课程 如果你有企业级版本(预期 >1000 QPS)的接入需求,请邮件联系我们专业对接:donut@tencent.com
2024-09-03 - 云模版初体验:小程序从 0 开始接入一个 AI 智能体
引言 在今年 4 月份的 Create 2024 百度 AI 开发者大会上,李彦宏介绍了百度的智能体开发工具 AgentBuilder,他表示:“智能体可能是未来离每个人最近、最主流的大模型使用方式,基于强大的基础模型,智能体可以批量生成,应用在各种各样的场景。百度刚刚升级了文心智能体平台。截至目前,已经有 3 万多个智能体被创建、5 万多名开发者和上万家企业入驻。我们的目标是,让每个人、每个组织都成为智能体的开发者,打造国内最完整的智能体生态。” 云开发的 AI 智能体应用平台大大降低了开发者接入大模型的难度,开发者可零代码安装一个智能体模板,支持发布到小程序、H5、微信客服、微信订阅号、微信服务号多个场景。并且支持编辑提示词训练一个专属自己的智能体。 下面就来体验一下。 安装智能体 1、 新注册一个小程序 2、点击云开发,需要开通云开发环境,首月免费。 [图片] 3、点击云模板,然后点击去使用,会进入到云模板控制台,然后进入模板中心。 [图片] 4、进入AI 智能体,点击安装。耐心等待…… 等待安装完成后,进入我的应用,即能看到自己已经安装的模板。 [图片] 5、进入 AI 智能体详情,能看到详细的集成文档。点击预览模拟效果就能先睹为快。 [图片] 6、点发现智能体,能看到默认加载的几个智能体。点击访问预览链接,能够在网页端体验智能体的效果。 [图片] 发布智能体到小程序 安装完 AI 智能体之后就可以发布到小程序了,这时候发布的即是默认加载的几个智能体。 1、点击添加至多平台,以子包的形式发布到小程序。点击添加至小程序,会生成添加方案。这里我目测根据小程序的结构不同,方案会不同,所以建议每次发布都重新生成一下方案,不要把其他小程序的方案复制过来直接使用。 [图片] [图片] 2、方案中提供了 javascript 添加或者 wxml 添加两种,根据自己的喜好即可。 编译小程序预览一下,集成成功了。 [图片] 小程序上线 在 AI 智能体使用须知这一章节中,文档中明确写明: 在发布 AI 智能体到小程序时,微信将在代码审核阶段核实小程序运营的内容与所选类目是否相符。AI 问答涉及深度合成技术,需补充【深度合成-AI 问答】服务类目。 目前,个人主体小程序尚未开放深度合成相关服务类目,建议申请企业主体类型小程序。 对于个人客户,考虑到类目限制,建议使用 H5 或公众号(订阅号/服务号均可)等其他方式实现 AI 智能体的功能。 所以只能是企业主体去申请小程序,并提供相关资料。 [图片] [图片] 搭建自定义智能体 如果想根据自己的业务场景搭建一个自定义的智能体,管理后台提供了便捷的操作方法。 1、从 AI 智能体详情中点击服务管理模块,在管理后台中点击访问,会从浏览器端打开管理后台。 [图片] 2、在管理后台中,可以选择1 分钟创建智能体或者从模板创建。 [图片] 3、在人设与回复逻辑当中输入自定义的提示词,即可训练一个专属自己的智能体。 [图片] 4、自定义成功后即可和默认智能体一样的流程上线到小程序。 上线成功,来体验一下吧 [图片]
2024-06-25 - 小程序页面加水印,防止用户截图分享隐私数据
为了防止用户将小程序内的隐私数据进行截图或者录屏分享导致信息泄露,我们会在小程序全局添加一个水印浮层。这样即使被截图或者拍照,也能轻松地确定泄露的源头。 小程序防止用户截屏的方法有很多,其中一种常见的方法就是在小程序的页面中添加水印。具体实现方法如下: 在小程序中的页面中添加水印浮层,一般通过绝对定位来实现,这样可以使水印在页面的最上层,无法被其他元素覆盖。设计水印的样式和位置,通常可以在小程序的样式文件中设置,例如设置水印的位置为右下角,样式为半透明的字体,以免影响正常的内容展示。对于不同类型的页面,可以根据需要添加不同的水印,例如在敏感信息页面添加比较醒目的水印,而在其他普通页面只添加轻微的水印。如果需要防止用户截屏或者拍照,可以在小程序中添加截屏监听事件,并在用户进行截屏或者拍照操作时,自动添加水印。 总的来说,小程序防止用户截屏的方法还有很多,例如使用安全键盘等,但是添加水印仍然是最为常见的一种方法。通过添加水印,可以有效地防止用户截屏和分享敏感信息,保护用户和单位的信息安全。 下面是一个简单的示例,position选择固定定位fixed,固定定位会固定在浏览器窗口某个位置,不会随滚动条滚动。用z-index将元素的层级设置为最低,将view旋转45度,效果就出来啦 [图片] <view style="position: fixed;top: -10vh; left:-100vw;width: 250vw; height: 100vh; z-index: -999;transform: rotate(-45deg);"> <block wx:for="{{30}}" wx:key="index" wx:if="{{userInfo}}"> <view style="color:gray; margin:30rpx; padding:20rpx; opacity: 0.15;"> {{userInfo.user_name + ' ' + userInfo.user_phone}} {{userInfo.user_name + ' ' + userInfo.user_phone}} {{userInfo.user_name + ' ' + userInfo.user_phone}} {{userInfo.user_name + ' ' + userInfo.user_phone}} </view> </block> </view>
2023-02-23 - setData动态key的使用以及使用建议
相信每个小程序开发者用的最多的函数非setData莫属,setData是小程序开发中使用最频繁、也是最容易引发性能问题的接口。 本篇内容主要讲小程序setData的用法、注意事项、使用建议以及动态key的写法。 setData介绍 Page.prototype.setData(Object data, Function callback) [代码]setData 函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)。 [代码] 字段 类型 必填 描述 最低版本 data Object 是 这次要改变的数据 callback Function 否 setData引起的界面更新渲染完毕后的回调函数 1.5.0 Object 以 key: value 的形式表示,将 this.data 中的 key 对应的值改变成 value。 注意事项 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致。 仅支持设置可 JSON 化的数据。 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。 请不要把 data 中任何一项的 value 设为 undefined ,否则这一项将不被设置并可能遗留一些潜在问题。 示例代码: 在开发者工具中预览效果 使用建议 1. data 应只包括渲染相关的数据 setData 应只用来进行渲染相关的数据更新。用 setData 的方式更新渲染无关的字段,会触发额外的渲染流程,或者增加传输的数据量,影响渲染耗时。 ✅ 页面或组件的 d- ata 字段,应用来存放和页面或组件渲染相关的数据(即直接在 wxml 中出现的字段); ✅ 页面或组件渲染间接相关的数据可以设置为「纯数据字段」,可以使用 setData 设置并使用 observers 监听变化; ✅ 页面或组件渲染无关的数据,应挂在非 data 的字段下,如 this.userData = {userId: ‘xxx’}; ❌ 避免在 data 中包含渲染无关的业务数据; ❌ 避免使用 data 在页面或组件方法间进行数据共享; ❌ 避免滥用 纯数据字段 来保存可以使用非 data 字段保存的数据。 2. 控制 setData 的频率 每次 setData 都会触发逻辑层虚拟 DOM 树的遍历和更新,也可能会导致触发一次完整的页面渲染流程。过于频繁(毫秒级)的调用 setData,会导致以下后果: 逻辑层 JS 线程持续繁忙,无法正常响应用户操作的事件,也无法正常完成页面切换; 视图层 JS 线程持续处于忙碌状态,逻辑层 -> 视图层通信耗时上升,视图层收到消息的延时较高,渲染出现明显延迟; 视图层无法及时响应用户操作,用户滑动页面时感到明显卡顿,操作反馈延迟,用户操作事件无法及时传递到逻辑层,逻辑层亦无法及时将操作处理结果及时传递到视图层。 因此,开发者在调用 setData 时要注意: ✅ 仅在需要进行页面内容更新时调用 setData; ✅ 对连续的 setData 调用尽可能的进行合并; ❌ 避免不必要的 setData; ❌ 避免以过高的频率持续调用 setData,例如毫秒级的倒计时; ❌ 避免在 onPageScroll 回调中每次都调用 setData。 3.setData 应只传发生变化的数据 setData 的数据量会影响数据拷贝和数据通讯的耗时,增加页面更新的开销,造成页面更新延迟。 ✅ setData 应只传入发生变化的字段; ✅ 建议以数据路径形式改变数组中的某一项或对象的某个属性,如 This.Setdata({‘Array[2].Message’: ‘Newval’, ‘A.B.C.D’: ‘Newval’}),而不是每次都更新整个对象或数组; ❌ 不要在 setData 中偷懒一次性传所有data:this.setData(this.data)。 修改数组动态key的写法以及修改对象的某个属性 在开发者工具中预览效果 动态修改数组的某个元素 用一个中括号修饰表达式即可 [代码]clickItem(e){ let item = e.currentTarget.dataset.item let index = e.currentTarget.dataset.index // 第一种 可以只改某个数组的元素 // item.selected =!this.data.list[index].selected // this.setData({ // ['list['+ index + ']']: item // }) //第二种 也可以直接修改某个数组的某个属性 this.setData({ ['list['+ index + '].selected']: !this.data.list[index].selected }) }, [代码] 以数据路径形式改变数组中的某一项或对象的某个属性 [代码]clickObject(e){ this.setData({ 'user.clickNum': this.data.user.clickNum + 1 }) }, [代码] 更多内容可以仔细查看官方文档: setData 函数详解(在文档的底部) 合理使用 setData
2023-04-24 - 微信小程序的UnionID详解和使用场景
什么是UnionID ?(UnionID机制说明) 首先来看官方的定义: 如果开发者拥有多个移动应用、网站应用、和公众帐号(包括小程序),可通过 UnionID 来区分用户的唯一性,因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号(包括小程序),用户的 UnionID 是唯一的。换句话说,同一用户,对同一个微信开放平台下的不同应用,UnionID是相同的。(官方关于unionid原文档链接) 举个场景栗子:如果你有一个小程序A、一个小程序B、一个微信公众号【发发发】,并且将它们绑定到同一个微信开放平台账号下面。当微信号zhangsan666的用户进入到小程序A或者小程序B或者公众号发发发的时候,获取到的unionid是相同的。这样就可以根据unionid查询到当前微信用户在当前开放平台下的每个小程序或公众号里边的数据。对A小程序和B小程序和公众号的数据互通,提供了极大的便利。 UnionID获取途径 绑定了微信开放平台的小程序,可以通过以下途径获取 UnionID。 开发者可以直接通过 wx.login + [代码]code2Session[代码] 获取到该用户 UnionID,无须用户授权。小程序端调用云函数时,可在云函数中通过 Cloud.getWXContext 获取 UnionID。用户在小程序(暂不支持小游戏)中支付完成后,开发者可以直接通过[代码]getPaidUnionId[代码]接口获取该用户的 UnionID,无需用户授权。注意:本接口仅在用户支付完成后的5分钟内有效,请开发者妥善处理。 一般采用第一种途径获取用户的unionid,简单方便,在获取用户openid的同时,直接添加两个字段保存用户的session_key和unionid 微信开放平台的注册及绑定小程序、公众号... 如果想使用unionid,首先要注册微信开放平台,并且花300大洋进行开发者资质认证。微信开放平台访问地址: https://open.weixin.qq.com/ 认证通过后在 管理中心 — 小程序 — 绑定小程序 [图片] [图片] 如果感觉文章对你有帮助,请点个赞吧
2023-03-13 - 公众号快速注册并认证小程序
为方便公众号快捷接入小程序,并在各功能中使用小程序的服务,上线复用公众号资质注册小程序流程。快速注册认证小程序,无需重新提交主体材料、无需对公打款、无需支付300元认证费用。 条件:已认证的企业、媒体、政府、其他组织类型公众号 限制:非个体户类型(企业、媒体、政府、其他组织类型)公众号一个月可以复用资质注册5个小程序,个体户一个月可以复用资质注册1个小程序。 开通入口: 登录公众号-小程序-小程序管理-添加-快速注册并认证小程序 相关规则: 1、复用资质创建的小程序默认与该公众号关联; 2、复用资质创建的小程序默认关联该公众号,不占一个月新增关联13个小程序的限制; 3、复用资质创建的小程序默认关联公众号,不下发模板消息,不默认出现在公众号资料页; 4、一个公众号若存在“待完成注册”的小程序,不可发起复用资质创建小程序; 5、一个公众号一个月内可复用资质注册小程序不多于5个。(创建成功才占用); 6、使用复用公众号资质注册小程序,将以本公众号的主体作为该小程序的开发者,可选择以本公众号运营者作为该小程序的管理员; 7、若选择了复用认证资质,则小程序完成注册后即是“已认证”状态。 创建流程: 第一步:登录公众号->小程序->小程序管理->添加->快速注册并认证小程序 [图片] 第二步:同意协议 [图片] 第三步:管理员扫码验证 [图片] 第四步:勾需要选快速创建小程序的资质 [图片] 注:复用微信认证资质不需要再次支付认证审核服务费,也不需要审核。 第五步:填写小程序帐号信息 [图片] 注:需要一个未绑定个人微信或其他公众平台的邮箱。 第六步:邮件激活小程序帐号,激活完成后即可使用邮箱帐号密码登录小程序。 [图片] 第七步:绑定小程序管理员 [图片] 注:绑定管理员,如果有在第四步有勾选复用运营者信息。最终以绑定管理员信息为准。 以上注册流程创建的小程序,不用再走小额打款验证主体。生成的帐号具有独立的邮箱帐号、密码,跟走正常注册流程注册的小程序具有一样的能力权限。
2023-10-10 - 小程序app.onLaunch与page.onLoad异步问题的最佳实践
场景: 在小程序中大家应该都有这样的场景,在onLaunch里用wx.login静默登录拿到code,再用code去发送请求获取token、用户信息等,整个过程都是异步的,然后我们在业务页面里onLoad去用的时候异步请求还没回来,导致没拿到想要的数据,以往要么监听是否拿到,要么自己封装一套回调,总之都挺麻烦,每个页面都要写一堆无关当前页面的逻辑。 直接上终极解决方案,公司内部已接入两年很稳定: 1.可完美解决异步问题 2.不污染原生生命周期,与onLoad等钩子共存 3.使用方便 4.可灵活定制异步钩子 5.采用监听模式实现,接入无需修改以前相关逻辑 6.支持各种小程序和vue架构 。。。 //为了简洁明了的展示使用场景,以下有部分是伪代码,请勿直接粘贴使用,具体使用代码看Github文档 //app.js //globalData提出来声明 let globalData = { // 是否已拿到token token: '', // 用户信息 userInfo: { userId: '', head: '' } } //注册自定义钩子 import CustomHook from 'spa-custom-hooks'; CustomHook.install({ 'Login':{ name:'Login', watchKey: 'token', onUpdate(token){ //有token则触发此钩子 return !!token; } }, 'User':{ name:'User', watchKey: 'userInfo', onUpdate(user){ //获取到userinfo里的userId则触发此钩子 return !!user.userId; } } }, globalData) // 正常走初始化逻辑 App({ globalData, onLaunch() { //发起异步登录拿token login((token)=>{ this.globalData.token = token //使用token拿用户信息 getUser((user)=>{ this.globalData.user = user }) }) } }) //关键点来了 //Page.js,业务页面使用 Page({ onLoadLogin() { //拿到token啦,可以使用token发起请求了 const token = getApp().globalData.token }, onLoadUser() { //拿到用户信息啦 const userInfo = getApp().globalData.userInfo }, onReadyUser() { //页面初次渲染完毕 && 拿到用户信息,可以把头像渲染在canvas上面啦 const userInfo = getApp().globalData.userInfo // 获取canvas上下文 const ctx = getCanvasContext2d() ctx.drawImage(userInfo.head,0,0,100,100) }, onShowUser() { //页面每次显示 && 拿到用户信息,我要在页面每次显示的时候根据userInfo走不同的逻辑 const userInfo = getApp().globalData.userInfo switch(userInfo.sex){ case 0: // 走女生逻辑 break case 1: // 走男生逻辑 break } } }) 具体文档和Demo见↓ Github:https://github.com/1977474741/spa-custom-hooks 祝大家用的愉快,记得star哦
2023-04-23 - 小程序搜索优化指南(SEO)
2019年上半年微信发布了基于小程序页面的搜索,为了让我们更好地发现及理解小程序的页面,结合过去一段时间来我们遇到的各种情况,我们强烈建议各位开发者花一些宝贵的时间认真阅读本文:) 爬虫访问小程序内页面时,会携带特定的 user-agent "mpcrawler" 及场景值:1129 1. 小程序里跳转的页面 (url) 可被直接打开。 小程序页面内的跳转url是我们爬虫发现页面的重要来源,且搜索引擎召回的结果页面 (url) 是必须能直接打开,不依赖上下文状态的。特别的:建议页面所需的参数都包含在url 2. 页面跳转优先采用navigator组件。 小程序提供了两种页面路由方式: a.navigator 组件 b. 路由 API,包括 navigateTo / redirectTo / switchTab / navigateBack / reLaunch 建议使用 navigator 组件,若不得不使用API,可在爬虫访问时屏蔽针对点击设置的时间锁或变量锁。 3.清晰简洁的页面参数。 结构清晰、简洁、参数有含义的 querystring 对抓取以及后续的分析都有很大帮助,但是将 JSON 数据作为参数的方式是比较糟糕的实现。 4. 必要的时候才请求用户进行授权、登录、绑定手机号等。 建议在必须的时候才要求用户授权(比如阅读文章可以匿名,而发表评论需要留名)。 5. 我们不收录 web-view 中的任何内容。 我们暂时做不到这一点,长期来看,我们可能也做不到。 6. 利用 sitemap 配置引导爬虫抓取,同时屏蔽无搜索价值的路径。 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html 7. 设置一个清晰的标题和页面缩略图。 页面标题和缩略图对于我们理解页面和提高曝光转化有重要的作用。 通过wx.setNavigationBarTitle或 自定义转发内容onShareAppMessage对页面的标题和缩略图设置,另外也为 video、audio 组件补齐 poster /poster-for-crawler属性。 8. 使用页面路径推送能力 可极大丰富微信可以收录的内容,进而提高小程序内容的曝光机会。请参考: https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/search/search.submitPages.html
2020-01-14