1、获取 lodash: 在 miniprogram 目录下 npm install -s lodash ** node_modules/ 不会被打包到目标包 2、复制 lodash 源码到 lib 目录 $ mkdir -p lib $ cp node_modules/lodash/lodash.min.js lib 3、编辑 app.js，添加以下内容 Object.assign(global, { Array : Array, Date : Date, Error : Error, Function : Function, Math : Math, Object : Object, RegExp : RegExp, String : String, TypeError : TypeError, setTimeout : setTimeout, clearTimeout : clearTimeout, setInterval : setInterval, clearInterval : clearInterval }); 4、引用 lodash 库 const _ = require(’./lib/lodash.min’);

说明 使用BackgroundAudioManager创建的实例，小程序切换到手机后台、小程序内页面间跳转，都不会影响音频的连续播放，可以很好的实现一个音频播放器。 BackgroundAudioManager是单实例，全局唯一，在任意页面任何位置调用wx.getBackgroundAudioManager()既可以获得。 效果 音频列表循环播放，支持上一首、下一首切换，实时进度展示，快进。 思路 将播放的音频列表放在app.globalData或本地做缓存，保证音频切换时找到对应列表。 将音频播放的实时状态放在app.globalData或本地做缓存，保证展示音频播放详情页的音频名称、实时进度等正确展示。 方法中BackgroundAudioManager.on*为监听事件，操作业务放在回调函数中处理。 BackgroundAudioManager的属性中，所有属性可以直接BackgroundAudioManager.获取值，非只读的属性可以通过BackgroundAudioManager. = ‘’ 方式赋值。 效果图 小程序界面 [图片] 手机后台，顶部下拉 [图片] 代码片段 详细代码请下载代码片段，可以直接运行demo。 https://developers.weixin.qq.com/s/VAmjRsmZ7090

小程序 命令行 使用记录 x 公司小x，接到一个小程序的开发任务，对于开发经验充足的小x来说这都不在话下，经过一段时间的努力奋斗，小x熟悉了代码，bug也改了不少。 上线完 1.0 版本之后，2.0 版本就来了。开发过程中，小程序的bug来了，需要扫码测试，老大找到小x了解具体的情况。 老大：“小程序的bug是什么问题？“ 小x激动地说：“微信小程序后台提供了数据监控、bug监控，可以对小程序进行统计分析、错误统计，包括：行为分析，来源分析，实时统计，用户画像……” 老大：“先给测试预览码吧，定位一下问题” 小x陷入了沉思，内心 os：“我8G内存的mac，IDEA跑两个项目，开发工具在跑起来爆炸了算谁的。。” 小x默默的打开了开发者工具，只听安静的办公室开始了 wengweng 的风扇转速声～ 有困难看文档 开发者工具提供了命令行与 HTTP 服务两种接口供外部调用，开发者可以通过命令行或 HTTP 请求指示工具进行登录、预览、上传等操作。 开发者可以通过命令行或 HTTP 请求指示工具进行登录、预览、上传等操作 搞起～ 准备工作 请先开启服务端口。 设置 --> 服务端口开启 [图片] 打开文档 [代码]https://developers.weixin.qq.com/miniprogram/dev/devtools/cli.html[代码] 打开常用的终端 命令行工具所在位置： macOS: <安装路径>/Contents/MacOS/cli Windows: <安装路径>/cli.bat mac： [图片] 正常操作是直接把 cli 拖到 命令行可以跑，肯定能跑起来的。 平时使用两个工具 [代码]终端[代码]和[代码]iTerm2[代码], （终端正常够用，因为要使用 lrzsz 才用的iTrem2） 开始配置 常规的 你用终端打开 cli 正常，使用 iTerm2 打开会报错，什么问题导致的，不管。平时用终端的，那我们就配置终端咯 添加环境变量 正常情况我们只需要添加环境变量就ok了。 [代码]cd ~ vim ~/.bash_profile // 添加cli export PATH="/Applications/wechatwebdevtools.app/Contents/MacOS/:$PATH" source .bash_profile echo $PATH [代码] 输出 [图片] 配置成功了。皆大欢喜，如果报错了，接着往下看～ 常见错误 [图片] 当我source 文件的时候报错了。百思不解，从新检查配置，依旧不行。 鬼才的我脑子抽抽，想着创建个软链接，跟终端启动sublime一样的嘛～，报错还是不行🙅‍♂️。 解决办法 午饭后，我又看了一下报错信息。 [图片] 嗯～，[代码]zsh[代码]。。Mac升级到卡特琳娜后打开终端（bash）会提示可以切换到另一个shell（zsh）。。。忘了这茬了 在 stackoverflow 上也相关的问题： I have updated my shell to ZSH . When i source ~/.bashrc . I am getting this error 在 zsh 上执行了 [代码]source ~/.bashrc[代码] 怪不得会报错。 现在我们只需要将配置写入 [代码]~/.zshrc[代码] 执行 [代码]source ~/.zshrc[代码]. [代码]export PATH="/usr/local/sbin:$PATH" export PATH="/usr/local/sbin:$PATH" export PATH="/usr/local/opt/curl-openssl/bin:$PATH" export PATH="/usr/local/opt/openldap/bin:$PATH" export PATH="/usr/local/opt/openldap/sbin:$PATH" export PATH="/usr/local/opt/apr-util/bin:$PATH" export PATH="/usr/local/opt/apr/bin:$PATH" export PATH="/Applications/wechatwebdevtools.app/Contents/MacOS/:$PATH" [代码] 完成 [图片] [图片] 完结 使用 在撸后台的时候，又来要测试码 [图片] 嗯～在熟悉一下cli，应该就会更加愉快了。

现在微信给了2种： 1.用微信官方给的live-player-plugin插件配合公众号后台进行直播 2.用组件里面的live-play和live-pusher自己写个直播 这2种哪个好呢？我看了一下第一种只能公众平台创建直播，而且推流走的腾讯服务器，不可以客户端自己创建直播 第2种，可以自己搭建RTMP服务器，推流走自己服务器，但是弹幕什么都要自己写 我想问一下这2种哪个比较好，或者说客户端如何自己创建直播，像抖音那样，有什么好的方案呢

1.在后台创建直播间后，扫分享中的直播间分享码显示页面不存在： [图片] [图片]扫这里的码，显示页面不存在是为什么呢？这里的码是怎么来的呢，取自哪里的链接呢？还有个问题就是，这个直播间可以创建多少个，允许几个直播间同时直播呢？

我记得之前有官方帖子还是文档提到过，我找不到了。所以确定一下

首先很开心，我司小程序获得第一波直播权限，我已经开发加好了直播，请确认你的小程序有直播资质，如果你有在开发中碰到什么问题，欢迎留言 一、引入直播插件 打开 app.json 文件 如果你代码有区分 分包 请记得将以下代码 放到 root 根文件夹 如果没有请忽略 以下代码 放到 "pages": ["pages/index/index"], 的同级地方 plugins": {         "live-player-plugin": {           "version": "1.0.2",             "provider":"wx2b03c6e691cd7370"       } }, 其中 live-player-plugin 是插件名字 version 是版本号码 二、引入直播开播 订阅组件（如果你不想引入，可以跳过） 在你要引入的页面 json 中添加组件  "usingComponents": { "subscribe": "plugin-private://wx2b03c6e691cd7370/components/subscribe/subscribe"  } 注意不用改动 页面引入 room-id 属性一定要添加 就是后台会返回给你的 live_status 是用来判断状态 因为有时候我们都添加上订阅按钮 点了后会消失 是因为这个状态已经是过去的直播了 无法订阅 ps:这个插件目前有个 bug 就是 不管我有么有订阅这场 都是未订阅状态 但是点击去直播间的订阅按钮却是状态对的 并且我切换下 小程序 前后台（onShow onHide 切换）状态又是对的 三、页面跳转 你可以在图片上添加函数 也可以直接 navigator 跳转 goDetail(e) {    var room = e.currentTarget.dataset.room;    wx.reLaunch({         url: '/plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + room,    }) } 或者 直接 navigator 跳转 四、页面分享 以下是我的页面分享 假设你的是卡片展示 或者图片展示   /**      * 用户点击右上角分享      */     onShareAppMessage: function (res) {                 var idx = res.target.dataset.idx;         const listInfo = this.data.listInfo[idx];         return {             title: listInfo.name,             imageUrl: listInfo.anchor_img,             path: '/plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + listInfo.roomid         }  }, 五、订阅插件样式更改 /* 订阅 */ .subscribe--live-player-subscribe__btn{   width: 200rpx !important;   height: 21px !important;   line-height: 21px !important;   font-weight: 200;   font-size: 20rpx !important;   text-align: center;   background: #fff!important;   color: #2d79ab!important;   border-radius: 4px;   pointer-events: auto;   margin: 0 auto; } 写在最后-------------------------注意，开发工具目前是无法进入直播页面的，但是真机可以，你们可以上传到体验版然后通过微信后台开个直播，扫码体验就能进入直播间。 以上就是我的分享，谢谢大家观看~~，如果你觉得有用，点个赞吧

可以通过此脑图大概了解小程序直播插件发展过程：http://naotu.baidu.com/file/597625fbd8659aa87e54143df1ed7f39?token=5bad276062c05585 [图片] 小程序直播组件是微信给开发者提供的实时视频直播工具，可以帮助开发者快速通过小程序向用户提供优质的直播内容，在小程序内流畅完成购买交易闭环，提升转化率； 小程序直播组件包括观众端、主播端及后台管理端，其中观众端提供拉流、实时互动、订阅提醒、商品购买等能力，主播端提供开播、推流、音视频效果优化等能力，后台管理端则负责直播房间、商品货架以及营销活动配置等。 【开通条件】 https://mp.weixin.qq.com/s/oqNdNEnRblEzwR_61d3vHA 满足以下条件的电商平台、自营商家，即有机会被邀请到小程序直播公测中来： （同时满足以下1、2、3条件，加上4、5、6条件的其中之一即可。） 1. 满足小程序18个开放类目（包括：电商平台、商家自营-百货、食品、初级食用农产品、酒/盐、图书报刊/音像/影视/游戏/动漫、汽车/其他交通工具的配件、服装/鞋/箱包、玩具/母婴用品(不含食品)、家电/数码/手机、美妆/洗护、珠宝/饰品/眼镜/钟表、运动/户外/乐器、鲜花/园艺/工艺品、家居/家饰/家纺、汽车内饰/外饰、办公/文具、机械/电子器件） 2. 主体下小程序近半年没有严重违规 3. 小程序近90天存在支付行为 4. 主体下公众号累计粉丝数大于100 5. 主体下小程序连续7日日活跃用户数大于100 6. 主体在微信生态内近一年广告投放实际消耗金额大于1w 【第三方平台（小程序服务商）】 https://developers.weixin.qq.com/community/develop/doc/000a06014745f00d95f9e03d951401?from=groupmessage&isappinstalled=0 服务商接入指引 具体接入指引请参考《【小程序直播】服务商接入指引》，以下为服务商接入步骤。 1. 权限申请 1） 在问卷《服务商“小程序直播”接入申请》填写相关信息并等待权限开通，发送申请后7个工作日内，可登陆微信开放平台查看第三方平台权限集并勾选 “小程序直播” 能力； 2） 开通后，即可登陆 “微信开放平台” （open.weixin.qq.com）勾选 “小程序直播” 第三方权限集并全网发布； 2.功能开发 小程序直播需要实现【直播组件】与【后台API】两个部分，其中组件部分需要在小程序中进行配置开发。 具体开发文档，请参考《小程序直播组件接入指引》。 【看点直播与小程序直播区别】 看点直播是不是腾讯官方？有什么区别？ 小程序直播是腾讯WXG（也就是微信团队）公测推出的能力，为商家提供的经营工具，可在商家自有的小程序中实现直播互动与商品销售闭环。优点是可以直接内嵌到商家小程序，和公众号打通；直播吸引的流量都沉淀在商家自有小程序，不用跳转其他渠道，有利于形成私域流量，转化率高。 腾讯看点直播是腾讯PCG（平台与内容事业群，做QQ、腾讯视频的事业群）推出的直播产品，有App、小程序端、小程序端是基于微信小程序的开发能力开发的，商家必须通服务商才能接入，无法直接在商家自有的小程序内闭环交易。（需要直播服务商提交资料开通，服务费用599半年。） 【2020-05-22更新】 近期已上线新功能：评论管理，支持对单个用户进行禁言，与敏感词设置。 未全面开放新功能：直播间可以直接发放微信代金券，目前内测中，敬请期待！ [图片] 【2020-06-02更新】 小程序后台直播功能接口支持进一步提升，可以通过接口添加直播间与商品管理，在没有涉及抽奖情况下及推送商品功能情况下，已经可以完整脱离小程序后台完成直播相关设置，对于一些服务商来说是一个不错的消息，按这个进度，下一步官方应该优先支持推送商品及抽奖活动设置配置接口的开放。 创建直播间文档：https://developers.weixin.qq.com/miniprogram/dev/framework/liveplayer/live-player-plugin.html 拉到三/9 商品接口文档：https://developers.weixin.qq.com/miniprogram/dev/framework/liveplayer/commodity-api.html [图片] 【2020-06-09更新】 直播间优惠券功能已经全面开放，很多玩法将会产生。 直播间领取的券可直接插入微信卡包（代表着可以提醒一次）。 如何配置：http://note.youdao.com/noteshare?id=afbff99580c4540cc011e3ed7ab5fbcf&sub=CDE480AAEC07437CB58902E0FF42C329 [图片][图片]

xquery基于原生小程序，是一套类似于jquery的小程序开发工具库，方便引用且无破坏小程序原生模式。 支持组件元素选取 方便的结构嵌套 弱模板化，方便维护 事件方法重新封装，支持query传递参数 支持钩子方法 支持LRU缓存 支持MARKDOWN富文本 支持HTML富文本 [图片] 无侵入的Pager 使用Pager方法替换小程序Page，其他用法一致。无侵入性语法 [代码]const Pager = require('components/aotoo/core/index') Pager({ data: { itemElement: {...} }, onReady(){ ... } }) [代码] 完整的目录结构 [图片] 实例抓取 类似于在web开发中可以使用[代码]getElementsById[代码]抓取html dom元素对象，下列针对item组件对象实现 wxml模板 [代码]<ui-item item="{{itemElement}}" /> [代码] js [代码]const Pager = require('components/aotoo/core/index') Pager({ data: { itemElement: { $$id: 'item-id', title: '这是一个item组件' } }, onReady(){ let $item = this.getElementsById('item-id') $item.addClass('active') } }) [代码] onReay类似于web中的body.onLoad，所有dom元素都已经准备妥当，使用[代码]getElementsById[代码]去抓取实例 事件封装 query传递参数更贴近web前端开发（事件封装是基于Pager及xquery定义的组件才有效，不会影响原生开发） wxml模板 [代码]<ui-item item="{{itemElement}}" /> [代码] js [代码]Pager({ data: { itemElement: { title: '按钮', tap: 'onTap?username=张三' // 允许query参数 // tap => bind:tap的别名 // aim => catch:tap的别名 // longpress => bind:longpress的别名 // longtap => bind:longtap的别名 // touchstart => bind:touchstart 别名 // touchmove => bind:touchmove的别名 // touchend => bind:touchend的别名 // touchcancel => bind:touchcancel的别名 // catchlongpress => catch:longpress的别名 // ...其他catch方法以此类推 } }, onTap(e, param, inst){ // e => 原生event事件对象 // param => {username: '张三'} // inst => <ui-item />组件实例对象，支持update, addClass, removeClass等方法 inst.update({ title: param.username+'的按钮' }, function(){ let $data = inst.getData() console.log($data.title) // 张三的按钮 }) } }) [代码] 数据缓存及数据过期 [代码]const Pager = require('components/aotoo/core/index') const lib = Pager.lib const dataEntity = lib.hooks('DATA-ENTITY', true) // true表示缓存数据到storage onReay(){ // 将用户信息缓存一天 dataEntity.setItem('names', {name: '', sex: ''}, 24*60*60*1000) setTimeout(()=>{ let namesData = dataEntity.getItem('names') console.log(namesData) // {name: '', sex: ''} },3000) } [代码] LRU缓存设置 小程序本地缓存10M，内存128M，因此数据缓存到本地受到很多限制，比如图片，需要使用LRU缓存机制来对图片/文件进行管理 [代码]const Pager = require('components/aotoo/core/index') const lib = Pager.lib const imgEntity = lib.hooks('IMG-ENTITY', { localstorage: true, // 开启本地缓存 expire: 24 * 60 * 60 * 1000, // 过期时间为1天，所有缓存的数据 max: 50 // 最大缓存数为50条，即当前hooks实例只会存储最常用的50条数据 }) onReay(){ // 将用户信息缓存一天 // img-src => 图片的具体地址或者一个唯一地址 // 挂载一个方法，当该钩子存储数据时 imgEntity.setItem('image-src', {img: 'cloude://....'}) saveImgToLocal('cloude://...') setTimeout(()=>{ let imgsData = imgEntity.getItem('image-src') console.log(imgsData) // {img} || undefined if (!imgsData) { imgEntity.setItem('image-src', {img: 'cloude://....'}) saveImgToLocal('cloude://...') } },3000) } [代码] markdown支持 有两种方式支持markdown文本 组件方式 嵌入方式 嵌入方式比较简单，下面示例markdown文本以嵌入方式实现 [代码]const Pager = require('components/aotoo/core/index') Pager({ data: { itemElement: { "@md": ` ## 马克党标题 基于xquery的基类开发的组件可以直接内嵌使用马克党文档 ` } }, onReady(){ ... } }) [代码] html支持 前端从后端拿去富文本数据，直接转化成小程序模板结构输出，下面示例html文本以嵌入方式实现 [代码]const Pager = require('components/aotoo/core/index') Pager({ data: { itemElement: { "@html": ` <div class="container"> <img src="http://..." /> <span>...</span> <br /> <section> ... ... </section> </div> ` } }, onReady(){ ... } }) [代码] github地址：https://github.com/webkixi/aotoo-xquery 小程序demo演示，下列小程序基于xquery的个人开发，公司的就不放了 xquery [图片] saui [图片] 嘟嘟倒计时 [图片]

场景介绍 在小程序开发过程中，难免会遇到一种情况，当A页面需要用户设置数据 点击进入B页面，在B页面设置成功后返回并将设置的值传递给A页面。但是wx.navigateBack()并不支持返回传参。这种情况下就可以使用onfire.js，onfire.js 是一个很简单的事件分发的 Javascript 库（仅仅 0.9kb），简洁实用。 下载地址 onfire.js下载地址 https://www.bootcdn.cn/onfire.js/ https://gitee.com/mirrors/onfire-js 如何使用 将onfire.js下载下来并放置在开发项目某个目录下，例如根目录lib文件夹内。 在使用页面对应的js文件中引入该文件。 代码如下： A页面 [代码]<!--index.wxml--> <view class="order"> <view class="order-alert">设置您的联系方式</view> <view class="order-mobile" bindtap="setMobile"> <view class="order-mobile__caption">联系方式</view> <view class="order-mobile__content"> <text class="valign-mid"> <text>{{ mobile }}</text> </text> <text class="iconfont order-mobile__content__more"></text> </view> </view> </view> [代码] [代码]//index.js const onfire = require('../../lib/onfire.js') Page({ data: { mobile: '' }, onLoad: function () { // 绑定事件，当名为EventPhoneChange的事件发生的时 onfire.on('EventPhoneChange', e => { this.setData({ mobile: e }) }) }, // 设置手机号 setMobile: function () { wx.navigateTo({ url: '../phone/phone?mobile=' + this.data.mobile, }) }, onUnload: function () { // 取消事件绑定 onfire.un("EventPhoneChange"); } }) [代码] B页面 [代码]<!--phone.wxml--> <view class="phone"> <input class="phone-input" placeholder="手机号码" bindinput="bindinput" value="{{mobile}}"></input> <button class="phone-setting" bindtap="tapSetting">设置</button> </view> [代码] [代码]// phone.js const onfire = require('../../lib/onfire.js') Page({ data: { mobile: '' }, onLoad: function (e) { this.setData({ mobile: e.mobile }) }, tapSetting: function () { let mobile = this.data.mobile; if (!mobile) { wx.showToast({ title: '请填写手机号！', icon: 'none', duration: 2000, }) return; } // 触发名为EventPhoneChange的事件，并且携带变量mobile值。 onfire.fire('EventPhoneChange', mobile) wx.navigateBack() }, bindinput: function (e) { this.setData({ mobile: e.detail.value.trim() }) } }) [代码] 其效果图如下： 图一 [图片] 图二 [图片] 图三 [图片] 相关API 关于onfire.js的API 1.on(event_name, callback) 绑定事件，参数为event_name和callback， 当有名字为event_name的事件发生的时候，callback方法将会被执行。这个方法会返回一个eventObj，这个可以用于使用un(eventObj)方法来取消事件绑定。 2.one(event_name, callback) 绑定（订阅）事件，参数为 event_name with callback. 当被触发一次之后失效。只能被触发一次，一次之后自动失效。 3.fire(event_name, data) 触发名字为event_name的事件，并且赋予变量data为callback方法的输入值。 4.un(eventObj / eventName / function)取消事件绑定。可以仅仅取消绑定一个事件回调方法，也可以直接取消全部的事件； 5.clear() 清空所有事件。 总结 个人对于onfire.js的理解就是一个全局通知，从B页面发出一个通知带上Key和Value，在其他某一个页面监听这个Key值来获取传出来的Value。 其他解决方案 该方案来自摩拜单车小程序 https://juejin.im/post/5da80767f265da5b5f7584dc

worker中如何发起服务器网络请求[图片]