https://api.weixin.qq.com/cgi-bin/freepublish/batchget?access_token=ACCESS_TOKEN 请求参数： { "offset":0, "count":10, "no_content":0 } 使用这个接口无法获取已发布列表，返回的是错误代码！ {"errcode":40097,"errmsg":"invalid args hint: [0yQ4dA0296d234] rid: 61a9e588-4a6e5666-37bdd2ca"} [图片]

AppID：wx05b683ac5e374894 问题类型：（Bug ） 框架类型：（小程序） 终端类型：（工具） 基础库版本：（2.2.3） 代码片段：（） [图片] 云函数端 调用nodejs 的 request库 无法获取get 请求的返回值 加载成功 但是无法获取返回值 [图片] 我在本地测试是成功 可以返回OK

[图片]                                            大家好，我是小打卡的前端负责人金轩正，今天分享的主题是如何基于微信原生构建应用级小程序底层架构，这个命题看上去好像有些大，不过不要紧，这次分享我把它拆一下，大致从 小程序原生开发面临的问题 小打卡整体架构演进 开发中摸索与实践 这三个方面来看这个讲一下 [图片]                                            小程序原生开发面临的问题[图片]                                            ok，首先第一个方面原生开发遇到的问题 小程序从17年诞生2年来一直处于互联网风口，不过对于开发者而言的整个开发体验不是特别友好，在17-18年之间我和很多开发小程序的小伙伴们聊过，大多数的反馈可能分为下面大致几类，当然还有更多: 没有父类，无法使用继承挂载全局方法，扩展生命周期没有父类，无法使用继承挂载全局方法，扩展生命周期 不支持跨页面/多页面通讯 setData的性能瓶颈 代码包大小限制 1/2/4/8 M，没有npm包 代码发布流程繁琐 其根本原因是将刚刚诞生的小程序与已经非常成熟的React，vue，angular作对比，而没有将小程序作为一个新的生态来看待，当然这个是一种看待事物的进步，并不是倒退，我在这里说这句话的意思是有更多的问题需要我们开发者主动去解决问题，推动整个生态的前进与发展 [图片]                                            其实这里可能有些朋友会问，已经有很多优秀的框架已经解决了这些问题，那么为什么还要使用原生开发？ 确实在这段时间内出现了很多优秀的解决方案，我们不用并不是因为情怀哈（当然还是有那么一丢丢） 更多的是下面几点： 历史包袱，改造成本过高  小打卡在小程序刚出现的时候就进入开发了，当时框架还不成熟，而且对创业公司来说时间和迭代效率高于一切，在人手不足，业务模式尚未形成，还处于探索阶段的情况下花费大量时间去做对产品影响较小, 甚至delay迭代速度事情不是很赚 减少与第三方沟通成本 高速迭代的情况下，将时间尽可能的覆盖于业务上，避免在整个开发-上线闭环上增加节点 避免开发黑盒，控制风险 虽然整个社区是非常活跃的，fixed一个问题同样是需要花费一定时间，但是很多时候需求是不会等你bug fixed 如非必要，勿增实体 即“简单有效原理”，这句话还是我去年刚来公司的时候和阿赖聊他所说过的 放在项目开发上我的理解是在架构层面要做的尽可能的薄，避免过度设计 这样才有足够的扩展性，灵活性，容错性 这些框架虽好，但是对我们当前业务来说可能过于复杂，比如跨端在之前的阶段还没有这方面需求，而像组件化小程序已经支持，自动化构建我们自己也是可以搭建的并不复杂 相信微信小程序团队 是真正的想把这件事情做好，而且做的是一个生态，不论是小程序对于反馈响应速度，和迭代速度非常给力，还是对开发者社区运营，比如是社区活跃与审核速度挂钩，社区周刊，优质个人和优质企业 对齐web标准，并且更加开放 [图片]                                            小打卡整体架构演进其实小打卡整个架构并非一蹴而就的，就像前面所说的如非必要，勿增实体，而是大量的实际开发中遇到的共同问题解决方案的集合题 [图片]                                            常规架构这个是微信小程序给出的快速开发模版的一个开发模式： server模块提供数据，App作为全局对象直连所有的业务模块，工具函数提供api处理业务模块的需求 优点： 整个模型非常简单，上手快，学习成本 低结构清晰，在业务不复杂的情况下可以快速开发 不瞒大家其实小打卡在最初的半年内基本都是这套模式。 当然是在业务不复杂的情况下，复杂情况下会出现哪些问题呢？ App作为全局对象在有大量业务模块连接的情况下，代码很容易膨胀，在多人开发的时候问题非常明显，无论是fixed bug还是正常的业务开发都会造成麻烦 页面之间独立，缺少公共模块，唯一的工具函数又要尽可能保持单一职责来提供服务（小打卡当时就是因为这个问题导致很多工具函数内部存储直接修改外部状态，导致大量强耦函数合无法拆分） 业务层直连server层，未拆分数据层的情况下，基本不存在复用性 上面所述的问题，从我接手这个项目到真正的调整持续了挺长一段时间，主要是缺乏一个契机来进行优化 优化的转折点 [图片]                                            然后突然有一天产品同学跑过来说： 我们要有自己的核心数据仓库，我们要看实时数据 ok，涉及到数据采集的问题了，我这边从浅到深大概列了几项： 最基础的多个页面pv，uv如何监控，不可能每个页面都要手动收集  为了统计页面和事件的分享和回流的数据，需要在分享事件携带大量的参数 微信的wx.previewImage, wx.chooseImage 等api对于用户session的收集造成很大麻烦 我们先解决第一个问题，如何收集页面pv，uv 容易陷入的误区 [图片]                                            在解决问题之前，我们先说一下开发小程序容易进入的误区 App 和 Page 等函数工厂是微信原生提供，不可修改 小程序项目结构是基于App, Page, 工具函数三个模块构建的 小程序的全局存储只有globalData和本地缓存 其实产生这些误区最根本的原因是小程序没有提供在复杂业务逻辑下的开发范式，比如vue，react有自己的通用开发模版 如果保持这些观念来进行开发的话，很容易将路子走窄，并且难以解决一些实际上的问题， 其实不论小程序和传统web有多少不同， 本质上还是在js环境下开发 小打卡架构图解 [图片]                                            为了更好的方便理解后面的具体实现，我提前放了一张目前小打卡的架构图 首先很熟悉的server这一边垫了一个数据层，主要将数据层和业务层解耦，提高复用性，并且提供一些通用功能，比如返回格式化数据问题，参数校验，日志监控... 在App对象和业务层同样增加了一个全局模块，提供独立于业务和工具类，只提供api之间双向通讯的渠道 工具模块的话其实就是对业务层的增强，比如常见的请求模块，上传模块，路由拦截等等 业务模块的话基本除了增加Component和中间层外没有太大变化 这个图上可能有两块可能大家觉得比较怪异，一个是global里面的函数重载，还有一个是业务模块的中间层是什么？ 函数重载其实就是修改微信提供的App, Page, Component函数，使其更符合我们的业务场景， 业务模块的中间层就是依赖于函数重载的扩展 其实小打卡的整套架构都是基于这两个模块，这两个模块赋予了更多的可能性，然而实现却十分的简单 点击查看：小打卡 | 如何基于微信原生构建应用级小程序底层架构（下）

点击查看：小打卡 | 如何基于微信原生构建应用级小程序底层架构（上）装饰模式[图片]                                            可能有朋友会好奇装饰器和我们接下来要做的原生函数扩展有什么关系？ 先看下装饰模式的定义：在不改变原函数的基础上，附加一些额外的功能 方便更好的理解 创建一个函数，然后将存在originF这个变量里，并对它重新赋值，最后执行，最后的执行直接结果是什么？ hello world!! 这样做的好处是什么，我们对函数f添加了一个新的功能，但是我们没有对原函数进行任何的修改 那么对于小程序的应用 照猫画虎一下，同样的将小程序原生的Page函数存起来，再重新赋值，看下结果，发现Page执行的时候每次都会console这句话，我这里有两个未分包的页面，就执行了2次 [图片]                                            回归到刚开始需要解决的问题，“多个页面pv，uv如何监控，不可能每个页面都要手动收集”， pv怎么算，pv的意思是页面浏览量，也就是需要页面生成时，对应到小程序生命周期就是onLoad 刚才我们做到了每个Page执行时添加功能，但是怎么在onLoad时进行数据统计呢？ 同样的可以用装饰函数修饰page里面的函数方法 [图1] 这个data就是我们实际在pages下写的业务逻辑对象，我们先拿到该页面的key名来进行遍历，首先排除掉非函数，拿到onLoad函数，这时候对它进行扩展，这时候每一个页面执行onLoad的时候都会console一次字符串，当然也可以替换为你想要的任何功能 [图2] 其实我们可以再优化一下，比如抽出一个对象，将你想要装饰的函数写入其中，如果原函数存在则进行装饰，如果不存在则直接赋值，这个抽出来的对象其实可以算是另一种继承方式的实现 它的意义在于[图片]                                            帮助我们开辟了一块公有空间，帮助我们扩展Page对象，并且可以劫持任意方法，在不修改原业务函数代码的情况下增加新的逻辑 其次也是最重要的是，我们完全不需要处理历史包袱 一个应用场景[图片]                                            左边是微信原生的分享方法 遇到的一些问题： 不便于扩展，多个分享策略时，代码块过大，并且分享的通用数据需要每个页面单独处理，例如统计回流信息需要的分享页面信息，事件信息 右边是依赖于我们刚刚开辟的公有空间里填写的公共方法，函数很简单，获得参数，获得页面分享策略，执行，顺便还做了obj转url的处理，避免了纯url书写长路径时的尴尬 思考[图片]                                            既然能扩展Page对象，那么App，Component甚至wx全局对象下的方法呢？ 有兴趣的朋友可以下来想一下 跨页面 / 多页面事件通知[图片]                                            我这边简单提一下跨页面通知的问题，这个应该算是很多小程序开发者遇到的通用问题，我问过的一些人，大部分是使用下面这两种方法，一种是getCurrentPages 页面栈队列，二种onShow upData global里的存储的数据，不管哪一种在业务复杂的情况下都会引起一定的问题，比如第一种的多级入口，第二种的话属于无效判断和及时性 小打卡这边用的简版的event Bus，一个只有80行代码的订阅方法， 左图是一个简单的示例，大致上就是分两种角色，订阅者和发布者，中间依靠任务队列联系，每次发布者推送消息，订阅者都会收到通知和相应的数据 [图片]                                            其实单纯的event bus也有很多的问题，比如：业务复杂情况下过于频繁，对业务代码侵入频繁，可以想像一下到处都是on，off, emit场景 解绑需要树立规范，但是人总是会犯错，容易绑定后忘记解绑或重复绑定的问题，比较浪费内存，对性能也有消耗 结合公共空间我们已知可以对生命周期进行扩展的时候怎么去解决这个问题 其实订阅必然是和页面结合，因为在页面不存在的情况下，发送通知也不会有反馈， 如何证明页面存在自然是onLoad 和 onUnload 按照这个逻辑我们只需要在onLoad和onShow做些处理即可 [图1] 先看右侧业务代码，按照策略注册了一个函数集合，在执行onLoad时，自动将业务内的onRss函数遍历，自定绑定订阅，并推到一个缓存数组内 onUnload时遍历缓存，自动解绑 这时订阅与页面的生命周期强绑定，我们不再需要处理解绑事件，也不需要在业务内插入订阅代码，只需要管理好当前页面的订阅策略即可 技术选型[图片]                                            没有哪一种一定正确的方案，在选型的时候可能需要考虑到上面大致6种元素, 总之选择最适合自己团队方案非常重要 一些小贴士：开发要尽量避免过度设计, 应根据实际需求, 比如之前在写现在这个简版的event bus库的时候设计了很多奇奇怪怪的 功能，现在2年过去还没用到  小程序和浏览器，node本质上是相通的，可以多借鉴和参考 The End今天我的分享就到此结束，算是这段时间对小程序开发上的一点心得体会，谢谢 [图片]                                           

wxml 页面的取整(这个方法是有争议的  我一般是这么写   留言区也有许多小伙伴分享了他们的方法  你们也可以参考) [代码]<!-- 后台返回值类型为   1.30  或者1.33  此时你需要  结果为  1 -->[代码]这样书写即可[代码]<[代码][代码]text[代码][代码]>{{1.30|parseInt}}</[代码][代码]text[代码][代码]>[代码][代码]{{前面是后台给的数据|parseInt}}[代码]es6箭头函数  简写 [代码]   onLoad: [代码][代码]function[代码][代码]() {[代码] [代码]   [代码][代码]},[代码] [代码]   [代码][代码]// 也可以这样简写[代码][代码]   [代码][代码]onLoad() {[代码] [代码]   [代码][代码]},[代码] [代码]   [代码][代码]test() {[代码][代码]       [代码][代码]wx.getSystemInfo({[代码][代码]           [代码][代码]success(res) {[代码][代码]               [代码][代码]//导航高度[代码][代码]               [代码][代码]this[代码][代码].data.navHeight = res.statusBarHeight + 46;[代码][代码]           [代码][代码]},[代码][代码]           [代码][代码]fail(err) {[代码][代码]               [代码][代码]console.log(err);[代码][代码]           [代码][代码]}[代码][代码]       [代码][代码]})[代码] [代码]       [代码][代码]// 也可以这样写[代码][代码]       [代码][代码]// 注意   当只有一个参数 res 时候可以这样简写[代码] [代码]       [代码][代码]wx.getSystemInfo({[代码][代码]           [代码][代码]success: res => {[代码][代码]               [代码][代码]//导航高度[代码][代码]               [代码][代码]this[代码][代码].data.navHeight = res.statusBarHeight + 46;[代码][代码]           [代码][代码]},[代码][代码]           [代码][代码]fail(err) {[代码][代码]               [代码][代码]console.log(err);[代码][代码]           [代码][代码]}[代码][代码]       [代码][代码]})[代码][代码]   [代码][代码]}[代码]           3.js中判断条件单一简写        [代码]this[代码][代码].data.refreshTime && clearInterval([代码][代码]this[代码][代码].data.refreshTime);[代码][代码]// 之前需要这样写[代码] [代码]if[代码] [代码]([代码][代码]this[代码][代码].data.refreshTime) {[代码][代码]    [代码][代码]clearInterval([代码][代码]this[代码][代码].data.refreshTime);[代码][代码]}[代码]4.页面渲染优化可以考虑部分使用wxs      官方文档指出：   由于运行环境的差异，在 iOS 设备上小程序内的 WXS 会比 JavaScript 代码快 2 ~ 20 倍。在 android 设备上二者运行效率无差异。 有时候遍历数据修改数据时候可以使用 【写在最后】：希望我的文章能帮助到你

GitHub 小程序介绍：https://developers.weixin.qq.com/community/develop/article/doc/000c827317c06851a658c801a5c813 - 需求的场景描述（希望解决的问题） [图片] [图片] 云开发的 API 突然从今天凌晨出现流量暴增，怎么才能查到是因为什么原因导致的呀？而小程序的页面访问次数又是正常的，凌晨就没多少人访问呀 现在陆续收到云开发配额不够的提醒 20190330 19:15 小程序云函数超过 200000 调用限制，申请了调整配额但是没有那么快调整，现在小程序已全部罢工。 - 希望提供的能力 怎么才能快速提高配额？ 或者换个思路，按小程序云函数能够单独部署到自己的机器上么？ 2019-03-30 21:35:11 在腾讯云提了个工单，工作人员帮忙提高了配额，客服反应小程序是归微信管理的，腾讯云没有权限。 但是流量增加的原因还是没能定位清楚，那除了使用小程序调用云函数，还有其他方式调用嘛？ 或者支不支持提前封禁一些请求？我这边看了日志，但是不方便分析是从哪里来的，如果你们可以给我导一份最近一个小时或者几十分钟的日志，我这边可以分析一下。 2019-03-31 在小程序的 Server 端不知道能不能在不消耗云函数调用次数的前提下封禁高频的 openid？目前不清楚流量来源只能紧急在小程序调用云函数的接口加上调用限制，2019-04-01 下午上线，现在看 2019-04-01 已经消耗了将近 80 万的配额，如果 2019-04-02 没有效果的话，明天配额又快不够了。。深深的无力感~ [图片] 2019-04-02 微信用 100 个账号来抓取小程序？https://developers.weixin.qq.com/community/develop/doc/6de0709282279f782805d50eb444ff38 但是这些访问是不是应该不算做云开发的配额里面呀？ [图片]