关于小程序:小程序内嵌webview在部分iOS手机上的使用问题

先来形容一下需要咱们有一个小程序,外面用<web-view>嵌入一个H5页面,H5页面第一个页面是一个登陆页面,有存储和读取本地H5缓存localStorage,判断localStorage中token是否存在,如果存在,则间接进入下一个页面,不存在则留在本页,须要用户执行登陆操作 再来形容一下问题昨天在休假,共事忽然发消息来说,局部iOS机型无奈记住登陆状态,并且在第二次进入登录页面后,图形验证码无奈展现进去,点击按钮,会发送理论申请进来,然而UI款式没有任何变动 问题合成依据共事的反馈,下面的问题能够分类如下:(1)无奈记住登陆状态的问题,那就是token在第二次进入H5后获取不到(2)UI阻塞的问题 问题解决(1)查了材料,token获取不到,是因为局部机型在敞开小程序时主动清空webview的storage缓存所致。要解决的话须要将局部缓存放到小程序这边来。(2)UI阻塞的问题,先查看了下,H5中获取图形验证码的逻辑是在created生命周期中做的,因为小程序对H5页面做了缓存,created生命周期仿佛不会被执行?将created生命周期改为mounted之后,这个问题就解决了 问题延长H5公布版本之后,发现小程序这边仍然没有更新内容,思考到小程序将H5页面内容缓存了,就将小程序中<web-view>的src中链接的url改为加了工夫戳后缀的url,这样的话每次进入的时候url都不一样,就会从新获取h5资源。解决了之后,设置---通用--存储空间--清理缓存 革除一下缓存,问题果然解决了

June 3, 2021 · 1 min · jiezi

关于小程序:微信不再提供小程序打开App借助H5为App引流的方式你必须知道

2021年5月14日App开发者畛域公布了一条重要音讯:微信开放平台为了晋升用户体验,将于2021年5月20日(起初延期到2021年5月27日)起不再提供“小程序关上App技术服务”,这意味着当前通过场景值1036(从App分享卡片)关上的小程序,不能关上App了。这对于宽广App开发者来说是一个噩耗,以往能够通过从App分享小程序,小程序再唤起App的引流形式已被封禁。 App还有新的引流形式么?分享裂变是现有的App拉新促活老本最低、且成果最好的形式。微信的宏大用户流量始终是App经营人员想要利用的资源,经营人员须要找到其余形式实现App拉新促活。当初可能实现从微信关上App的形式只有H5页面唤起App了。这也是为什么最近很多App分享到微信都改成了H5,例如微博、B站等。 本篇文章就以微博针对微信新政策做出的扭转,介绍将来小程序、H5和App三者怎么联合能力实现拉新促活成果最大化。 第一、微博采取H5分享唤端的新变动 以前:App->小程序->App 以前从微博App分享微博内容给微信好友都是小程序的模式,关上微博小程序页面,点击【关上App】按钮,能够抉择唤起微博App指定页面,通过小程序给App导流: 当初:App->H5->App和App->H5->小程序 因为新政策小程序不能够再唤起App了,所以微博扭转了策略,从App分享微博内容到微信好友曾经变成了H5页面的模式。关上H5页面,能够看到底部有两个显著的按钮,一个是【微博内关上】,一个是【小程序内关上】 点击 【微博内关上】按钮,如果已装置微博,则可能间接唤起了微博App的指定页面: 点击 【小程序内关上】按钮,可能间接唤起微博小程序的指定页面: 因而咱们能够总结出,微博针对微信最新政策,从之前的App->小程序->App形式,当初拆分成了App->H5->App模式和App->H5->小程序模式。两条门路别离将用户引流到了App和小程序,为微博App和微博小程序导流,具体取决于用户抉择点击哪个按钮。接下来咱们具体讲述这两种形式所用技术和背地特点。第二、借助Deeplink,实现从H5疾速跳转到App H5页面唤起App所用的技术就是Deeplink技术,在挪动端,Deeplink可能实现从H5页面间接跳转到App指定页面的性能。例如您能够将App内的一个H5页面分享给微信好友,好友点击这个链接就能间接关上对应的App详情页,而不是App首页。如果好友未下载App则会跳转到App下载页面,装置启动后依然能跳转到App指定页面。这样能大大缩短用户应用门路,升高用户流失率。因而Deeplink性能被宽泛用在泛滥行业App拉新推广等场景, 因为Deeplink技术曾经演变了很多年,因而不同操作系统都有着不同版本的Deeplink技术,上面会介绍两种最罕用的Deeplink技术 1.URL Scheme办法 在iOS 9和安卓10(M)之前,挪动端实现Deeplink的形式都是通过URL Scheme。个别模式是这样的:Scheme://host:port/path?query=xxxxxxx。 Scheme:示意的是一个 URL 中最初始的地位,即 :// 之前的那段字符,咱们能够用Scheme来定位对应的App。例如淘宝的Scheme就是taobao、支付宝的Scheme就是alipay,新浪微博的Scheme是sinaweibo。 path:代表了想要跳转的指定页面 query:代表了想要传递的参数。 URL Scheme形式长处在于实现简略,但也有以下两个弊病: 弊病一:微信、微博、手百禁掉了大部分App的Scheme。 如果您的域名不在微信白名单内(白名单性能不对外开放,一般来说只有腾讯系的App能力在白名单内)。因Android端只有URL Scheme这一种形式,所以目前大部分App的Android端在微信内都不能间接通过H5页面唤起App。目前解决办法有两种:疏导用户通过右上角浏览器关上的模式,在浏览器内关上H5页面,可能间接唤起App。此形式长处在于浏览器对于URL Scheme没有限度,毛病在于减少了用户右上角浏览器关上的步骤 另外一种解决办法,就是接入腾讯利用宝,通过利用宝来唤起App或者跳转到App下载页面。此形式长处在于不须要用户从浏览器模式关上,即便不在微信白名单内也能够间接唤起App。 毛病在于此形式必须依赖腾讯利用宝,如果用户未装置利用宝,那么唤起形式会生效,微信会先疏导用户前去装置利用宝 弊病二:H5页面在尝试关上App时,浏览器会弹出一个提示框:“是否关上某某App”, URL Scheme关上App时,须要让用户点击确认一次,减少了用户应用流程 2.Universal link办法 Universal link 是苹果公司在2015年推出的新一代Deeplink办法,iOS9及以上的用户能够通过点击一个https链接无缝地跳转到一个App利用内的指定页面,如果用户没有装置这个App,则会跳转到App的下载页面。Universal link形式比URL Scheme形式体验更好,因为两头不须要用户点击确认关上App,也不须要用户在右上角跳转通过safari关上跳转。目前国内微信曾经反对Universal link模式的跳转,所以在iOS端采取Universal link的模式唤起App则更为间接不便。第三、通过H5唤起小程序 微博目前同样反对通过H5页面唤起小程序,H5页面唤起小程序的原理很简略:微信官网提供了H5 页面跳转微信小程序的能力。开发者须要判断所处环境来采纳具体种跳转小程序形式: 如在微信内网页环境下,则应用凋谢标签<wx-open-launch-weapp>跳转到小程序,通过该凋谢标签关上小程序的场景值为 1167 如在微信之外的环境,则应用 URL Scheme 跳转小程序,在微信治理后盾右上角“工具”—“生成URL Scheme”,填写小程序页面门路以及启动query参数,就能够生成小程序的URL Scheme了,通过 URL Scheme关上小程序的场景值为 1065。 具体实现形式能够参考微信开放平台的【H5跳转小程序】文档 ...

May 30, 2021 · 1 min · jiezi

关于小程序:小程序订阅消息的使用

订阅音讯简介订阅音讯是须要用户被动订阅 ,开发者才能够面向用户发送的音讯。 要害因素如下: 订阅音讯下发条件:用户自主订阅;订阅音讯推送地位:服务告诉;订阅音讯卡片跳转能力:点击查看详情可跳转至小程序的页面订阅音讯和模板音讯的区别模板音讯 当用户在小程序内实现特定的交互行为(领取或提交表单)来收集 formid,后续利用该 formid 能够在 7 天内任意工夫给该用户推送模板音讯。 发送模板音讯肯定要携带 formid推送的无效工夫为 7 天用户只能被动抉择接管,下发的权力把握在开发者手上订阅音讯 当用户在小程序内点击特定按钮后会弹出申请订阅弹窗,批准后小程序可在后续任意工夫给该用户推送服务告诉。较模板音讯,订阅音讯有如下几个特点: 01.选择权在用户手中 在小程序里,订阅音讯像是一个开关,须要用户被动点击受权之后,开发者能力向其推送服务告诉。 02.时长不受限制 订阅音讯没有7天内推送音讯的工夫限度,只有用户没有被动拒收音讯推送,就能够随时推送服务告诉。 03.安全系数更高 原来的模板音讯,用户被动接管,更容易被投诉、举报,封禁性能的危险零碎极高。而订阅音讯恰恰相反,订阅音讯由用户被动订阅,即用户违心接管由小程序发送的相干音讯,更合乎微信的绿规。 接入订阅音讯接入订阅音讯分三步: 1.抉择订阅音讯模板 进入微信小程序后盾,抉择/增加小程序服务类目,微信将主动依据类目调配音讯模板到你的公共模板库,你可在公共模板库中,抉择适合的模板(或者申请新模板,申请新模板须审核后才可应用)。 订阅音讯的模板与小程序所属类目间接挂钩,如果删除小程序类目,该类目对应的订阅音讯模板也将一并删除。 2.将订阅音讯的触发埋入用户交互流程中 申请发送订阅音讯,须要用户手动在小程序进行触发。将订阅音讯的触发设计到小程序的交互流程中,用户点击后,能力触发订阅申请弹窗。 详见小程序端音讯订阅接口 wx.requestSubscribeMessage 3.用户点击触发后,下发订阅音讯发送申请弹窗 用户勾选批准下发的模板,点击“容许”后,就能够用该模板进行推送。 详见服务端音讯发送接口 subscribeMessage.send 参考:https://developers.weixin.qq....

May 26, 2021 · 1 min · jiezi

关于小程序:微信开发者工具上传时提示Error-缺少文件-error-iconPathxxx-file-not-found

我看你是狗掀门帘,全靠嘴参考链接

May 26, 2021 · 1 min · jiezi

关于小程序:进入中国内地第31年的麦当劳为什么还能不断吸引新消费人群

简介:麦当劳的数字化转型从2016年开始全面推行,力求无论何时何地何种形式,消费者都能随心享受麦当劳的产品与服务,数字化转型在过来几年获得显著效果!而阿里云数据中台的引入,将成为麦当劳数字化转型在拓展面向新消费者人群场景中的重要一环!-更多对于数智化转型、数据中台内容请退出阿里云数据中台交换群—数智俱乐部 和关注官网微信公总号(文末扫描二维码或点此退出) -阿里云数据中台官网 https://dp.alibaba.com/index 邻近12点,办公室里的“干饭人”们曾经蠢蠢欲动。 食堂的菜品全靠大厨张姨当日情绪决定,本人又没有做饭带饭的习惯,所以外卖就成了小吴解决一日三餐的最优抉择,但明天礼拜一,她有另一条喂饱本人的路径。 关上手机,从支付宝进入“麦当劳”小程序,熟练地找到“麦当劳周一会员日”界面,支付优惠券兑换一对麦辣鸡翅,再单点一份“1+1随心配”套餐,结算只需12元。 小吴通常都会抉择“到店取餐”,即下单后服务员会在约5分钟内提前打包好对应商品,待从办公室步行到餐厅,即刻就能实现取餐。 麦当劳推出的这项服务益处在于,相较于到店点餐,消费者可能提前选定餐厅实现下单,节俭因排队点单、等待取餐的工夫老本;同时,和通过外卖平台下单相比,还能节俭9元规范配送费老本…… 然而,备受“小吴”们推崇的电子下单场景,只是近年麦当劳数字化转型带来的扭转之一。 三大定律影响人们的用餐抉择对大多数消费者来说,午餐的抉择维度大多逃离不开“价格、口味、间隔”三大条,而公司边上的这家麦当劳餐厅,则刚好落在这三大规范的交汇点。 在价格上,麦当劳除每周一设定“会员日”(可参加“嗨翻星期1”会员专享流动),还推出“500大卡”和“随心配1+1=¥12”等系列套餐,让消费者可能以更低的价格享受到更多样的商品。 为什么更偏爱麦当劳?小吴给出了绝大多数消费者的答复,“体感上,麦当劳汉堡除了鸡肉类外,还有鱼肉、牛肉等更多品类的抉择。”但其实,为了可能更为投合中国消费者的口味,麦当劳自1990年首次在中国边疆开设餐厅以来,就始终在“中国式新品”研发上做致力,比方别离在1998年、1999年、2005年、2020年上市的麦辣鸡腿堡、麦辣鸡翅、板烧鸡腿堡和麦麦脆汁鸡,目前都以爆款单品姿势俘获了相当体量的粉丝人群。 最初,间隔也是一般消费者纳入“影响用餐决策”的关键因素——如果是外出就餐,距离远就意味着破费在路上的工夫变得更多;如果是外卖配送,则意味着须要承当食物口感降落的危险。 好在,目前麦当劳在小吴所在的杭州市,曾经有超过100家餐厅,笼罩了绝大多数的办公区和商业区,不论是在办公室还是日常逛街,她总能及时享受到最陈腐热乎的麦当劳薯条。 麦当劳中国数字化业务副总裁文迪介绍,门店选址对餐饮行业来说至关重要,因为这关系着餐厅所能辐射影响到的外围客群。而另一方面,随着近年来外卖下单这一新模式的衰亡,本来受地区限度的线下餐厅服务边界被突破了,消费者能够绝对不受限制地随时随地实现下单动作。 比方小吴,就可能在办公室通过支付宝-麦当劳小程序或者麦当劳APP提前根据所在位置抉择最近的麦当劳餐厅实现点单,而后步行至餐厅实现取餐。 而在麦当劳餐厅内,食物会被密封装进袋子,搁置在专门的取餐地位,小吴能够在不与人接触的状况下,按照下单实现后显示的号码,找到对应餐袋,实现取餐并返回办公室。 这种“无接触”式取餐,在疫情期间,极大水平上保障了消费者的平安,并在业内造成模拟浪潮,现在更成为诸多“社交恐怖”消费者们的第一抉择。 而这一贯通挪动互联网与线下餐厅的生产全链路流程得以高效买通,其背地离不开麦当劳数字化建设的无力撑持。 据理解,麦当劳的数字化转型从2016年开始全面推行,其中包含官网数字化渠道建设、挪动领取引入,力求无论何时何地何种形式,消费者都能随心享受麦当劳的产品与服务。 数字化让线上订餐自主权交给消费者“数字化领取是麦当劳数字化转型的第一步。”文迪介绍,2015年随着挪动领取场景的大面积笼罩,麦当劳陆续接入支付宝等领取模式,这也代表着麦当劳正式迈入消费者全触点接触新阶段。 而2020年疫情的影响以及挪动终端技术的欠缺和倒退,在肯定水平上极大扭转了消费者的餐饮下单习惯,“当初,麦当劳大略有70%-80%的订单量来自于数字化渠道,”文迪走漏,“其中既包含餐厅内的触屏自助点餐机,饿了么等第三方平台,以及联合前两者劣势以小程序和麦当劳APP做承载的电子点单。” 而跨多端触点的订单能被麦当劳餐厅对立承受并妥善处理,很大水平上依赖于麦当劳早年就着手搭建的自建数据中台零碎。 文迪介绍,麦当劳在寰球范畴的零碎比拟多,专门面向中国市场定制开发的独立零碎、性能组件也十分多——为了可能最大限度保障消费者在不同麦当劳餐厅都能享受到同样的服务和体验,麦当劳很早就将各项利用依照“前台、中台、后盾”的不同定位进行划分。 “前台”次要负责应答业务场景中多变的触点;“中台”更像是逻辑层,以多套数据系统为撑持,做计算共享的性能,如卡券等,反对多渠道体验的对立和保障经营的高效;而“后盾”则是底座,积攒了全渠道原始数据。 现阶段,麦当劳的数据系统,既包含面向不同市场的偏好数据、不同渠道的订单数据/拜访数据、不同场景的流动数据(既包含线上线下流动,也包含不同线上渠道流动),也包含基于新老产品的下单频次数据等等,在麦当劳,这些数据都能被“数据中台”妥善整合,并使用到前端业务场景中。 比方,除了备受消费者推崇的经典当家产品,麦当劳每年还会推出应答不同口味偏好群体的全新产品,仅在2020年推出的新产品就超过100款——而这个新陈代谢的过程,就蕴含了大量对于“人”和“货”的数据分析。 再比方,麦当靠现在全面履行的全渠道点餐模式,把更多自主权交给了消费者自身——消费者能够自主抉择下单模式,同时即使在线高低单,麦当劳也可能给予消费者充沛的掌控感”:从抉择左近门店,到商品抉择再到下单,需等待时间;如果是配送服务的话,还能实时看到骑手的取餐、配送路线和间隔等多维度信息。 从消费者角度来说,麦当劳凋谢的这些数据,不再让其只能关注到本人“取餐”的后果,而是能让消费者更多地去知情“我进店之前还有多少人在期待取餐”“我进店当前还须要等多久”等过程细节,能最大限度地在生产整个过程中,晋升被服务感。 阿里云数据中台是数字化转型的重要一环麦当劳的数字化转型在过来几年获得显著效果,但麦当劳中国区精准营销项目经理彭碣却示意,“咱们只是适应了消费者的需要,而后跟进了对应动作。” 在彭碣的眼中,麦当劳的数字化转型,归根结底都是为了给消费者提供更为精密的服务,而由“消费者称心”反哺而来的系列衍生,都是“意外”惊喜。 去年12月,麦当劳联结支付宝推出“0元支付汉堡券”流动,引发线下门店和支付宝小程序流量同步暴涨,尤其是在江浙沪地区,当天交易笔数同比增长9.6倍。 作为全国消费水平绝对较高的地区,江浙沪始终是备受企业关注的消费市场,麦当劳也不例外。在这一区域新用户增长面临瓶颈之际,2020年,麦当劳牵手阿里云数据中台,以支付宝和菜鸟两款APP作为外围前端阵地,发展系列精准营销流动,以从新关上江浙沪线上流量突破口。 文迪通知记者,截至2021年第一季度,麦当劳在中国的会员数就超过了1亿7千万,这些会员通过不同的渠道端,比方APP、小程序等,对立以数据模式贮存在麦当劳CRM库中,“各端的整体经营逻辑,诸如积分兑换等,都是对立的,只是有些营销场景能够分为渠道独享和通用。” 而阿里云数据中台的引入,将成为麦当劳数字化转型在拓展面向新消费者人群场景中的重要一环。 借助阿里云数据中台在全域营销场景的能力,去年10月起,麦当劳锁定江浙地区20余家门店进行开启尝试,现在参加的门店数已累计至500家以上: Step01:麦当劳通过阿里云数据中台外围产品之一Quick Audience,上传江浙地区局部市场数据; Step02:通过Quick Audience辨认其中共性特色; Step03:链接支付宝,穿插匹配选定门店周边市场机会,辨认其中高潜局部(同时排出既有市场份额); Step04:以支付宝领取页面等为载体,以既定门店为半径(半径范畴可抉择),面向特定市场进行营销流动推送。 目前,该计划通过4轮测试,在文迪看来,“现有的成果数据都不错。” “因为还处于尝试阶段,而且因为餐饮行业的特殊性,现阶段并不适宜用一个相对数值来掂量这个计划的价值,”文迪说道,“我感觉这次与阿里云数据中台的单干,更像是为咱们前期朝这方面的进一步动作,制订了一个规范,让咱们可能明确地晓得,当老本在这个范畴区间内,那就是一个可承受的数值。” 作为寰球最具价值的快餐品牌之一,麦当劳的数字化转型之路也在持续,从电子菜单到电子下单,再到数字领取和全域精准营销,麦当劳的每个服务环节都在耳濡目染地数据化。 “餐饮自身是一个绝对比拟扩散的行业,每一个品牌,都是各自畛域比拟独特的一个代表,它们也都会有本人独道的数字化门路,而咱们也心愿麦当劳走过的这一条,可能为其余餐饮企业带去一些启发。”文迪如是说道。 相干产品:Quick Audience 全域消费者经营平台 >> 数据中台是企业数智化的必经之路,阿里巴巴认为数据中台是集方法论、工具、组织于一体的,“快”、“准”、“全”、“统”、“通”的智能大数据体系。 目前正通过阿里云对外输入系列解决方案,包含通用数据中台解决方案、批发数据中台解决方案、金融数据中台解决方案、互联网数据中台解决方案、政务数据中台解决方案等细分场景。 其中阿里云数据中台产品矩阵是以Dataphin为基座,以Quick系列为业务场景化切入,包含: - Dataphin,一站式、智能化的数据构建及治理平台;- Quick BI,随时随地 智能决策;- Quick Audience,全方位洞察、全域营销、智能增长;- Quick A+, 跨多端全域利用体验剖析及洞察的一站式数据化经营平台;- Quick Stock, 智能货品经营平台;- Quick Decision,智能决策平台;官方站点: ...

May 25, 2021 · 1 min · jiezi

关于小程序:快成物流科技-x-mPaaS-小程序容器加持下的技术架构提质增效

简介:大前端团队如何选型技术?如何疾速上手?如何高效协同?让咱们看看快成科 导言从 2017 年开始,GMTC“挪动技术大会”就更名为“大前端技术大会”。倒退至今,混合开发、原生开发、前端开发等概念正在深度交融,组成“大前端”团队。大前端团队如何选型技术?如何疾速上手?如何高效协同?让咱们看看快成科技如何解决这一问题。 缘起两地三团队快成科技是网络货运畛域的领军科技企业,畛域排名市场前三,平台有 3w+ 大宗商品货主,将货单公布到平台,由 60w+ 的卡车司机接单承运,每年产生 120亿 的运费交易额。 以司机端为例,须要承载从发单抢单到从进出场治理,从在途门路监控到金融白条加油加气等一系列互相强关联、流程链条长的业务。这些工作由两地三个研发团队,独特分工协作实现。 在 7*24 小时不间断的客户服务和每月 2-3 次发版的高度迭代中,技术框架瓶颈逐步凸显,具体包含: • 在零碎框架方面,初始框架是原生 App+HTML5,传统 web 存在启动白屏和性能响应不晦涩,大大降低了用户体验;• 在发版周期方面,研发部门多,产品链条长,局部企业须要更多的共性定制化服务导致发版期待周期不统一,频繁的发包更新不仅升高了经营效率,也给客户带来了频繁更新的困扰;• 在体验一致性方面,原生开发依赖零碎框架,因为原生个性不同,而导致各厂商多渠道平台中差异化凸显,多平台性能、体验差异较大;• 在多部门合作方面,罕用开发语言、前端 JavaScript 框架等不尽相同,不能及时依据需要张弛和上线 DDL 来灵便调配技术人员合作开发。 在快成科技业务继续高速倒退的背景下,优良的技术架构是“提质增效”的保障,零碎重构势在必行。快成的小伙伴们开始寻找优良的架构,解决场景问题。 选型四维度快成小伙伴针对发现的问题,探讨出四个选型维度:• 框架成熟度:简略来说,就是这个新技术是否靠谱,百亿的业务压力,没有太多的试错空间;• 迁徙老本:如果想得到新技术带来的收益,须要咱们付出什么代价,例如新技术的学习老本、原来架构的革新老本等;• 社区气氛:次要是看跟进这个技术的人够不够多、文档资料是否丰盛、遇到问题是否失去帮忙等;• 考量根底上兼顾性能、跨平台和动态性。定好技术选型考量指标之后,团队对常见的跨平台计划诸如 React Native、Weex、Flutter 和小程序进行了一系列的调研以及 Demo 制作,横向比拟如下: 正在进入技术选型窘境的时候,快成物流科技偶尔接触到了源自支付宝技术框架的mPaaS,通过应用 mPaaS 小程序容器,整合 mPaaS 框架、离线包和复用 h5 插件,依靠于性能强劲的 web 渲染引擎,完满合乎了咱们对技术选型的冀望与要求。 入手试试看选定技术选型之后,在重构初期,针对我的项目工程建设以及划分上,咱们共事之间进行了一场强烈的头脑风暴,最终选定了在多部门合作前提下进行轻量组件化并行开发多个小程序并进行动静下发的计划。快成团队从协同、技术等多角度,进行框架的逐渐导入。如需理解残缺内容详情,欢送观看 CodeHub#5 全程回放 多团队协同 实在场景测试真机预览与调试问题,首先要设置好白名单,设置形式可参考文档,而后在原生端依据文档进行相应的配置和代码书写,最初须要留神的是 IDE 生成的二维码须要应用咱们 App 的扫码能力扫描(可接入 mPaaS 的扫码组件),用支付宝扫一扫是打不开的。 ScanService service = LauncherApplicationAgent.getInstance().getMicroApplicationContext() .findServiceByInterface(ScanService.class.getName());ScanRequest scanRequest = new ScanRequest();scanRequest.setScanType(ScanRequest.ScanType.QRCODE);service.scan(this, scanRequest, new ScanCallback() { @Override public void onScanResult(boolean success, Intent result) { if (result == null || !success) { showScanError(); return; } Uri uri = result.getData(); if (uri == null) { showScanError(); return; } // 启动预览或调试小程序,第二个参数为小程序启动参数 MPTinyHelper.getInstance().launchIdeQRCode(uri, new Bundle()); }});外围问题解决在同一小程序不同页面跳转传参的时候咱们遇到了大参数传递被截断的问题。通过剖析是小程序对路由跳转 API 进行了参数携带长度的限度,起初咱们抉择应用缓存 my.setStorage 来进行大批量参数的存取应用,这里须要留神的是同一小程序缓存下限为 10MB,在适合的中央应用 my.clearStorage 革除缓存尤为重要。 ...

May 24, 2021 · 1 min · jiezi

关于小程序:微信小程序写入数据库报错E11000-duplicate-key-error-collection

微信小程序对数据库进行set或update操作时,会报谬误: Error: errCode: -502001 database request fail | errMsg: [FailedOperation.Insert] multiple write errors: [{write errors: [{E11000 duplicate key error collection: tnt-12p3936xo.x-j-l index: id dup key:通常咱们在开放平台调用云函数来进行数据库写入后,在微信小程序里进行更新,就会报这个谬误,因为:你批改的这条数据不是你创立的。 解决办法:1、将平安规定批改为: 2、小程序也调用云函数进行批改。

May 22, 2021 · 1 min · jiezi

关于小程序:友盟小程序用户增长白皮书如何培养企业的私域流量

友盟+近日公布了《小程序用户增长白皮书》,白皮书总结了友盟+在小程序统计分析和精细化经营方面的方法论、解决方案和胜利案例,以下为白皮书的局部内容: 绝对于微信、QQ、电商平台的公域流量,私域流量就是本人客户的品牌数据,是一个能够做到自由化、数字化治理的平台,并且是数字用户精细化经营的品牌场。那么对企业来说,该如何造就本人的私域流量? 私域流量的 7 种玩法 目前私域流量里的经营组合玩法分为两个类型,以企业微信为切入点和以小程序为切入点,共计七种玩法。 第一类,以企业微信为切入点,包含: 企业微信+不同人设组合, 企业微信转化+广告引流, 企业微信+直播+小程序+广告引流; 第二类,以小程序为切入点的根底经营四件套,包含: 小程序+直播+社群+私域, 直播+社群/微商城/小程序, 小程序+直播+公众”, 社群经营+私域流量。 通过不同的组合办法,在公域和私域积淀用户,再通过这些组合玩法去做更加精细化的用户经营和转化。 小程序私域“新元年”4大趋势 在后疫情时代,企业如何把握“小程序+私域流量”的新玩法和趋势?上面有四个趋势判断,而且每种趋势都有较成熟的案例做撑持,对于 2021 年做好小程序经营十分重要。 趋势判断一:多平台布局 除微信以外,支付宝、百度、头条系等超级 App 平台都开始通过小程序开释本人的流量,企业须要判断和思考适宜本人的平台,以及如何利用平台蓄积流量。 例如,科大讯飞在微信、支付宝和头条三个平台里,依据不同平台的用户应用场景和属性布局了绝对类型的小程序。 科大讯飞联合微信社交去中心化的属性,推出了适宜祝愿场景的个性化语音祝愿性能,并联合社交场景做裂变。联合支付宝的生存金融属性,推出适宜信用受权场景的讯飞设施租赁业务。联合头条的资讯和工具利用属性,推出了适宜Free-hand场景的语音转文字服务,帮忙用户从视听两方面接管信息。 另一个案例:粒上皇小程序在支付宝侧是如何获取私域流量红利的。 首先,支付宝有很强的领取属性,粒上皇用户在其余场景应用支付宝领取时,如在周边3公里内有粒上皇的线下店,就有机会在领取胜利页面支付到粒上皇的优惠券,用户能够用来到左近门店或者线上生产抵扣。再联合蚂蚁会员体系,就能更好的拉动用户在线上和线下的生产复购。 同时,小程序能够通过店内二维码无效地将线下和线上的用户归一。比方,在粒上皇门店中激励用户扫描二维码支付优惠劵,就能将线下用户和线上小程序做关联,既能够将线下用户在小程序端实现用户积淀,还能察看用户的生产行为习惯。 有数据显示,粒上皇在支付宝内通过小程序在一周内就实现2万多用户的冷启动,并借此取得了百万级曝光,线上复购率也晋升了多个百分点。 趋势判断二:利用数据做好精细化经营 从倒退速度来看,小程序曾经从跑马圈地、横蛮成长的阶段,到了须要思考如何利用数据做好私域流量精细化经营的阶段了。 当实现用户积淀动作当前,要察看和治理小程序用户的生命周期。通常小程序用户的生命周期分为四个阶段: 1.全方位理解获客起源。小程序人造的去中心化属性,使得开发者须要360度理解用户起源散布,察看用户起源的次要路径,以便从源头抓住用户的特点。 2.多维度把握用户的应用状况。帮忙开发者在裂变过程中找到用户体验门路和要害业务门路,从而做好小程序的精细化经营。 3.实时查看分享回流成果。辅助开发者理解信息流传门路、笼罩人群属性,以及KOL和KOC的数量和散布特点,定向钻研他们的画像能够帮忙开发者疾速找到潜在用户群体在哪里。 4.通过自定义事件和转化漏斗找到经营的须要优化改良的外围指标。 趋势判断三:做好小程序矩阵 简略来说,就是在单个平台建设多个小程序,去触达不同场景下的公域和私域流量。 首先,小程序自身并不是独立中心化的体验入口,而是有需要的用户通过搜寻、分享等从内部带来的去中心化的流量。商家能够联合业务特点和App性能将小程序打散,做成多个体验更好的独立小程序,搭建起残缺的用户应用体验门路。 参考案例:携程小程序矩阵 其次,将小程序在不同场景下拆分成多个性能点,能够扩充商家经营的用户范畴。在不同平台构建品牌小程序、品牌流量池和品牌流量矩阵,再联合整体数据精细化经营,将这部分用户齐全积淀下来。 最初,通过数据洞察不同平台用户的行为形式,反过来针对各平台用户的属性特色制订有针对性的经营打法。 例如,威马汽车,他们将用户体验门路分拆为多个小程序,从整个品牌的投放、预约试驾、售后购买,售后应用等应用多个小程序组成矩阵,从多个场景进行引流。 并从用户体验门路中察看用户在不同阶段的需要点和转化的成果,从而建设了威马汽车自有的品牌流量池,还造就了用户定期应用小程序的习惯。 趋势判断四:跨端经营 跨端的状况下,不同企业有不同的需要,大抵分为几种: 如何晓得现有用户跟之前的用户是否有重叠? 重叠状况下用户行为是否有新变动和产生新的需要? 如何经营好重叠或者非重叠局部的用户? 首先,获取用户三个简略的起源点: App端用户的积淀; 不同小程序端会有用户积淀; 微信、支付宝中的内容号也有较强的粉丝积淀能力。 而后,能够通过一些形式将不同端的用户进行关联。 比方,App端能够通过微信、QQ或者支付宝的受权登录端口实现登录当前,小程序数据就能够与App用户产生数据关联。这样小程序用户的用户行为习惯就能够跟App用户的行为标签进行关联。同时,从 App 端分享的内容以小程序的模式发到各类社交平台上,又反向关联了其余平台小程序用户的行为数据。 当然,这些数据关联须要建设在“数据银行”之上,将设施信息、用户ID信息、挪动端的行为信息、生产等级信息、会员等级信息在企业端做好积淀,能力真正做到以企业的角度去察看用户跨端之后的行为特色,以及以后用户的具体状态,从而领导企业用更多元的经营伎俩去晋升触达用户的效率。 另外,小程序可能无奈像传统电商App一样在小程序中造成残缺的电商成交链路,但依然能够通过数据关联洞察用户行为习惯。 例如,小程序通过私域内容种草察看某个用户的趣味标签,当用户登录App时察看其沉闷时间段,通过数据银行就能够将这两局部的客群标签进行关联,而后联合用户触达工具抉择适合的信息、适合的场景去触达用户,这种经营形式能够让单品在同时间段内减少近三成的转化量。 ...

May 20, 2021 · 1 min · jiezi

关于小程序:友盟小程序用户增长白皮书线下或是小程序重要的增长点

友盟+近日公布了《小程序用户增长白皮书》,白皮书总结了友盟+在小程序统计分析和精细化经营方面的方法论、解决方案和胜利案例,以下为白皮书的局部内容: 挪动互联网曾经进入存量市场,挪动设施数、用户数、用户时长都处于存量市场竞争。2020年新利用上线做到腰部以上活跃度的难度曾经十分大,用户整体呈降落态势。 挪动互联网环境与用户行为的扭转 从2020年年初开始始终到12月,从监测到的App数据看,新增用户数没有太大变动,只是在年底有些增长。但对于已创立的这些利用,想获取流量,从整体数据体现来看,曾经越来越难了。特地是9月、10月、11月,尽管疫情有所缓解;然而整体上App用户流量能做到DAU 在10万以上的,基本上成功率不到1%。 从整体数据来看,整个大盘流量,全年都是被新的玩法所获取。这不仅是环境变动导致的,还包含用户的行为变动,包含直播、私域流量、小程序,这些工具和平台导致用户应用习惯产生变动。各行业通过“直播+私域流量+小程序”等新工具入局,开始建设本人的私域流量并经营。 同时,从整体大盘数据来看,小程序从呈现到当初的五年工夫,不仅是生存服务,它整个触达的行业范畴十分广,行业散布有300多个,远比App触达的行业多。目前小程序最大的两个平台,次要是微信和支付宝。 疫情期间小程序呈井喷式增长 2020年上半年,因为受到疫情影响,很多企业开始自救,发展私域流量经营。而私域流量经营最好的流量抓取点,就是小程序。很多行业通过“小程序+私域流量”的玩法,将线下业务纷纷转移到了线上,包含:线上卖房、线上书店、新批发、云健身等。 从小程序在疫情期间的整体数据来看,小程序的沉闷设施、沉闷用户数以及小程序的开发者数量都在短时间内实现了爆发性增长。从2019年12月到2020年2月份,小程序日活增长了37%,小程序数量也比2019年底数据增长了19%。 从整体数据来看,本地生存服务行业是 2020 年小程序做得最多的一个品类,也是私域流量暴发风口。各个平台提供的服务,不论是社区经营工具、直播工具还是小程序工具,都开始在这方面踊跃转变。 举两个具体的案例: 例一:家乐福 家乐福通过“小程序+私域”的玩法,打造出了家乐福社区生存服务中心,基于小程序的定位性能,利用门店送货上门的形式接触用户,盘活了线上线下的更多客户人群。该小程序上线一周环比增长356%。 例二:眉州东坡 眉州东坡菜站小程序,将门店变为“前置仓”,售卖预包装平价蔬菜。通过服务号推送、外部员工转发、朋友圈广告、线下门店便民蔬菜站、社群微信群等多个路径进行推广。 通过“小程序展现半成品蔬菜+服务号散发”的私域玩法,推出眉州东坡餐饮线下门店与线上互动的新销售模式。之前囤积的蔬菜岂但没有节约,还为商家带来了新增支出,每天销售陈腐蔬菜超10万元。 小程序为什么能成为2020年重要的暴发节点? 为什么小程序能成为 2020 年重要的暴发节点?首先得从小程序的几个特点说起,次要有四个:场景碎片化、平台赋能、私域用户以及连接线下。 场景碎片化。对于低频场景、利基市场的碎片化需要,使得小程序能够代替App,成为接触新用户的前置场景,升高用户应用产品的老本和企业获客老本。 平台赋能。通过多个平台凋谢本身用户与生态,在场景下提供经营工具,帮忙实现客户的获取、留存与变现。 私域用户。基于人际关系、人地关系,加上平台的品牌效应、信用背书和流量规模,使企业获客老本变低,积淀属于本人的品牌私域用户。 连接线下。在线下店铺、交通、休闲娱乐、甚至将来与智能硬件等新型场景联合,将线下触点数字化。 在下面4大特点的根底上,2020年除了微信做到小程序最大场以外,还有很多大平台,包含支付宝、字节跳动、百度等都开始逐步凋谢本人的流量池,加强小程序能力。 所有私域流量的场,都是为了帮忙企业搭建本人平台整个边界和扩张的边界。所以,对企业来说,应该更好地、更疾速地进入这个所谓的公域流量场,这样就能够利用不同平台去获取以后场里最好的流量和客户资源。 在守业层面,小程序开发者也面临一系列的挑战。开发者须要多平台建设,开发、部署、经营老本高。在倒退层面,须要业余数据/经营根底,如企业数据化、数据报表剖析、线上用户获取、生命周期治理、用户洞察剖析、私域用户归一等。 小程序从业者面临的机会与挑战并存! 以上内容节选自《小程序用户增长白皮书》,白皮书总结了友盟+在小程序统计分析和精细化经营方面的方法论、解决方案和胜利案例,还包含很多企业的实在实际解读,获取完整版,请到友盟+官网下载。

May 20, 2021 · 1 min · jiezi

关于小程序:微信小程序获取账号信息及区分开发环境生产环境开发版体验版正式版

1.凋谢接口介绍:wx.getAccountInfoSync()获取以后帐号信息。线上小程序版本号仅反对在正式版小程序中获取,开发版和体验版中无奈获取。小程序官网API链接在之前官网没有提供判断办法,上线之前要手动批改申请的URL,当初能够依据wx.getAccountInfoSync()的返回值判断运行环境,主动配置REQUEST_URL,办法在最初。毛病是:要设置根底库版本。这里留神一下根底库版本,如果用户微信版本更新不及时可能会报错,倡议设置最低根底库。 2.返回值[Object](1)帐号信息属性类型阐明miniProgramObject小程序帐号信息pluginObject插件帐号信息(仅在插件中调用时蕴含这一项)(2)miniProgram 的构造属性类型阐明最低版本appIdstring小程序 appId envVersionstring小程序版本2.10.0versionstring线上小程序版本号2.10.2(3)plugin 的构造属性类型阐明appIdstring插件 appIdversionstring插件版本号(4)miniProgram.envVersion 的非法值值类型最低版本develop开发版 trial体验版 release正式版 3.示例代码const accountInfo = wx.getAccountInfoSync();console.log(accountInfo.miniProgram.appId) // 小程序 appIdconsole.log(accountInfo.plugin.appId) // 插件 appIdconsole.log(accountInfo.plugin.version) // 插件版本号, 'x.x.x' 这样的模式console.log(accountInfo.miniProgram.envVersion); // 以后环境,develop(开发版)

May 14, 2021 · 1 min · jiezi

关于小程序:今日直播致前端不要再打了gif

简介:CodeHub#5 | 快成物流科技:基于容器实现挪动端动态化架构降级 “前端窘境”不论是中大型组织,还是小型初创公司,随同业务幅员的逐渐拓张,大家都对于业务价值的晋升,关注点都会逐步向开发效率歪斜。 开发人员队伍日益扩张,但工作量却没有像分蛋糕一样被合成——这是在少数的技术团队里,往往会呈现的一个常态化窘境。 开发人员扩散在各个部门里,导致了他们不能以最高效的形式工作,具体表现在以下几个方面: 研发部门多,发版期待周期不统一;原生开发依赖零碎框架,因为原生个性不同而导致平台差异化;开发语言不对立,不能依据工作轻重即时调配相应人手合作开发。针对上述的问题。本期 CodeHub 为大家邀请了来自「快成物流科技」的 Android 前端工程师王斐,与大家一起分享快成物流科技基于 mPaaS 小程序容器,如何实现多部门合作、轻量化组件形式并行开发多个小程序、动静更新下发等一系列业务诉求。 基于容器实现挪动端动态化架构降级【mPaaS Coder】「快成物流科技」前端工程师 王斐 【开播工夫】2021/5/12 早晨 7 点 【直播地址】https://live.bilibili.com/22746567 登陆B站关注“mPaaS”,即可预约本期直播,获取开播揭示。 Be a Swag Coder点击填写本期直播互动问卷,即有机会 mPaaS 初夏限定 T 恤一件 or 天猫精灵方糖二代一只,数量无限,先到先得。 对于 CodeHubCodeHub 是以线上直播的模式输入前沿的挪动端开发实际。用分享、交换的模式触达更多开发者,从而让乏味、深度的思考可能双向互动起来。 上期 CodeHub 回顾:https://yqh.aliyun.com/live/detail/22447 钉钉搜寻“32930171”退出「mPaaS 技术交换群」参加更多探讨。 版权申明:本文内容由阿里云实名注册用户自发奉献,版权归原作者所有,阿里云开发者社区不领有其著作权,亦不承当相应法律责任。具体规定请查看《阿里云开发者社区用户服务协定》和《阿里云开发者社区知识产权爱护指引》。如果您发现本社区中有涉嫌剽窃的内容,填写侵权投诉表单进行举报,一经查实,本社区将立即删除涉嫌侵权内容。

May 12, 2021 · 1 min · jiezi

关于小程序:技术干货-轻松两步完成向-mPaaS-小程序传递启动参数

简介: 以传递 name 和 pwd 参数为例,别离介绍此场景在 Android 小程序和 iOS 小程序中的实现过程。 前言在局部场景下,须要向小程序的默认接管页(pages/index/index)传递参数。 本文将以传递 name 和 pwd 参数为例,别离介绍此场景在 Android 小程序和 iOS 小程序中的实现过程。 前提条件已参照 疾速开始 文档接入了小程序组件。 Android 小程序1.在客户端增加启动时跳转页面的参数信息。如下所示: Bundle param = new Bundle();String query = "name="+Uri.encode("123")+"&pwd="+Uri.encode("456");param.putString("query",query); //设置参数MPNebula.startApp(appId:"2020121620201216",param);URL 启动传参时,传递参数的字段为 query;获取参数时,通过解析 query 字段获取。startApp 参数阐明: appId:小程序的 ID,能够从 mPaaS 控制台查看。param:Bundle 对象,能够向 Bundle 对象传递申请参数,key="query",value="键值对";多个参数两头用(&)隔开。留神1:小程序框架会对每对自定义入参的键值对的 value 进行 uri decode。因而,请对入参键值对的 value 进行 uri encode。留神2:小程序框架不会对自定义入参的键值对的 key 做任何解决。因而,请不要对 key 设置特殊字符,避免小程序侧无奈辨认自定义参数。2.小程序获取参数。从 onLaunch/onShow(options) 办法的参数 options 中获取。 存储 app.js 会获取客户端向小程序传递的参数并保留到全局变量 globalData 中,应用时从 globalData 间接取值或更新值。如申请头里的 token、user_id 等参数,从 Native 传递过去后,保留到 globalData 中,应用时间接取值。 ...

May 8, 2021 · 1 min · jiezi

关于小程序:为-wxajs-构建的小程序移除-scss-依赖

wxa.js 默认应用的款式语言是 scss,所以其默认创立的我的项目就会要求装置 node-sass,但因为 node-sass 依赖了 binding.node 等包,导致经常会呈现 node-sass 装置失败的问题。 如果你并没有在我的项目中应用 scss ,则能够思考将你我的项目种的 node-sass 移除,从而放大我的项目的依赖体积,晋升我的项目装置胜利的概率。 思路因为 wxa 默认应用了 scss,因而,咱们须要移除我的项目中针对 scss 的配置,并移除代码中的 scss ,这样能力保障后续在编译的过程中,不会调用 node-sass 的依赖。 步骤移除 wxa.config.js 中对于 scss 的配置在 wxa 的默认配置中,配置了 sass/scss 的依赖,咱们如果不移除这个依赖,就会导致后续在构建的时候,主动装置相干依赖。 因而,咱们须要在 wxa.config.js 中增加 use 相干配置,且仅保留 babel 作为依赖,具体批改如下: module.exports = { plugins: [ new ReplacePlugin({ list: envlist, }), ], // 你的其余配置 use: [ { test: /\.js$/, name: 'babel', }, ], // 你的其余配置};移除我的项目中标记为 Scss 的语言在移除了 wxa.js 的构建依赖后,接下来须要移除代码中对于 scss 的标示,从而使咱们的代码能够被正确的渲染工具所渲染。具体批改如下所示,右侧为批改后的后果 ...

May 6, 2021 · 1 min · jiezi

关于小程序:wxajs-引入-tailwindcss

TailwindCSS 是我最近一段时间应用比拟多的 CSS 框架,相比于传统咱们习惯的前端框架,它的限度更少,你能够依据本人的须要来编写款式。如果你配置了革除没用到的 CSS,TailwindCSS 的体积甚至能够远小于其余框架。 也因为下面的这些因素,我也自然而然的会抉择将其放在小程序中来应用。而因为我应用的是 wxa.js ,所以这里也是一个对应的 wxa.js 的教程。 装置1. 装置 TailiwndCSS 到你的我的项目中 因为 Taildwind 默认举荐应用的是 PostCSS,但其须要的是 PostCSS 7 或者 8 ,但 WXA.js 提供的 PostCSS 插件应用的是 6 ,所以这里我就抉择不将其作为 PostCSS 插件来装置。 在 WXA 我的项目根目录中执行如下命令,会在你的我的项目根目录中生成一个 tailwindcss.config.js,它会作为后续你的我的项目配置的配置文件。 npx tailwindcss-cli@latest init随后,在你的我的项目根目录创立一个 tailwind.css 文件,并在其中退出如下代码,这个文件作为你后续款式根底文件。 @tailwind base;@tailwind components;@tailwind utilities;增加实现后,你就能够执行如下命令,来生成一个默认的 tailwindcss 款式文件。 npx tailwindcss-cli@latest build ./src/tailwind.css -o ./src/tailwind.css生成的成果如下,能够看到,未任何解决的状况下,整个 CSS 文件足足有 3.81 MB,不过不必放心,咱们能够革除其中的款式。 如果你心愿后续不输出这个命令,能够将其增加到你的我的项目的 package.json 中。2. 移除默认的浏览器主动增加的 prefix 因为不同浏览器在不同的款式上可能有所不同,tailwindcss 会在生成的时候帮忙咱们生成一些特定的前缀。但小程序不波及到浏览器的兼容性问题,所以咱们能够敞开 taildwindcss 的 autoprefixer。 将刚刚的生成命令中退出 --no-autoprefixer 的参数,就能够生成不含 prefix 的 CSS 文件 ...

May 6, 2021 · 1 min · jiezi

关于小程序:移动端兼容问题

textarea页面滚动,内容被穿透,层级太高padding在ios、安卓兼容问题new Date在ios中必须应用2020/10/10格局promise的finally在iOS中不反对

April 28, 2021 · 1 min · jiezi

关于小程序:小程序云开发-体验手机桌面版布局方案

小程序搜寻: 交圈尝试仿照手机桌面的布局形式来进行开发,便于管理更多的独立性能,对立用户治理欢送大家体验尝试,目前开发了局部性能,前面会逐渐的欠缺,提供更多实用的小性能下来交换沟通:(阐明来意)

April 22, 2021 · 1 min · jiezi

关于小程序:浅谈小程序

小程序的由来最后微信WebView逐步成为挪动web重要入口,微信公布了一整套网页开发工具包,称之为 JS-SDK,给所有的 Web 开发者关上了一扇全新的窗户,让所有开发者都能够应用到微信的原生能力,去实现一些之前做不到或者难以做到的事件。但JS-SDK 的模式并没有解决应用挪动网页遇到的体验不良的问题,比方受限于设施性能和网络速度,会呈现白屏的可能。因而又设计了一个增强版JS-SDK,也就是“微信 Web 资源离线存储”,但在简单的页面上仍然会呈现白屏的问题,起因体现在页面切换的僵硬和点击的通畅感。这个时候须要一个 JS-SDK 所解决不了的,使用户体验更好的一个零碎,小程序应运而生疾速的加载更弱小的能力原生的体验易用且平安的微信数据凋谢高效和简略的开发 与h5页面的区别运行环境:小程序基于浏览器内核重构的内置解析器,而 h5 的宿主环境是浏览器。所以小程序中没有 DOM 和 BOM 的相干 API,jQuery和一些 NPM 包都不能在小程序中应用,以及禁止页面跳转的一些相干api,因为这与小程序的初衷相违反,为了防止浏览器api更新一次就打一次补丁,小程序建设了本人的语法;零碎权限:小程序能取得更多的零碎权限,如网络通信状态、数据缓存能力等;渲染机制:小程序的逻辑层和渲染层是离开的,而 h5 页面 UI 渲染跟 JavaScript 的脚本执行都在一个单线程中,互斥。所以 h5 页面中长时间的脚本运行可能会导致页面失去响应。其实,小程序开发过程中咱们面对的是 iOS 和 Android 微信客户端和辅助开发的小程序开发者工具。依据官网文档,这三大运行环境也是有所区别的: 运行环境逻辑层逻辑层iOSJavaScriptCoreWKWebViewAndroid X5JSCoreX5浏览器小程序开发者工具NWJSChrome WebView所以微信小程序介于 web 端和原生 App 之间,可能丰盛调用性能接口,同时又跨平台。小程序架构双线程模型小程序的渲染层和逻辑层别离由2个线程治理:渲染层:界面渲染相干的工作全都在 WebView 线程里执行。一个小程序存在多个界面,所以渲染层存在多个 WebView线程。逻辑层:采纳 JsCore 线程运行JS脚本。WeixinJsBridage 起到架起下层开发与Native(零碎层)的桥梁,使得小程序可通过API应用原生的性能,且局部组件为原生组件实现,从而有良好体验。视图层和逻辑层通过零碎层的 WeixinJsBridage 进行通信:逻辑层把数据变动告诉到视图层,触发视图层页面更新,视图层把触发的事件告诉到逻辑层进行业务解决。(页面渲染的具体流程是:在渲染层,宿主环境会把 WXML 转化成对应的 JS 对象,在逻辑层产生数据变更的时候,咱们须要通过宿主环境提供的 setData 办法把数据从逻辑层传递到渲染层,再通过比照前后差别,把差别利用在原来的Dom树上,渲染出正确的UI界面)双线程模型是小程序框架与业界大多数前端 Web 框架不同之处。基于这个模型,能够更好地管控以及提供更平安的环境。毛病是带来了无处不在的异步问题(任何数据传递都是线程间的通信,也就是都会有肯定的延时),不过小程序在框架层面曾经封装好了异步带来的时序问题。 这样做还有一个目标是管控和平安:须要阻止开发者应用一些,例如浏览器的window对象,跳转页面、操作DOM、动静执行脚本的开放性接口。小程序的webview标签以跳转网页,但集体类型的小程序暂不反对应用。可关上关联的公众号的文章,其它网页需登录小程序管理后盾配置业务域名。 Service和View通信应用音讯publish和subscribe机制实现两个Webview之间的通信,实现形式就是对立封装一个WeixinJSBridge对象,而不同的环境封装的接口不一样,具体实现的技术如下:windows(开发环境)通过window.postMessage实现(应用chrome扩大的接口注入一个contentScript.js,它封装了postMessage办法,实现webview之间的通信,并且也它通过chrome.runtime.connect形式,也提供了间接操作chrome native原生办法的接口)发送音讯:window.postMessage(data, ‘*’);,// data里指定 webviewID接管音讯:window.addEventListener(‘message’, messageHandler); // 音讯解决并散发,同样反对调用nwjs的原生能力 拓展:[window.postMessage]:能够实现跨文本文档,多窗口,跨域消息传递,跨域通信解决方案.语法:otherWindow.postMessage(message, targetOrigin]);其中,otherWindow:窗口的一个援用,比方iframe的contentWindow属性,执行window.open返回的窗口对象,或者是命名过的或数值索引的window.frames.targetOrigin:通过窗口的origin属性来指定哪些窗口能接管到音讯事件,指定后只有对应origin下的窗口才能够接管到音讯,设置为通配符"*"示意能够发送到任何窗口。 IOS通过 WKWebview的window.webkit.messageHandlers.NAME.postMessage实现微信navite代码里实现了两个handler音讯处理器invokeHandler: 调用原生能力publishHandler: 音讯散发 ...

April 14, 2021 · 1 min · jiezi

关于小程序:微信小程序中使用canvas

1.应用canvas画布 2.应用矩阵截图 留神ios上会有截取不到的问题, 肯定要查看下根底库,context.drawImage()里边是能够传一个本地门路进行截图的。最初要放到 context.draw(true,()=>{})的回调中,保障胜利绘制图片,我这里是返回进来一个门路和文件的后缀名。

April 12, 2021 · 1 min · jiezi

关于云开发:借助云开发实现免登录资源导航小程序

用云开发实现一个资源导航小程序,要实现的性能很简略:所有用户都能够查看和举荐资源,被举荐的资源的相干信息会以清单的形式显示。 次要目标是通过实战,帮忙大家疾速理解下 小程序开发流程 和 云开发技术,学习更高效的小程序开发形式。 技术选型首先抉择小程序开发技术。开发小程序的过程和开发网站相似,都是要写前端(界面交互)和后端(申请解决逻辑)代码。 前端前端方面我抉择用 Taro 框架 + Taro UI 开发。Taro 是一个基于 React 的跨端开发框架,反对写一套代码,主动生成微信小程序、H5、APP 等利用,再加上框架为很多简单的性能提供了函数封装,能够大大晋升开发效率。而 Taro UI 是基于 Taro 的 UI 库,提供了很多现成的组件,比方图片上传、选择器等,能够满足常见的开发需要。 后端后端就简略了,传统的形式是应用编程语言提供的后端开发框架,比方 Java 的 SpringBoot、PHP 的 Laravel、Python 的 Django 等,但往往须要本人搭建服务器、数据库、日志、监控、运维等等,对于只会前端或者想要疾速开发小程序的同学来讲,几乎就是噩梦! 因而我抉择更高效便捷的形式,腾讯小程序云开发! 什么是云开发?小程序云开发是微信团队联结腾讯云推出的业余的小程序开发服务,帮忙大家疾速开发小程序、小游戏、公众号网页等,并且原生买通微信凋谢能力。 云开发的劣势有哪些呢? 1.开发者无需搭建后端服务器,只需应用平台提供的各项能力(比方云数据库、云存储、音视频、AI 等),即可疾速开发业务。 平安易接入:无需治理证书、签名、秘钥,间接调用微信 API 。复用微信公有协定及链路,保障业务安全性。多端复用:反对环境共享,一个后端环境可开发多个小程序、公众号、网页等,便捷复用业务代码与数据。不限开发语言和框架:开发者能够应用任意语言和框架进行代码开发,构建为容器后,疾速将其托管至云开发。按量计费,老本更低,反对主动扩缩容扩大能力:反对一键部署动态网站,并能用云 CMS 治理数据内容其中,最吸引我的就是云开发的高效便捷,不必本人搞服务器、搭数据库,也不必解决和微信对接的简单逻辑,只须要专一于实现性能自身即可,而且能够间接用云开发 SDK 提供的各种函数,开发效率拉满! 比方查问数据,几行代码搞定! 利用开发上面来开发小程序,蕴含初始我的项目搭建、前端页面开发、接入云开发等步骤。 我的项目搭建首先咱们参照 Taro 框架官网文档的疾速开始局部,装置 Taro 命令行工具,并初始化一个小程序利用。 留神初始化时会让你抉择模板,此处抉择云开发即可,Taro 会主动生成蕴含云开发的示例代码,目录构造如下: 前端开发咱们总共要创立两个页面,资源列表页和举荐资源页,须要用到的组件有列表、表单、输入框、按钮、图像上传等。 Taro UI 反对以上所有组件,依照 Taro UI 的官网文档接入,复制组件代码到页面中批改即可,很快就能开发出这两个页面。 资源列表页的示例代码如下: <View className='list'> <!-- 列表组件 --> <AtList> {resourcesView} </AtList> <!-- 固钉组件,点击跳转至举荐页 --> <AtFab className="fab-btn" onClick={() => navTo(xx)}> <AtIcon value='add'/> </AtFab></View>能够关上微信开发者工具查看页面成果: ...

April 1, 2021 · 1 min · jiezi

关于小程序:彻底解决小程序无法触发SESSION问题

本文转自SDK社区:https://www.sdk.cn/details/lE5wmb52qR058DgojN一、首先找到第一次发动网络申请的地址,将服务器返回set-cookie当全局变量存储起来 wx.request({ ...... success: function(res) {console.log(res.header);//set-cookie:PHPSESSID=ic4vj84aaavqgb800k82etisu0; path=/; domain=.fengkui.net// 登录胜利,获取第一次的sessionid,存储起来// 留神:Set-Cookie(开发者工具中调试全副小写)(近程调试和线上首字母大写)wx.setStorageSync("sessionid", res.header["Set-Cookie"]); }})二、申请时带上将sessionid放入request的header头中传到服务器,服务器端可间接在cookie中获取 wx.request({......header: {'content-type': 'application/json', // 默认值'cookie': wx.getStorageSync("sessionid")//读取sessionid,当作cookie传入后盾将PHPSESSID做session_id应用},success: function(res) {console.log(res)}})三、后盾获取cookie中的PHPSESSID,将PHPSESSID当作session_id应用 <?php// 判断$_COOKIE['PHPSESSID']是否存在,存在则作session_id应用if ($_COOKIE['PHPSESSID']) {session_id($_COOKIE['PHPSESSID']);}session_start();echo session_id();![image](/img/bVcPsMe)

March 11, 2021 · 1 min · jiezi

关于小程序:小程序首页需要等待appjsonLaunch中某请求执行完成

场景:我的项目启动的时候(onLaunch)就向后端申请接口返回租户ID,在首页(onLoad)中因为异步申请在这里并没有拿到租户ID (备注:在onReady事件中偶然能够拿到租户ID,这是因为onLaunch里的接口申请快的起因,写在onReady里并不能解决问题) 是因为异步申请,还没拿到后果,onLoad就执行了。小程序并没有让app.js里onLaunch的办法执行完再去执行页面中的办法 解决办法在onLaunch的接口中增加申请回调 appjs中增加wxConfigCallback回调 onLaunch: function () { this.getWxConfig(); //获取小程序配置信息 }, //获取小程序配置信息getWxConfig: function () { api.getWxConfig({ appId:this.appId || wx.getStorageSync("appId") }).then((res) => { let config = res.data; //存储配置项 this.tenantId = config.tenantId; this.msgTmplIds = config.msgTmplIds; wx.setStorageSync("msgTmplIds", this.msgTmplIds); wx.setStorageSync("tenantId", config.tenantId); //是否有回调,以防home页的onLoad拿不到异步数据 if (this.wxConfigCallback) { this.wxConfigCallback(config) } });},home中应用回调后执行业务逻辑 onLoad: function (options) { //拿到app.js配置参数后执行 app.wxConfigCallback = (config) => { //执行业务逻辑... consloe.log(config) pageRecord(9) }},

March 9, 2021 · 1 min · jiezi

关于小程序:创誉小程序商城

创誉小程序商城 作者:创誉代码 创誉小程序商城打造本人的商业帝国。反对轮播图、商业预览、购买、微信领取、物流跟踪。

February 24, 2021 · 1 min · jiezi

关于小程序:小程序心得笔记2运行框架与宿主环境

小程序代码形成 小程序宿主环境       小程序框架     小程序Runtime  

February 7, 2021 · 1 min · jiezi

关于小程序:小程序无痛刷新token

// 封装一个http 办法let temp_request = [], is_freshing = false;/** * @param {string} url * @param {string} method * @param {Object} data * @param {Boolean} loading */const http = function(url, method, data, loading) { let params_ = arguments return new Promise((resolve, reject) => { if(loading) { uni.showToast({ title: '加载中', icon: 'loading', duration: 10000, // mask: true }) } data.token = uni.getStorageSync('api_token') uni.request({ url: url, method, data, success(res) { if(loading){ uni.hideToast({ title: '加载中', icon: 'loading', duration: 10000, }) } let code = res.data.code switch (code) { case 0: resolve(res.data.data);break; case 200: // other handlers break case 401: // token 过期 if(!is_freshing) { refresh() } // 关键步骤~~~~ resolve(new Promise(reslove => { temp_request.push(() => { reslove(request(...params_)) }) })) break; default: reject(res.data.data) } }, fail(error) { reject(error.data.data) }, complete(res) { } }) })}function refresh() { is_freshing = true // 这里用的uni-app 获取微信code, 原生微信小程序 wx.login() uni.login({ provider: 'weixin', success: function (loginRes) { http('/mob/auth/login/miniProgram', 'post', {code}, true) .then((res) => { uni.setStorageSync('api_token', res.token) is_freshing = false temp_request.map(cb => cb()) // 清空temp_request temp_request = [] }) .catch((res) => { uni.hideLoading(); }) } }); }, 1500)}export default http// 测试onShow() { // 在token过期的状况下,派发三个须要token的申请 http({url1, 'get'}) .then((res) => { console.log(res) }) http({url1, 'get'}) .then((res) => { console.log(res) }) http({url1, 'get'}) .then((res) => { console.log(res) })}

February 5, 2021 · 1 min · jiezi

关于小程序:微信小程序开发腾讯地图集成步骤旧题新说

在腾讯生态开发过程中,包含在微信小程序开发的时候,防止不了应用腾讯送的腾讯大礼包,从微信领取到腾讯地图,一条龙的腾讯大礼包,不得不说鹅厂的实力是无可比拟的。 然而话又说回来了,鹅厂的官网API真是不敢恭维,尤其是微信小程序的开发文档,如果不相熟的话,真的是大坑一直,连环坑一直,有力吐槽。 本篇博文来说说微信小程序开发的时候集成实现腾讯地图的性能,尽管微信官网API介绍了集成步骤,然而还是会给小白带来云里雾里的感觉,接下来就具体来说说具体的集成步骤,分享进去,若有不妥之处请斧正。 其实微信小程序还能够集成百度地图的,只是这里不再介绍其余家的地图集成到微信小程序的步骤。本案例间接把小程序的地图局部进行了封装,用组件的模式调用,方便使用,便于了解。还是间接上代码比拟好,具体操作如下所示:一、map组件的实现1、homeMap.js文件 const app = getApp()Component({ properties: { position: { type: Array, value: [], }, markers: { type: Array, value: [], }, markerList: { type: Array, value: [] }, getCurrentElement: { type: Function, value: function () { } } }, data: { position: [], markerList: {}, markers: [] }, ready: function () { const mapContext = wx.createMapContext('map') const { position, markers, markerList } = this.properties; this.setData({ position, markers, markerList, }); mapContext.moveToLocation({ longitude: 114.54286, latitude: 22.05956, complete(e) { console.log('moveToLocation', e) } }) }, methods: { markertap({ markerId }) { let { markerList } = this.properties; markerList && markerList.map((item, idx) => { if (item.id === markerId) { item.num = markerList.length; this.triggerEvent('onMarker', item) //通过triggerEvent将参数传给父组件 } }) } },}) 2、homeMap.json文件 ...

February 4, 2021 · 2 min · jiezi

关于小程序:小程序-笔记实用

小程序注意事项web-view 内部援用必须是 https (下载文件也要配置)小程序 web-view 配置后不失效 等几个小时 或者睡一觉就好了小程序根底加载事件onLoad() 页面加载时触发,只会调用一次,可获取以后页面门路中的参数。 onShow() 页面显示/切入前台时触发,个别用来发送数据申请; onReady() 页面首次渲染实现时触发, 只会调用一次,代表页面已可和视图层进行交互。 onHide() 页面暗藏/切入后盾时触发, 如底部 tab 切换到其余页面或小程序切入后盾等。 onUnload() 页面卸载时触发,如redirectTo或navigateBack到其余页面时 贮存存:wx.setStorageSync('token', '48gw9p7829529Vv3ccJyZMvpsEOtJuVHKk9RtX1vCO4=');取:wx.getStorageSync('token')for 循环wx:for="{{list}}"if 判断/* js /wx:if="{{ a > 5 }}"wx:elif="{{ a < 5 }}"wx:else/* view */<view wx:if="{{ !a }}">逻辑非</view><view wx:if="{{ a || b }}">逻辑或</view><view wx:if="{{ a && b }}">逻辑与</view>点击事件(相当于click) bindtap="bindViewTap"data 赋值that.setData({ list:res.data})// 打印console.log(that.data.patient)参数传递、获取参数// 参数传递data-num="{{item.id}}"// 获取参数console.log(e.currentTarget.dataset.num)页面跳转 bindViewTap() { wx.navigateTo({ url: '../abnormal/abnormal' }) },页面传参跳转<navigator url="../detail/detail?id={{item.id}}" >查看</navigator>/*获取当前页地址参数*/onLoad(e) { console.log(e.id)}/* 页面跳转(接口内写)*/wx.navigateTo({ url: '../mine/mine'})小程序问题 及 解决方案小程序获取手机号<!-- wxml --><button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" class="wx-button">获取手机号</button><!-- js -->getPhoneNumber: function(e) { console.log(e)},如呈现该弹框 须要小程序认证 ...

January 29, 2021 · 1 min · jiezi

关于小程序:小程序开发复盘疑难杂症

小程序调用地图导航留神:经纬度必须是浮点数 addressClick: function (e) { let address = e.currentTarget.dataset.item; let latitude = parseFloat(this.data.pageData.latitude); let longitude = parseFloat(this.data.pageData.longitude); wx.getLocation({ type: 'wgs84', success: function (res) { wx.openLocation({//应用微信内置地图查看地位。 latitude: latitude,//要去的纬度-地址 longitude: longitude,//要去的经度-地址 name: address, address: address }) } }) },携带参数返回上一页,上一页不刷新场景:抉择优惠券,返回下单页留神:下单页接管参数,必须写在onshow //优惠券页面,把参数带回上一页 goToDetail: function (e) { let pages = getCurrentPages(); let prevPage = pages[pages.length - 2]; prevPage.setData({ ticketCardId: this.data.activeItem, ticketType: this.data.type }) wx.navigateBack({ delta: 1 }) }, //下单页,接管优惠券页面携带的参数 onShow: function () { let that = this; var pages = getCurrentPages(); var currPage = pages[pages.length - 1]; that.setData({ ticketCardId: currPage.data.ticketCardId, ticketPrice: currPage.data.ticketPrice }); },小程序保留图片 saveCard: function () { var that = this; let url = that.data.card_url; wx.downloadFile({ url: url, //仅为示例,并非实在的资源 success: function (res) { // 只有服务器有响应数据,就会把响应内容写入文件并进入 success 回调,业务须要自行判断是否下载到了想要的内容 if (res.statusCode === 200) { wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success(res) { that.setData({ shareShow: false }) wx.showToast({ title: '保留图片胜利!', }) }, fail(res) { wx.showToast({ title: '保留图片失败!', }) } }) } } }) },辨认二维码进入页面,后端生成的二维码携带参数场景:后端生成二维码,前端解析测试方法:微信开发者工具,菜单栏点击一般编译,最底下有个通过二维码编译选项留神:这个是我看到他人的答案照搬到我的项目里,写这里是为了下次参考用的,但找不到原链接,如果找到会附上,或者侵删,非常感谢原作者!!! ...

January 27, 2021 · 3 min · jiezi

关于小程序:Taro-30Echarts-编译成微信小程序

1、创立Taro我的项目IDE:VSCode环境:node>=12.0.0装置Taro,参照官网 Taro装置及应用 npm install -g @tarojs/cli(装置Taro)taro init myApp(创立Taro我的项目)npm run dev:weapp(编译成微信小程序)关上微信开发者工具,预览该我的项目2、援用Echarts 下载echarts-for-weixin我的项目中的ec-canvas到我的项目中也能够在echarts里定制须要的图表替换ec-canvas里的echarts.js3、我的项目构造&成果预览 4、pie.js代码示例 import React, { Component } from "react";import { View } from "@tarojs/components";import "./pie.scss";import * as echarts from "../../components/ec-canvas/echarts";let pieDataA = null;export default class PieIndex extends Component { constructor(props) { super(props) this.state = { ec: { onInit: function (canvas, width, height) { pieDataA = echarts.init(canvas, null, { width: width, height: height }); canvas.setChart(pieDataA); return pieDataA; } } } } componentWillMount() { let dataA = ['A', 'B', 'C', 'D']; let dataValA = [ { value: 1548, name: 'A' }, { value: 535, name: 'B' }, { value: 510, name: 'C' }, { value: 634, name: 'D' } ]; setTimeout(() => { pieDataA.setOption(this.getOption(dataA, dataValA)); }, 100); } getOption(data, dataVal) { let option = { animation: false, tooltip: { trigger: 'item', formatter: '{c} ({d}%)' }, legend: { // bottom: 0, left: 'center', data: data }, color: ['#3AA1FF', '#36CBCB', '#E91D63', '#4ECB73'], series: [ { type: 'pie', radius: '65%', center: ['50%', '50%'], data: dataVal } ] }; return option; } render() { return ( <View className='list'> <View className='mychart-con'> <ec-canvas ec={this.state.ec}></ec-canvas> </View> </View> ) }}

January 21, 2021 · 1 min · jiezi

关于小程序:多端统一开发工具kbone

本文简略介绍了小程序官网同构计划kbone的应用、原理、以及如何将一个vue我的项目通过该框架转换为小程序我的项目,并比拟了目前市场上风行的几个第三方框架与kbone之间的比拟,为技术选型提供了肯定的参考意义。 kbone 框架kbone 是一个致力于微信小程序和 Web 端同构的解决方案。该框架于2020-02-26开源,于2020-03-26公测。微信凋谢社区小程序是应用Kbone官网框架编写的小程序。 简介微信小程序的底层模型和 Web 端不同,咱们想间接把 Web 端的代码挪到小程序环境内执行是不可能的。kbone 的诞生就是为了解决这个问题,它实现了一个适配器,在适配层里模拟出了浏览器环境,让 Web 端的代码能够不做什么改变便可运行在小程序里。简略来说,应用这个框架写一份代码,并进行一些配置,就能够在运行时渲染在web和小程序两端。 劣势大部分风行的前端框架都可能在 kbone 上运行,比方 Vue、React、Preact 等。反对更为残缺的前端框架个性,因为 kbone 不会对框架底层进行删改(比方 Vue 中的 v-html 指令、Vue-router 插件)。提供了罕用的 dom/bom 接口,让用户代码无需做太大改变便可从 Web 端迁徙到小程序端。在小程序端运行时,依然能够应用小程序自身的个性(比方像 live-player 内置组件、分包性能)。提供了一些 Dom 扩大接口,让一些无奈完满兼容到小程序端的接口也有代替应用计划(比方 getComputedStyle 接口)。Webpack与Kbone是强耦合的,开发需借助Webpack提供的根本依赖 简略应用为了能够让开发者能够更自在地进行我的项目的搭建,以下提供了三种形式。咱们先看一下最便捷的脚手架的形式。 应用 kbone-cli 疾速开发开发筹备npm install -g kbone-cli //装置脚手架kbone init kbone-pro // 初始化我的项目如图: // 代码构建npm run mp // 开发小程序端npm run web // 开发 Web 端npm run build // 构建 Web 端须要在小程序中运行kbone我的项目,执行npm run mp 会在dist目录下生成一个mp文件夹,应用开发者工具关上 dist/mp 目录即可。须要打包web我的项目,执行npm run build,会在dist目录下生成一个web文件夹。 ...

January 14, 2021 · 2 min · jiezi

关于小程序:uniapp-小白入门

前言业务需要,被迫营业小程序,而且须要微信和支付宝两个端。因为之前没有做过小程序,所以略微调研了下最近比拟火的两款小程序跨端开发框架:uni-app 和 Taro。因为很久没有写过 vue 我的项目,所以一开始比拟偏差于应用 Taro,在参照文档搭建完框架并写了一点小 demo 之后,发现 Taro 的 api 支持性没有 uni-app 好,次要是针对支付宝,所以弃坑 Taro,转战 uni-app。当然,只做微信小程序的话,Taro 还是很棒的。 我的项目搭建官网提供了两种疾速上手的搭建形式,我这里采纳的是第二种(参考:官网文档)。 此处我并没有依照官网抉择 Hello uni-app 模板,而是抉择了默认模板。次要步骤:(环境装置省略) vue create -p dcloudio/uni-preset-vue my-project抉择默认模板集成 sass【须要留神的是版本问题,默认会装置最新版本,然而不能反对,所以要自行抉择,试了几个版本,最初用的是 sass-loader@8.0.1 node-sass@4.14.1】ui(能够抉择官网的 uni-ui 或者 uView,一开始我应用的是 uni-ui,起初换了 uView,感觉 uView 更全面更好用)网络申请(我采纳的是他人封装好的插件 luch-request)集成 vuex(按需采纳)最终目录构造如下: 随着我的项目继续开发,我的项目包大小超过了微信小程序可预览的包大小限度,于是采取分包措施,uni-app 官网也有相干配置阐明:分包配置阐明所以最终目录构造如下所示: 我的项目重难点1. 受权(微信和支付宝)uni-app 提供了相应的接口,然而不反对支付宝小程序,所以须要做跨端兼容,独立反对微信和支付宝小程序。跨端兼容我采纳的是官网文档中提到的条件编译。 > 跨端兼容:uni-app 文档中有阐明([uni-app 文档](https://uniapp.dcloud.io/platform) 。微信小程序受权流程:获取所有受权状态 ---- 如果不存在 --- 再调用受权接口 --- 如果受权胜利 --- 调用最终 API 接口 <!-- #ifdef MP-WEIXIN --><button class="sys_btn" open-type="getUserInfo" @getuserinfo="appLoginWx"> 微信受权登录</button><!-- #endif -->// 获取所有受权状态uni.getSetting({ success(res) { console.log("受权:", res); if (!res.authSetting["scope.userInfo"]) { //这里调用受权 console.log("以后未受权"); this.appLoginWx(); } else { //用户曾经受权过了 console.log("以后已受权"); } },});appLoginWx() { uni.getProvider({ service: "oauth", success: function(res) { console.log("res", res); if (~res.provider.indexOf("weixin")) { uni.login({ provider: "weixin", success: (res2) => { console.log("res2", res2); uni.getUserInfo({ provider: "weixin", success: (info) => { console.log('info', info); //TODO[申请接口] }, fail: () => { uni.showToast({ title: "微信登录受权失败", icon: "none" }); }, }); }, fail: () => { uni.showToast({ title: "微信登录受权失败", icon: "none" }); }, }); } else { uni.showToast({ title: "请先装置微信或降级版本", icon: "none", }); } }, });},支付宝小程序受权流程:(官网提供的时序图) ...

January 13, 2021 · 2 min · jiezi

关于小程序:小程序-swiper-间距轮播

swiper 组件只能无缝轮播,所以简略实现一个间距轮播 ## 采纳 css 实现 给swiper-item增加款式,也可手动管制间距,调整padding swiper-item{ box-sizing: border-box; padding: 0 5vw;}成果如下 毛病就是增加了 padding,导致不是全屏宽度的图片

January 11, 2021 · 1 min · jiezi

关于小程序:小程序canvas大转盘

// luckRoll.wxml<view class="canvas-container" style="transform: rotate({{isRotate}}deg)"> <canvas disable-scroll="true" canvas-id='canvas' id="canvas-bg" class='canvas '></canvas> <image src="{{tempFilePath}}"></image></view>须要定义的数据 // luckRoll.jsdata: { trunBtn: false,//抽奖按钮是否能够点击 itemsNum: 3, //大转盘等分数,可依据后盾配置加载 itemsArc: 0, //大转盘每等分角度 coupons: [],//每个扇形中的文字填充 isRotate: -180, // 初始旋转角度}创立一个canvas对象,因为它是个组件,所以在传入转盘数据的时候,初始化canvas properties: { rollOptions: { type: Array, observer(val) { if(val.length > 0) { this.setData({ coupons: val, itemsNum: val.length }) const ctx = wx.createCanvasContext("canvas", this); //创立id为canvas的绘图 this.getGiftList(ctx) } } }},getGiftList(ctx) { let that = this; let itemsArc = 360/that.data.itemsNum that.setData({ itemsArc }, function () { const query = wx.createSelectorQuery().in(that) query.select('#canvas-bg').boundingClientRect() query.exec(function (rect) { w1 = parseInt(rect[0].width / 2); h1 = parseInt(rect[0].height / 2); that.drawRegion(itemsArc, ctx);//每一份扇形的外部绘制。 }) })}绘制扇形 ...

January 6, 2021 · 3 min · jiezi

关于小程序:小程序全局授权弹窗

首先,因为小程序没有app.wxml,所以自定义弹窗必须写成组件,除非应用微信自带的弹窗。 // login.wxml<view class="login-dialog-wrap" wx:if="{{showPhoneDialog}}"> <view class="login-dialog-cover"></view> <view class="login-dialog-container"> <view class="login-dialog-content"> <view class="login-dialog-title text-center color33">受权登录</view> <view class="text-center">您好,受权微信手机登录即可及时</view> <view class="text-center">获取本店最新优惠资讯哦~</view> <button class="login-dialog-button" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"> 立刻受权 </button> </view> <view class="iconfont icon-guanbi login-dialog-close" bindtap="closePhoneDialog"></view> </view></view>// loginDialog.jsComponent({ data: { showPhoneDialog: false, isTabBarPage: false }, lifetimes: { attached() { // 判断以后页面是否为tabBar页面 // 非tabBar页执行hideTabBar()报错 let pages = getCurrentPages() //获取加载的页面 let currentPage = pages[pages.length - 1] //获取以后页面的对象 let url = currentPage.route //以后页面url this.setData({ isTabBarPage: app.tabBarPages.includes(url + '.html') }) } }, properties: { // 手机号受权弹窗 phoneDialog: { type: Boolean, observer(val) { setTimeout(() => { this.setData({ showPhoneDialog: val }) if (val) { this.hideTab() } }, 500) } } }, methods: { // 手机号受权胜利回调 getPhoneNumber(e) { this.setData({ showPhoneDialog: false }) this.showTab() if (e.detail.errMsg.includes('fail')) { // 回绝受权 this.triggerEvent('callback', { type: 'phoneNumber', val: false }) } else { let detail = e.detail // dosomething } }, closePhoneDialog() { this.setData({ showPhoneDialog: false }) this.showTab() this.triggerEvent('callback', { type: 'phoneNumber', val: false }) }, showTab() { if (!this.data.isTabBarPage) return wx.showTabBar() }, hideTab() { if (!this.data.isTabBarPage) return wx.hideTabBar() } }})写好弹窗组件后,全局引入 ...

January 5, 2021 · 1 min · jiezi

关于小程序:技术干货-六分钟学会使用-HBuilder-引入构建-mPaaS-小程序

大家好,我是来自 mPaaS 前端团队的工程师胜永。 之前跟大家分享过应用 mPaaS 小程序 IDE 多端开发的应用技巧,明天跟大家分享如何应用 uniapp 原生脚手架生成的我的项目,能够同时在 uniapp 的 HBuilder 和 mPaaS 小程序 IDE 中应用。 这样的益处是:应用 HBuilder 能够间接在 uniapp 插件市场中中导入插件和模板,同时,应用 mPaaS 小程序 IDE 的能力能够将 mPaaS 小程序公布到本人的治理平台上。 鱼与熊掌能够兼得,六分钟即可学会应用 HBuilder 引入构建 mPaaS 小程序。具体操作详见下方视频: ????点击播放 STEP 1通过 uniapp 命令行创立小程序和 uniapp 小程序我的项目。 命令行地址中转:uniapp.dcloud.io/quickstart-cli STEP 2将 mini.project.json 文件复制到创立的文件夹中。公众号「mPaaS」后盾回复“demo”获取文件下载链接。 STEP 3关上 mPaaS 小程序 IDE,导入方才创立的我的项目。 DONE实现编译,即可预览。

December 31, 2020 · 1 min · jiezi

关于小程序:小程序吸顶效果

1.在红色局部加上position:sticky,滚动条滑到红色局部时,就会主动吸附手机端不显示的状况下加上这一句position:-webkit-sticky; 2.黄色局部加上position:sticky;加上scroll-view。实现右边固定高度滑动。 留神:如果应用这个办法的话,右边分类切换的时候,数据不够,页面是撑不起来的,所以当数量少于时,要设置高度。

December 28, 2020 · 1 min · jiezi

关于小程序:推动工会数字化转型的重要经验分享|第一届广东省智慧工会工作研讨会召开

12 月 15 日,「智行合一 共惠粤工——第一届广东省智慧工会工作研讨会」在广州召开,工会领导与业界专家学者独特交换大数据时代背景下,智慧工会建设的新门路、新思路,携手推动工会工作数字化转型。会上,《粤工惠平台一周年倒退状况报告》公布,与会嘉宾分享了粤工惠平台经营教训和心得体会。中华全国总工会网络工作部副部长彭恒军,广东省总工会党组成员、经审会主任冯建华,广东省总工会二级巡视员刘国斌,爱范儿首席技术官CTO、通晓云平台负责人何世友出席会议。 会议指出,广东是数字经济大省,互联网产业发达。广东工会工作必须充分利用这一劣势,推动自我改革、翻新倒退,造成更宽泛的以互联网为基础设施和翻新因素的工会工作新形态。广东智慧工会建设必须遵循法则打好根底,引进业余团队,实现全省工会互联互通和宽广会员遍及普惠;以技术为本推动建设,进步平台先进性,进步服务精准性、便利性,并进步决策科学性;要欠缺机制晋升能力,建设工会信息化规范体系、健全社会服务接入制度、进步平台经营服务能力、强化网络安全防护能力。 近年来,广东工会倾力打造智慧工会,推动「互联网+」工会普惠服务,通过粤工惠平台的建设,夯实全省智慧工会建设根底。2019 年 10 月 23 日粤工惠平台正式上线,目前平台实名注册工会会员数超过 520 万人,批量导入会员数达 1000 万,注销的工会组织数达 104618 家,平台公布的资讯达 14743 条。在全总刚刚完结的工会年度「互联网+普惠服务优良平台」评比中,粤工惠平台荣登「省级十佳平台」榜首。 通晓云是广东省总工会数字化建设的合作伙伴,整合了创新能力、技术能力、数字化经营能力继续赋能工会,助力广东省总工会上线「智送清凉、助农脱贫奔康、春节返乡补贴」等系列流动,不仅实现实打实的惠民服务,更器重通过数据发现流程中的问题、优化流程。数据驱动流程再造,将「普惠+效率」施展到极致。 爱范儿首席技术官、通晓云平台负责人何世友缺席本次研讨会,从挪动互联网赋能工会经营的角度,讲述了数字化时代工会经营的新技术和新办法。他示意,通晓云是数字化服务平台,提供数字化精益经营撑持、提供各类数字化服务的外围引擎,买通智慧工会服务的任督⼆脉,使工会普惠服务中转职工。 以下为何世友在研讨会上讲话的简要内容,心愿对于正在寻求数字化转型的企业、数字化服务的提供商,都能有所启发。 什么是数字化,为什么数字化在智慧工会工作中如此重要?1、互联网数字化就是以用户为核心的数字经营互联网的倒退历程,就是一个用户经营一直精细化的历程。 传统的政府、企业,很早就是实现了信息化,造成了欠缺的外部流转机制及合作机制,外部的业务根本曾经实现了信息化笼罩。新时代的要求,挪动互联网的遍及,每一个人都实现了线上化,让政府、企业的合作能够更宽泛触达更多的内部用户。服务人造延展到了内部,如何让内外造成新的业务通道,实现精准触达、标准高效,便是数字化的题中之义。因而,数字化的外围,便是通过互联网的伎俩,把内部用户纳入工作流转机制中来,一句话,数字化的外围,是以用户为核心的数字经营。 2、数字化及用户经营对于工会行业,尤其重要习总书记明确要求,要把网上工作作为工会分割职工、服务职工的重要平台,加强流传力、疏导力、影响力。这为全力推动工会网上工作向纵深倒退指明方向。数字化及用户经营,是工会顺应时代倒退的主观要求。互联网日益成为亿万职工学习、工作、生存的新空间,获取公共服务的新平台,互联网曾经成为工会工作新的阵地。新时代新形势下,工会工作必须与互联网深度交融倒退,造成更宽泛的以互联网为基础设施和翻新因素的工会工作新形态。通过智慧工会建设,能够进一步加强工会组织的吸引力凝聚力,推动工会自我改革、翻新倒退,最大限度地把广大职工组织到工会中来。 广东省总工会的互联网经营工作遵循了哪些方法论?有何值得分享的教训?无论是微信、今日头条、美团、小红书等互联网平台/产品,纵观经营得好的互联网平台,它们都有三个特点: 精确把握住了互联网产品的法则有强有力的经营策略围绕策略,有很好的工作发展着力点对于省总工会,能在这么短的工夫内,迅速联合工会的各项业务,发展各种简单经营,咱们的了解,是基于以下起因。 1、粤工惠有明确的的建设方向上线之初,省总工会就把「链接资源、赋能基层、服务会员」确定为平台建设主旨,通过零碎建设,平台为各级工会赋予了本级工会根本治理能力,工会业务和流动发展能力,以及二次开发,链接资源的能力。明确的建设方向,为经营团队发展经营工作确定了明确的指针。 2、粤工会经营平台把握了打造一个优良互联网产品的法则:重视技术投入及底层构架粤工惠构建了三大动静治理数据库,包含工会组织数据库、工会会员数据库和工会干部数据库,具备增删改查的治理性能,为工会管理员和会员本身提供了动静治理的能力。 工会会员实名数据库依照全总确定对立的工会组织和会员信息规范、数据交换规范,建设广东省总工会数据交换共享平台。这些经营平台和底层数字化根底,为工会数字化经营,奠定了十分好的根底。 3、500 万实名制服务平台的用户,是精益经营的根底数据比对智能校验。充分利用数字广东政务云平台数据协同利用的粗放劣势,买通跟省大数据平台数据交换的通道,依据具体业务须要,调取大数据平台上相干数据进行校核,保障了实名制服务平台工作的准确性和安全性,既满足了实名制服务平台对隐衷的爱护,又精准定位合乎福利发放条件的工会会员。 会员双向实名认证。工会会员在平台上调用「粤信签」小程序进行扫脸实名认证,若其所在基层工会已批量导入会员数据,通过后盾身份证数据比对,会员将主动退出到所在基层工会并取得工会电子会员卡。若其所在基层工会未批量导入数据,则须要会员自己在平台上搜寻所在基层工会,进行注销申请,经基层工会管理员审核通过后取得工会电子会员卡。 4、粤工惠通过技术手段来实现精益经营更加高频的传统工作流程再造及普惠流动发展,各级工会的分级经营及各类第三方服务体系的构建,对系统服务的安全性、稳定性、实时性提出了更高的要求,对业务利用的疾速开发、迭代、上线提出了更迫切的须要。 爱范儿领有一支硅谷级的全链路产品技术团队,通过高质量、规范化、流水化的品质把控措施,在最短的工夫内实现数字化我的项目的技术施行,并保障硅谷水准的品质。 人、货、场是近年来新批发对线上到线下环节的笼罩,映射到咱们产品中,则对应会员、平台、服务商。目前挪动互联网曾经提供了一个十分好的范本,商业公司提供了残缺的内部数据和流程的搭建。因为各个平台在数据齐备度和精准度上曾经做了铺垫,咱们要做的引入更好的成果监测的办法、框架和技术,有利于在所有流动发展中,通过漏斗剖析、环节剖析,来判断每一个用户的参加水平和每一个服务商所提供服务的耗费水平,实现数据领导业务,辅助下一步的工作布局。 统计分析进化论带参⼊⼝渠道散发更通明漏⽃剖析全链路成果掌控「智送清凉,关爱职工」惠民流动实现线上线下无缝集成。 爱范⼉借助数字化能⼒,使⽤通晓云的强⼤能⼒,将传统的「送清凉」线下流动转变为数字化流动。使⽤了数字⼿段后,省总⼯会第⼀次在微信⼩程序上实现了残缺的全链路营销流动。在夏天为⼴东省内的 2.2 万名户外⼯作者(包含环卫⼯⼈、外卖员、快递员)在微信中发放了 93 万张清凉券,⽤户领券后微信⽀付即可抵扣。补全欠缺政务服务体系,为户外⼯作者提供触⼿可及的优惠补贴。 这次流动失去了多家地方媒体的盛誉,也为⼴东省总⼯会在全国⼯会零碎中博得了⼤量好评。 ⼯会的使命是对接丰盛多样的第三⽅服务商,通过非法合规的流程为⼴⼤会员提供服务。⽽因为历史起因,各家服务商使⽤的零碎均不⼀样,为了给会员提供⼀致的⽤户体验,给服务商提供⼀致的接⼊体验,技术团队制订了⼀系列的接⼊准则标准和业务指标监控规范,从源头上保障了服务的⾼品质。 通晓云:高效率迭代和高可用的服务撑持,先进的无服务器架构平台 而工会平台在服务承载上,有这么两个特色。第一,流动上新快,基本上每周都要上线新的流动;第二,每一场流动,都是要服务数百万甚至上千万的会员,用户量级大。这对流动的研发上线提出了迭代高效率和服务高可用的要求。在这块,咱们采取的是通晓云,通晓云是当初⾼可⽤的服务⽀撑的代表之一,应用先进的⽆服务器架构,让流动业务研发具备以下两个劣势: 业务研发团队聚焦业务,通晓云整合了⼤局部底层能⼒,晋升研发效力 50% 以上;通晓云平台托管运维,智能应答流量洪峰,保障 SLA 99.90% 以上。展望未来,互联⽹经营须要加强哪些⽅⾯? 建设架构先进、底层对立、多端适配、数据驱动的云原生数字化服务平台打造省总兼顾、分级经营,集中管控与自主经营相结合的普惠工会工作机制搭建多类别、多层次,专业化、社会化及市场化相结合的工会会员普惠服务体系造成面向会员需要、面向生态倒退、面向未来建设的全域智慧工会零碎为此,咱们将联合上述指标,为进一步布局全域智慧工会数字化基础设施,适应平台业务需要和会员服务须要: 增强对底层平台及平台框架的建设,打造反对多端开发的数字化中台;引入混合云架构以及平安管控引擎,构建更适宜平台拓展及流动发展的利用开发平台;建设「粤工惠」政务混合云服务平台,联通政务云和公有云,满足「粤工惠」流动发展高并发、快迭代的理论需要,能够让智慧工会业务灵便部署,数据全面买通,更好打造高效、灵便、平安、可信的「全域智慧工会」,施展广东省总工会的数字化标杆作用;增强对工会工作标准化建设和经营体系的摸索和实际,对于互联网经营,标准化的管控至关重要;让服务从线下沿伸,使线上线下相结合,给工会的传统业务起到减速、加倍的作用。让业务从迟缓的线下流程变成容易的线上流程,通过流程再造的形式,让业务能接触到之前难以触达的用户群体;强化用户经营,也就是说围绕用户的外围需要,发展工会外围业务, 给用户低门槛入口,通过粤工惠 App ,利用普通群众习惯应用的伎俩,让用户能自发申领、流传。查看更多小程序解决方案

December 21, 2020 · 1 min · jiezi

关于小程序:小程序开发快速入门

最近在公司刚做完一个小程序,主要用途是企业经营人员用来看各类图文报表的。上线后整体成果如下图。因为是第一次接触小程序开发,这里特意记录一下我的学习过程以及开发踩过的坑。心愿能给还不会小程序开发的兄弟带来一些帮忙。 学习过程技术选型上间接采纳小程序原生开发,整体学习过程还是很快的,基本上第三天就开始尝试上手开发了。第一天:两倍速看完了慕课网7月老师的小程序课程(业务细节跳着看),对小程序开发流程,知识点有了一个初步的意识。第二天:有侧重点的读小程序开发文档。第三天:搭建框架,开始开发。 常识纲要这里列一下我认为比拟重要的知识点,大家能够依据清单去细读文档 小程序AppId的申请开发工具的应用 编译设置 抉择编译页面,不校验Https,加强编译预览,调试终端,调试器应用与h5开发的区别 rpx,wxml,wxss配置大于约定,app.json外面的设置,比方导航色彩,题目标签的不同,viwe,image等等目录构造page 能够看成小程序的顶层组件如果疾速创立4个文件,开发工具-新建页面/componentpage.json的配置语法 语法相似vuewxs 相似vue中的过滤器生命周期函数setData与双向数据绑定一些微信封装好的api,如 wx.showLoading事件告诉机制 公布订阅能够用第三方库mitt全局变量正则的创立写法不同路由跳转 跳转和重载的区别,页面栈概念留神单页面一个页面栈最多推动去10次,我这里用的wx.hideHomeButton() + wx.redirectTo(url)组件 如何应用第三方组件如何自定义组件组件的自定义属性 data-网络、缓存 wx.request的封装setStorageSync 设置缓存微信特有的一些货色 登录流程,wx.login 获取code给后盾受权相干 提测与上线注意事项线上版拜访的接口必须是https且在微信平台配置过白名单预览和体验版能够临时在微信中点击小程序右上角的三个点,开启调试模式绕过 测试中,本地编译预览和体验版区别本地编译的预览的每次都得更新二维码,体验版只有上传上去就行了,微信会自动更新小程序体验版 坑坑坑(从大到小)1.echarts 小程序中应用echart坑真心多层级问题:echarts层级最高,所以弹出层不会笼罩它,解决办法是弹出层呈现的时候先销毁,弹出层敞开再初始化.留神不要用hidden,因为这里有个Bug,echarts显隐管制的话,绑定的事件会生效初始化机会问题:有可能接口数据申请完,挂载echarts上数据的时候,echarts还未初始化胜利(偶发),我这里应用的是公布订阅解决这个问题。echart容器肯定要设置初始宽高,否则有可能渲染不进去真机调试渲染不进去2.自定义tabbar因为咱们有权限管制tab,所以我采纳的自定义tabbar,原本想着应用微信自带的自定义tabbar,省点代码,没想到切换的时候很大几率tabbar隐没。辣鸡微信,节约爹一天工夫,调试的时候曾一度狐疑自我,没有get到点上(switchtab),最初第二天我本人写了一个自定义组件tabbar解决的。最初给个问题链接https://developers.weixin.qq.... 3.hideloading 会把showtoast的toast也消掉这个很不好,拦截器拦挡到谬误,showtoast了,而后程序走到了异步申请promise的finally那hideloading,造成toast秒关,这个我采纳让showtoast异步执行 const { showToast} = wx;Object.defineProperty(wx, 'showToast', { configurable: true, enumerable: true, writable: true, value(obj) { if (obj.async) { delete obj.async; setTimeout(() => { showToast.call(this, obj); }, 500); }else{ showToast.call(this, obj); } }})4. promise没有finally办法,须要本人实现Promise.prototype.finally =function (callback) { let P =this.constructor; return this.then( value => P.resolve(callback()).then(() => value), reason => P.resolve(callback()).then(() => {throw reason }) );}5. slot不带作用域插槽性能序幕因为篇幅限度,小程序开发就先说道这了,有什么问题能够在评论区指出。 ...

December 20, 2020 · 1 min · jiezi

关于小程序:微信小程序-显示弹框引发背景下页面滚动问题滚动穿透问题移动端同理

微信小程序 弹框引发背景下~~~~页面滚动问题(滚动穿透问题)挪动端同理之前遇到这个滚动传统问题始终没解决,最近终于抽出工夫钻研了一下,解决一个心头大患,啊啊啊~开心下载demohttps://github.com/zhangrui-1... 体现景象:在弹出遮罩背景和弹出内容时,滑动弹出内容,背景上面的内容也跟着滑动(具体查看景象https://github.com/zhangrui-1...) 解决思路:将底页面设置position:fixed,且要设置以后弹框时所处地位的top值 H5页面获取形式:scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; 小程序获取形式: wx.createSelectorQuery().select('#normal').boundingClientRect((rect) => { console.log(rect) scrollTop = rect.top console.log() this.setData({ ispopCoupon:true, scrollTop:scrollTop, noScroll:position:fixed;top:${scrollTop}~~~~ }) }).exec()`当然在滚动事件时也须要在设置一下H5加一个 window.addEventListener 监听滑动小程序onPageScroll事件

December 17, 2020 · 1 min · jiezi

关于小程序:小程序云开发持续交付和质量管控下

保障交付效率和品质把控是一项业务久远、稳固倒退的必经之路,来自微信领取的张洪晖在第二届小程序云开发技术峰会上就介绍了高速倒退的业务团队如何利用小程序云开发搞定继续交付和品质管控。 在上半局部文章中,作者次要介绍了微信领取境外团队利用云开发的背景,以及在继续交付侧做出的摸索实际。下半局部文章将聚焦于团队在品质管控中做出的尝试。 为什么须要品质监控先来介绍一下金融业务下的品质难题,很多团队可能常常会遇到一些品质问题。大家能够思考一下,在不把控品质的状况下谋求效率是否有实质性作用? 对于这个问题,以微信领取为例:微信领取是一个传统金融与互联网的联合。传统金融的稳定性要求比拟高,肯定水平上能够就义效率来换取稳定性,而互联网谋求的就是效率,当品质和效率进行联合的时候,对团队要求是十分高的。 举个例子,咱们团队小程序的公布节奏是均匀每周一个版本,每天均匀 新增800行代码、批改300行代码。业务压力来了之后,开发同学进行代码的变更时就波及到品质管控问题,这反过来可能会影响效率。例如,在进行重构和代码的修修补补时,其余需要的涌入,会加大整个业务的压力,长此以往,很可能进入到一种负循环中。 那么,如何破局?惯例思路下,业务压力大,首先想到就是通过减少人力来缓解业务压力,但因为每个人的代码格调不尽相同,人员增多也减少了代码的管控难度。而在重构方面,团队通过继续交付的流水线、重构克制效率的损失,但反过来,也存在重构某些代码影响线上业务的危险。 由此,为了解决这个痛点,团队提出了十分重要的一点——品质管控。 品质监控上面重点介绍下团队是如何省心又省力地做好品质管控。 这是团队在优化品质管控前的状况,总体来说,流程分为需要、开发、公布和线上阶段。概括来说,能够分为事先、事中和预先三个阶段。 对于金融业务来说,这真的够了吗?事实上,以上流程存在肯定的隐患,以小程序的底层架构为例,置信对小程序开发相熟的同学十分理解,图中的逻辑层和渲染层是拆散的,也即逻辑层无奈拿到渲染层的后果,没有方法对渲染层进行监控。 假如在这种状况下,账单和资金展现呈现了问题,肯定会引起用户的投诉,那么,如何防备这种状况的产生? 首先,团队便想到做标准化的组件,其中最次要的就是金额渲染的组件,不单要做,还要思考开发同学有没有真正用起来。为此,在开发流程当中,会对敏感字段进行一些扫描,来看一下组件是否有被正确的应用。 下图左侧是一个例子,咱们通过关键字检测到这段代码没有正确应用金额渲染的组件,就立刻进行了代码的提交。并且,为了加强检测的力度,团队也会在流水线中进行关键字的扫描。 动态金额渲染查看肯定水平上解决了咱们的问题,然而它足够平安吗?当然不是的。试想,如果关键词中的 money 拼错了,写成了 mnoey,是不是就被漏掉了?另外咱们 UI 也有可能溢出,导致账单或资金展现出错的危险。 这里团队就引入了一个 UI 自动化截屏的计划,底层基于小程序开发者工具的 automator 的能力,实现主动地拉起开发者工具,并且跳转到对应的页面,而后对数量进行拦挡(提前写好接口用例),在拦挡之后,会对页面进行滚动截屏,截下来的图片会进行图片的比对并归档,在归档之后,还会告诉产品和研发去进行审核。 举个例子,咱们用一个命令启动了开发者工具,在开发者工具启动之后,会启动模拟器,模拟器会依据咱们预设好的一个门路去跳转对应的页面,并主动进行滚动截屏。当咱们截完所有的页面后,会在本地将这些图片保留下来,以供比对和归档。 右边是咱们的旧截图,左边是咱们的新截图,两个截屏之间进行比照,两头是比照,发现底部的优惠券区域有所变动:新增了小红点。由此咱们就只需关怀本次变更是否有影响到这一块逻辑,如果有的话,须要及时排查问题。 这里就是方才讲到的品质管控的总体思路,是分为事先、事中和预先三个阶段进行。 总结最初,总结下团队为什么应用云开发,以及云开发到底给了咱们什么样的能力? 第一,云开发给了前端同学一个全栈开发的能力,同时对后端同学也是十分受害的,让后端能够更关注业务的稳定性。 第二,云开发成本非常低,具体包含低开发成本,低开发门槛和零运维老本。 第三,团队十分看重云开发的生态能力,包含接入了微信领取、COS 和 redis各种各样的能力套件,都反对开箱即用。 用上云开发之后,大家也能够思考一下是否有「用好」云开发呢?本次分享的内容次要集中在如何用云开发晋升效力,包含继续构建、继续公布 ABTest 方面,而在品质方面,咱们也会有灰度公布、自动化测试以及 UI 的主动截屏,另外,应用云开发的过程中也使用到了微信的公有链路,能够提供弱小的平安防刷能力。无论门路如何,这些指标都是一样的,最终都是为了更好地反对咱们业务的疾速迭代以及小步快跑。 心愿大家都能基于云开发这个研发平台,多思考,多尝试,站在云开发的“肩膀”去做出更多实用于本身业务的改进。 产品介绍云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为开发者提供高可用、主动弹性扩缩的后端云服务,蕴含计算、存储、托管等serverless化能力,可用于云端一体化开发多种端利用(小程序,公众号,Web 利用,Flutter 客户端等),帮忙开发者对立构建和治理后端服务和云资源,防止了利用开发过程中繁琐的服务器搭建及运维,开发者能够专一于业务逻辑的实现,开发门槛更低,效率更高。开明云开发:https://console.cloud.tencent.com/tcb?tdl_anchor=techsite产品文档:https://cloud.tencent.com/product/tcb?from=12763技术文档:https://cloudbase.net?from=10004技术交换加Q群:601134960最新资讯关注微信公众号【腾讯云云开发】

December 15, 2020 · 1 min · jiezi

关于小程序:微信小程序开发入门与实践pdf

从上线以来,微信小程序的"触手可及"的体验,使得挪动互联网全面减速转型开发轻利用。 而对于开发者而已,小程序无疑是一个新的机会与方向! 越来越多的开发者被动学习,踊跃尝试,想在小程序开发畛域有所涉猎。 最近很多小伙伴问我要一些 小程序 相干的材料,于是我翻箱倒柜,找到了这本十分经典的电子书——《微信小程序开发入门与实际》。 材料介绍 《微信小程序开发入门与实际》应用几近实在的我的项目介绍小程序的各个API、组件用法,并附带一些小程序开发的教训、技巧等内容。除此之外,本书还提供局部服务器的PHP代码,次要供用户登录、校验、解析加密数据、模板音讯、微信领取等性能调用。全书内容丰盛、重视实战,解说通俗易懂。适宜小程序开发人员、培训机构和企业外部培训应用。 如何获取? 1.辨认二维码并关注公众号「Java后端技术全栈」; 2.在公众号后盾回复关键字「928」。

December 14, 2020 · 1 min · jiezi

关于小程序:小程序~订阅消息

介绍: 音讯能力是小程序能力中的重要组成,咱们为开发者提供了订阅音讯能力,以便实现服务的闭环和更优的体验* 订阅音讯推送地位: 服务告诉* 音讯订阅下发条件: 用户自主订阅* 订阅音讯卡片跳转能力: 点击查看详情页可跳转到小程序的页面步骤: 1: 获取模版ID 登录 [https://mp.weixin.qq.com](https://mp.weixin.qq.com/) 获取模板,如果没有适合的模板,能够申请增加新模板,审核通过后可应用。 模版受限于小程序的类型的2: 获取下发权限 小程序端音讯订阅接口 wx.requestSubscribeMessage * 一次性订阅&永久性订阅模版Id不能同时应用 * 订阅列表接口中的tmplIds, 必须为用户未订阅的内容, 如果为数组则显示订阅列表 * 如果用户的订阅总开关是敞开的,即mainSwitch为false 2.1: 可获取用户对相干模板音讯的订阅状态 wx.getSetting * 获取用户曾经订阅过音讯 * 获取服务端订阅音讯的模版Id -> restful -> array * 比照服务器已有的音讯模版 -> globalData * 用户未开启订阅音讯 -> return * 用户开启订阅音讯 -> 未设置任何订阅音讯 * 用户开启订阅音讯 -> 曾经有了局部设置 -> reject、accept 2.1.1: 受权信息 <button open-type="getUserInfo"/>等进行触发 2.1.2: 间接调起客户端小程序设置界面 wx.openSetting 点击事件触发3: 调用接口下发订阅音讯 服务端音讯发送接口 subscribeMessage.sendweb: 订阅状态? ...

December 12, 2020 · 2 min · jiezi

关于小程序:1分钟部署一个属于自己的网站借助云开发静态网站部署属于自己的网站

明天来教大家部署一个属于本人的第一个动态网站,因为这里借助小程序云开发的动态服务器资源,所以能够轻松的实现本人网站的部署,部署完当前能够在电脑浏览器,手机浏览器,微信公众号外面展现。老规矩,先看效果图简略起见,我这里写一个最简略的html动态网页 而后把这个网页部署到云开发动态网站上微信上拜访成果如下手机浏览器上拜访如下这也就意味着,咱们的网站能够供用户在任何中央拜访。上面就来教大家如何疾速的部署一个属于本人的网站。 一,开明云开发这里云开发开明开明云开发咱们借助小程序开发者工具来实现疾速开明。 1-1,注册小程序这里我就不再多说了,只有注册过小程序的appid才能够开明云开发 咱们注册好小程序后,就能够拿到appid了,如上图 1-2,创立一个小程序我的项目小程序我的项目的创立,我这里不再多说,我后面小程序基础课里有讲过很多遍。《小程序根底学习》 这里强调一点,就是创立小程序我的项目时肯定要用咱们本人的appid不要用测试号。在这里插入图片形容如果你一开始是用测试appid创立的,也能够通过上图的形式更换成本人的小程序的appid。 1-3,开明云开发这里是云开发开明,我就不做过多解说了,我云开发课程里也讲过很多遍。大家能够去翻看下 只须要点击开发者工具里的云开发按钮,跟着提醒一步步操作就能够疾速开明云开发。 二,开明动态网站性能咱们下面云开发开明好当前,就能够在这里疾速开明动态网站了。点击当前,间接点击开明即可这时候开明有个条件咱们必须依照要求扭转本人小程序的付费形式,把咱们的付费形式改成按量付费即可。这个时候咱们的动态网站性能就开明胜利了。开明胜利当前如下图。这个时候咱们就能够把咱们开发好的动态网页上传到网站供他人拜访了。 三,部署网站咱们的动态html如下 点击上传文件,把咱们的index.html文件上传到动态网站这样就代表上传胜利了。 拜访咱们的网站下面把网页部署胜利当前,咱们就能够通过云开发为咱们创立的默认网址来拜访了。 点击上图所示的详情,就能够拿到拜访咱们网站的网址如下上图箭头所示的网址,就是咱们网页的拜访网址。如果你的html是以index命名的,咱们应用云开发为咱们调配的域名,就能够间接拜访咱们的网站。study-gas4x-1258760189.tcloudbaseapp.com 就是云开发为我调配的网站域名,当前用户就能够间接通过这个域名拜访咱们的网站了。其实到这里咱们就能够胜利的部署属于咱们本人的网站了,无非就是你网页写的比石头哥再难看些。 然而有些同学感觉官网给调配的域名太长,不好记,想应用本人的域名。那么咱们该如何配置本人的域名呢? 四,配置域名(选看)其实后面3步就能够胜利的部署本人的网站了,如果你有本人的域名,并且也胜利的备案了,再来跟着石头哥学习这一节。如果没有本人的域名,那么你就要先去注册本人的域名,并备案了。所以这一节作为一个选学。 4-1,在网站配置里增加本人的域名如我在这里点击增加域名,而后增加本人的备案域名。然而咱们这里要想https来平安拜访,就必须配置本人的ssl证书。点完当前,咱们这里能够间接申请收费证书。收费证书有效期1年,1年后咱们再从新申请新的证书就能够了,所以这里收费的就够用了。如实的填写本人的备案域名和其余信息。提交完材料,咱们这里须要验证下本人的域名,验证形式抉择DNS就能够点位DNS验证,咱们就须要给咱们的域名配置拜访的解析值了(这里的知识点比拟深奥,大家须要本人课下恶补下域名解析的相干知识点)如果不想学习,间接依据提醒配置也行。配置好当前,就能够点击验证先进行验证了验证通过后,能够看到如下云开发控制台也会显示部署中,咱们急躁期待部署就能够了。启动胜利会有如下标识尽管曾经启动胜利,咱们如果想通过本人的域名拜访本人的云开发动态网站,还须要配置下CNAME进行重定向,也就是拜访咱们域名的时候咱们要重定向到云开发给咱们调配的域名。这里了解起来有点艰涩,官网给的文档也是没有讲明确,我也是试了很多遍才晓得是这样配置的。这里都配置好当前,咱们就能够间接通过本人的域名拜访网站了。大家也能够去拜访下石头哥的云开发动态网站试一试。 到这里咱们的网站部署就讲完了,前面我会用vue写一些炫酷的网站,而后部署到线上供大家参观。 产品介绍云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为开发者提供高可用、主动弹性扩缩的后端云服务,蕴含计算、存储、托管等serverless化能力,可用于云端一体化开发多种端利用(小程序,公众号,Web 利用,Flutter 客户端等),帮忙开发者对立构建和治理后端服务和云资源,防止了利用开发过程中繁琐的服务器搭建及运维,开发者能够专一于业务逻辑的实现,开发门槛更低,效率更高。开明云开发:https://console.cloud.tencent.com/tcb?tdl_anchor=techsite产品文档:https://cloud.tencent.com/product/tcb?from=12763技术文档:https://cloudbase.net?from=10004技术交换加Q群:601134960最新资讯关注微信公众号【腾讯云云开发】

December 11, 2020 · 1 min · jiezi

关于小程序:小程序~内容安全

1:背景: 对于小程序端或者其余端的ugc(用户产生的文本内容[文本、图片...])是须要退出内容的平安校验的。参考链接(https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/sec-check/security.imgSecCheck.html)2:利用场景: 1: 文本 查看一段文本是否含有守法违规内容 用户个人资料违规文字检测 媒体新闻类用户发表文章,评论内容检测 游戏类用户编辑上传的素材等2: 图片 校验一张图片是否含有守法违规内容 图片智能鉴黄 敏感人脸识别:用户头像;媒体类用户文章里的图片检测;社交类用户上传的图片检测等e3: 接口对接(https): 3.1: config的配置 const REDIS = { host: process.env.REDIS_HOST || 'www.exapmle.com', port: process.env.REDIS_PORT || 'xxxx', password: process.env.REDIS_PASS || 'xxxxxxxx' } const AppID = 'xxxxxxxxxxxx' const AppSecret = 'xxxxxxxxxxxx' export { REDIS, AppID, AppSecret }3.2: redis的配置(redisConfig) import redis from 'redis' import { promisifyAll } from 'bluebird' import config from './index' const options = { host: config.REDIS.host, port: config.REDIS.port, password: config.REDIS.password, detect_buffers: true, retry_strategy: function (options) { if (options.error && options.error.code === 'ECONNREFUSED') { return new Error('The server refused the connection') } if (options.total_retry_time > 1000 * 60 * 60) { return new Error('Retry time exhausted') } if (options.attempt > 10) { return undefined } return Math.min(options.attempt * 100, 3000) } } let client = promisifyAll(redis.createClient(options)) client.on('error', (err) => { console.log('Redis Client Error:' + err) }) const setValue = (key, value, time) => { if (!client.connected) { client = promisifyAll(redis.createClient(options)) } if (typeof value === 'undefined' || value == null || value === '') { return } if (typeof value === 'string') { if (typeof time !== 'undefined') { client.set(key, value, 'EX', time, (err, result) => { }) } else { client.set(key, value) } } else if (typeof value === 'object') { Object.keys(value).forEach((item) => { }) } } const getValue = (key) => { if (!client.connected) { client = promisifyAll(redis.createClient(options)) } return client.getAsync(key) } export { setValue, getValue }3.3: 获取小程序全局惟一后盾接口调用凭据(`access_token`) import axios from 'axios' import { getValue, setValue } from 'redisConfig' import config from 'config' export const wxGetAccessToken = async (flag = false) => { let accessToken = await getValue('accessToken') if (!accessToken || flag) { const result = await axios.get(`https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${config.AppID}&secret=${config.AppSecret}`) if (result.data === 200) { await setValue('accessToken', result.data.access_token, result.data.expires_in) accessToken = result.data.access_token if (result.data.errcode && result.data.errmsg) { logger.error(`Wx-GetAccessToken Error: ${result.data.errcode} - ${result.data.errmsg}`) } } } return accessToken }3.4: 内容平安 export const wxMsgCheck = async (content) => { const accessToken = await wxGetAccessToken() try { const result = await axios.post(`https://api.weixin.qq.com/wxa/msg_sec_check?access_token=${accessToken}`, { content }) if (result.status === 200) { return result.data } else { logger.error(`wxMsgCheck Error: ${result.statis}`) } } catch (error) { logger.error(`wxMsgCheck Error: ${error.message}`) } }3.5: 文本平安校验 import { wxMsgCheck } from 'WxUtils' async addWxPost (ctx) { const { body } = ctx.request const content = body.content const result = await wxMsgCheck(content) ... }3.6: 图片平安校验? 3.6.1: 文件目录查看 import fs from 'fs' import path from 'path' const getStats = (path) => { return new Promise (resolve => { fs.stat(path, (err, stats) => err ? resolve(false) : resolve(stats)) }) } const mkdir = (dir) => { return new Promise((resolve) => { fs.mkdir(dir, err => err ? resolve(false) : resolve(true)) } } const dirExists = async (dir) => { const isExists = await getStats(dir) // 如果该门路存在且不是文件,返回 true if (isExists && isExists.isDirectory()) { return true } else if (isExists) { // 门路存在,然而是文件,返回 false return false } // 如果该门路不存在 const tempDir = path.parse(dir).dir // 循环遍历,递归判断如果下级目录不存在,则产生下级目录 const status = await dirExists(tempDir) if (status) { const result = await mkdir(dir) console.log('TCL: dirExists -> result', result) return result } else { return false } } const getHeaders = (form) => { return new Promise((resolve, reject) => { form.getLength((err, length) => { if (err) { reject(err) } const headers = Object.assign( { 'Content-Length': length }, form.getHeaders() ) resolve(headers) }) }) } 3.6.2: 图片内容校验 import fs from 'fs' import path from 'path' import del from 'del' import { dirExists } from '/Utils' import { v4 as uuidv4 } from 'uuid' import sharp from 'sharp' import FormData from 'form-data' import pathExists from 'path-exists' export const wxImgCheck = async (file) => { const accessToken = await wxGetAccessToken() let newPath = file.path const tmpPath = path.resolve('./tmp') try { // 1.筹备图片的form-data // 2.解决图片 - 要检测的图片文件,格局反对PNG、JPEG、JPG、GIF,图片尺寸不超过 750px x 1334px const img = sharp(file.path) const meta = await img.metadata() // 分辨率 if (meta.width > 750 || meta.height > 1334) { await dirExists(tmpPath) newPath = path.join(tmpPath, uuidv4() + '.png') await img.resize(750, 1334, { fit: 'inside' }).toFile(newPath) } const stream = fs.createReadStream(newPath) const form = new FormData() form.append('media', stream) const headers = await getHeaders(form) const result = await axios.post(`https://api.weixin.qq.com/wxa/img_sec_check?access_token=${accessToken}`, form, { headers }) const stats = await pathExists(newPath) if (stats) { await del([tmpPath + path.extname(newPath)], { force: true }) } if (result.status === 200) { if (result.data.errcode !== 0) { await wxGetAccessToken(true) await wxImgCheck(file) return } return result.data } else { logger.error(`wxMsgCheck Error: ${result.statis}`) } } catch (error) { const stats = await pathExists(newPath) if (stats) { await del([tmpPath + path.extname(newPath)], { force: true }) } logger.error(`wxMsgCheck Error: ${error.message}`) } } 3.6.3: import { wxImgCheck } from '/WxUtils' async uploadImg (ctx) { const file = ctx.request.files.file const result = await wxImgCheck(file) ... } 4: web ...

December 10, 2020 · 5 min · jiezi

关于小程序:排查指南-当-mPaaS-小程序提示应用更新错误1001时

** 问题形容:APP 启动 mPaaS 小程序弹出 toast 信息:"利用更新谬误"。 起因剖析调用MDS小程序更新接口之后,没有拉到对应的小程序信息,就会返回1001。 mPaaS 框架在关上一个小程序利用前,首先须要获知该小程序的根本信息,因而客户端会被动通过 RPC 申请和服务端公布信息对不上。如果拉取小程序失败,或没有命中要关上的指标利用,APP会提醒谬误 "利用更新谬误"。 针对这类问题,排查方向包含:可能的起因是服务端没公布(控制台未公布上传的小程序或者刚刚公布服务端还没收到刚公布的小程序)、客户端版本不在范畴内、或者是申请信息和服务端公布的规定不匹配导致。 排查思路1.过滤日志 在AS控制台过log日志信息 DynamicRelease。查看UnionResourceInfo对象爱护Item信息。 服务端获取到小程序的根本信息,有 item 信息: 2.查看小程序的状态 小程序状态:待发布、已完结公布时;服务端都不能失常拉取到小程序信息: 3.创立小程序时,最低版本输出0.0.0.0,最高版本不填写 最低版本输出0.0.0.0,最高版本不填写示意无限大;版本号对应Android我的项目versionName 值; 最低版本号<以后APP版本号<最高版本号时,能力失常的拉取 mPaaS 小程序; 若不在这个范畴APP启动小程序时就会拉取失败,报 "利用更新谬误"。 留神:正式版本请依据理论的客户端范畴进行设置。 工单帮助如果仍然不能解决问题,请筹备好相干问题的复现 Demo 工程,通过阿里云工单零碎分割 mPaaS 售后技术支持。 .png") 原文链接本文为阿里云原创内容,未经容许不得转载。**

December 10, 2020 · 1 min · jiezi

关于小程序:排查指南-当-mPaaS-小程序提示应用更新错误1001时

问题形容:APP 启动 mPaaS 小程序弹出 toast 信息:"利用更新谬误"。 起因剖析调用MDS小程序更新接口之后,没有拉到对应的小程序信息,就会返回1001。 mPaaS 框架在关上一个小程序利用前,首先须要获知该小程序的根本信息,因而客户端会被动通过 RPC 申请和服务端公布信息对不上。如果拉取小程序失败,或没有命中要关上的指标利用,APP会提醒谬误 "利用更新谬误"。 针对这类问题,排查方向包含:可能的起因是服务端没公布(控制台未公布上传的小程序或者刚刚公布服务端还没收到刚公布的小程序)、客户端版本不在范畴内、或者是申请信息和服务端公布的规定不匹配导致。 排查思路1.过滤日志 在AS控制台过log日志信息 DynamicRelease。查看UnionResourceInfo对象爱护Item信息。 服务端获取到小程序的根本信息,有 item 信息: 2.查看小程序的状态 小程序状态:待发布、已完结公布时;服务端都不能失常拉取到小程序信息: 3.创立小程序时,最低版本输出0.0.0.0,最高版本不填写 最低版本输出0.0.0.0,最高版本不填写示意无限大;版本号对应Android我的项目versionName 值; 最低版本号<以后APP版本号<最高版本号时,能力失常的拉取 mPaaS 小程序; 若不在这个范畴APP启动小程序时就会拉取失败,报 "利用更新谬误"。 留神:正式版本请依据理论的客户端范畴进行设置。 工单帮助如果仍然不能解决问题,请筹备好相干问题的复现 Demo 工程,通过阿里云工单零碎分割 mPaaS 售后技术支持。 下期预报mPaaS-iOS 小程序打不开问题该如何排查? 撰文:刘启洋 - END - 延长浏览 排查指南 | mPaaS 小程序提醒“网络不给力”时该如何排查?开发技巧 | mPaaS 小程序自定义事件,如何勾销注册?登陆!Let's Start Coding 理解「mPaaS 小程序」更多资讯

December 9, 2020 · 1 min · jiezi

关于小程序:微信小程序和支付宝小程序对比

微信小程序和支付宝小程序比照获取自定义组件语法比照支付宝和微信的自定义组件语法简直一样,当咱们开发实现一个组件,在理论页面中援用时,须要获取到组件的实例。 支付宝获取自定义组件实例: <cxloading ref='saveLoading' /> saveLoading(ref){this.cxLoading = ref;} //支付宝组件须要通过办法获取微信获取自定义组件实例: <cxLoading id='cxLoading'></cxLoading> this.cxLoading = this.selectComponent("#cxLoading"); //微信自定义组件通过id获取DOM父子组件通信语法比照支付宝子传父:(on结尾) 子:this.props.onRefreshFlight("aaa"); 父:<cxmodal ref='saveModal' onRefreshFlight="bbb">微信子传父:(triggerEvent触发) 子:this.triggerEvent("refreshFlight","aaa"); 父:<cxmodal id='cxmodal' bind:refreshFlight="bbb">支付宝父传子:(子组件用this.props获取) 父:<cxmodal flight_date='{{currentFlight.flight_date}}'> 子:this.props.flight_date微信父传子:(间接获取) 父:<cxmodal flight_date='{{currentFlight.flight_date}}'> 子:this.data.flight_date支付宝开发工具差异关联利用:详情抉择关联以后利用,否则无奈受权应用自定义组件时,开发工具须要抉择component2编译应用支付宝云开发须要管理员受权并开明云产品,开明severless服务,创立云服务空间,创立云资源并在IDE中关联Serverless微信云开发间接在创立利用的时候抉择云开发模式即可应用云开发比拟罕用的js过滤惟一值/去重,并生成新数组 var a = [1,1,2,3] var b = [...new Set(a)]格式化json JSON.stringify({},null,'\t')字符串数组转为整型数组["1","2","3"]===>[1,2,3] arr = arr.map(Number) //留神:肯定要从新赋值,因为map会返回新数组,forEach会批改原数组

December 7, 2020 · 1 min · jiezi

关于小程序:山东标梵小程序开发之分享小程序

对于一个产品来说,分享的重要性显而易见。前言小程序的顶部有一个胶囊按钮,点击第一个按钮便会在屏幕下方弹出菜单列表,其中变蕴含了分享相干的操作,如下图所示: null 当咱们创立一个小程序工程之后运行,进行如上操作之后会发现,此时底部菜单中的分享性能是被禁用的。 一、启用分享性能旁边的扫地大爷微笑道:小朋友,这问题好解决,只有传递给Page的Object对象中提供了onShareAppMessage办法,那么运行以后页面便可点击右上角菜单按钮进行分享,并且如果要反对分享到朋友圈的话,只须要提供onShareTimeline办法即可! Page({ //定义此办法之后,点击右上角按钮弹出的菜单中"发送给敌人"菜单变为可点击onShareAppMessage: function (param) { },//定义此办法之后,点击右上角按钮弹出的菜单中"分享到朋友圈"按钮变为可点击onShareTimeline:function(){ }})这问题的确很简略,连扫地的大爷都会,不过说的对也不全对,但总感觉这大爷深藏不露,得好生招呼。 “哇塞,大爷您真棒,一看您就是深藏功与名,您能多说一点分享性能方面的吗?” “小伙子,看你人不错,挺好学的,大爷我就多跟你唠嗑几句。” 1、发送给敌人(分享)官网材料[1] 只有定义了onShareAppMessage处理函数,右上角菜单才会显示“转发(发送给敌人)”按钮 该函数接管一个Object对象参数,对于参数字段的介绍如下表:字段名 | 类型 | 阐明 | |------|------------|------------| | from | String | 转发事件起源。button:页面内转发按钮;menu:右上角转发菜单 | | target | Object | 如果 from 值是 button,则 target 是触发这次转发事件的 button,否则为 undefined | | webViewUrl | String | 面中蕴含web-view组件时,返回以后web-view的url | 从from和target两个字段中咱们能够看到,除了通过右上角胶囊菜单入口处进行分享外,咱们还能够通过页面内的button进行分享操作。 能够通过该事件处理函数返回一个对象,用于形容自定义的分享内容,从根底库2.8.1版本开始,分享图片反对云图片; 对于返回的对象介绍如下表 字段名 | 阐明 | 默认值 | |------|------------|------------| | title | 转发题目 | 以后小程序名称 | | path | 转发门路 | 以后页面 path ,必须是以 / 结尾的残缺门路 | | imageUrl | 自定义图片门路,能够是本地文件门路、代码包文件门路或者网络图片门路。反对PNG及JPG。显示图片长宽比是 5:4。| 应用默认截图 | ...

December 4, 2020 · 1 min · jiezi

关于小程序:开发技巧-mPaaS-小程序自定义事件如何取消注册

在咱们开发 mPaaS 小程序的过程中,如果已有小程序 API 或事件无奈满足开发需要,您也能够自行扩大。小程序调用原生自定义 API1.客户端自定义 API 并注册。 2.小程序调用。 1. let call = my.call('tinyToNative', { 2. param1: 'p1aaa', 3. param2: 'p2bbb' 4. }, (result) => { 5. console.log(result); 6. my.showToast({ 7. type: 'none', 8. content: result.message, 9. duration: 3000, 10. }); 11. })那么咱们如何勾销注册呢?如下代码: 1. //勾销注册 2. call.remove(); 3. call = undefined;原生利用向小程序发送自定义事件1.小程序注册事件 1. let on = my.on('www',()=>{ 2. my.alert({ 3. title: '1212', 4. content: '123', 5. buttonText: '123123', 6. success: () => { 8. }, 9. fail: () => { 11. }, 12. complete: () => { 14. } 15. }); 16. })2.客户端发送事件 ...

December 3, 2020 · 1 min · jiezi

关于小程序:小程序Mixin

原理重写小程序的Page办法,合并Page办法的默认参数中的属性、办法和生命周期等 准则属性和办法会进行笼罩,以后页面申明的属性和办法会笼罩mixin中的属性和办法,生命周期函数不会进行笼罩,执行程序为全局mixin>独自mixin>当前页生命周期函数 具体操作创立一个mixins.js// 把原本的Page办法缓存下来const ori_page = Pageconst lifecycle = ['onLoad', 'onReady', 'onShow', 'onHide', 'onUnload', 'onPullDownRefresh', 'onReachBottom', 'onShareAppMessage', 'onPageScroll']let globalMixin = null // 全局混入// 全局mixin办法wx.mixin = config => { if (isType(config, 'object')) { globalMixin = config }}// 重写Page办法Page = config => { let mixins = config.mixins // 退出全局mixin,首先执行全局的 if(globalMixin) { (mixins || (mixins = [])).unshift(globalMixin) } if(isType(mixins, 'array') && mixins.length > 0) { // 删除config的mixins属性 Reflect.deleteProperty(config, 'mixins') // 把mixins中的货色,混入到config外面去 merge(mixins, config) } // 调用默认的Page办法进行初始化 ori_page(config)}function merge(mixins, config) { mixins.forEach(mixin => { if(isType(mixin, 'object')) { Object.keys(mixin).forEach(key => { if(key === 'data') { // 合并data config.data = Object.assign({},mixin[key],config[key]) }else if (lifecycle.includes(key)) { // 缓存以后页面的生命周期函数 let ori_lifecycle = config[key] config[key] = function() { // arguments对象转数组 let arg = Array.prototype.slice.call(arguments) // 执行minxin的生命周期函数 mixin[key].call(this, arg) // 执行当前页的生命周期函数 ori_lifecycle && ori_lifecycle.call(this, arg) } }else { // 合并methods config[key] = mixin[key] } }) } })}//判断类型函数function isType(target, type) { let targetType = Object.prototype.toString.call(target).slice(8, -1).toLowerCase() type = type.toLowerCase() return targetType === type}引入mixins.js// aap.jsimport './mixins'申明一个mixinmodule.exports = { test: { data: { msg: 'Hello world' } }}应用import {test} from './someMixins'Page({ mixins: [test]})

December 2, 2020 · 1 min · jiezi

关于小程序:如何在云托管中操作云开发数据库

作为新一代云原生利用引擎(App Engine 2.0),云托管领有无痛迁徙、自动化弹性扩缩容、免运维、反对跨平台部署和联动云开发能力等劣势,让开发者能够不限语言框架,低成本迁徙上云开发,无效晋升开发效率。 那么,是否在云托管中操作云开发的根底能力云数据库呢? 当然能够!下方是部署教程: 筹备工作开明 CloudBase 云开发环境留神:包年包月环境无奈开明云托管第 1 步: 开明登录 云开发 CloudBase 控制台,抉择一个环境,进入云托管治理页面,单击「立刻开明」。 第 2 步: 配置云托管所在地区云托管以后已凋谢上海和广州地区 ,更多地区将陆续凋谢。 云托管网络网络设置包含 公有网络 VPC 和 子网。 以环境为维度,云托管中创立的所有服务,都将部署在这同一个 VPC 之中,且胜利开明云托管后不反对更换网络设置。 网络设置分为如下两种模式: 零碎默认配置云托管将为您主动新建一个 VPC 和子网,并将其绑定您以后的云开发环境。 后续您在以后环境下的云托管中创立的所有服务,都将被部署到这个 VPC 和子网中。 此过程无需您手动进行任何设置。 后续您能够在 公有网络控制台 中查看并治理这个由云托管主动创立的 VPC 及子网,也能够将更多云资源(例如云服务器,云数据库等)部署在这个 VPC 之内,以便这些云资源进行互动。 自定义配置如果您之前曾经创立过公有网络 VPC 和子网,并在其中曾经部署有其余云资源(例如云服务器、云数据库等),且须要您的云托管利用与这些已存在的云资源进行互动,则您能够抉择「自定义配置」,抉择具体的 VPC 和子网。 开明胜利单击「提交」,状态变为开明中 ,请期待数秒 。 开明胜利后,您将主动跳转到云托管的服务列表页面。 至此您曾经胜利开明后 云托管 服务,您能够单击「新建服务」开始部署。 新建服务单击「新建服务」,填写服务名称、备注信息(选填)后,单击「提交」。 搭建node环境本文中应用 koa<span> </span>来进行搭建,应用以下依赖。 koakoa-router koa-body koa-onerror 初始化我的项目mkdir datamanage && cd datamanagetouch index.js && npm init咱们会取得一个如下构造目录 ...

December 1, 2020 · 2 min · jiezi

关于小程序:HARDOX450

HARDOX450是瑞典SSAB OXELOSUND的HARDOX悍达系列耐磨钢;具备布氏硬度450HB的耐磨钢板,具备良好的冷弯性,次要利用于抗磨损工况。HARDOX450具备十分好的可焊性HARDOX450利用于自卸车车厢,集装箱,破碎机,筛板,入料器,给料漏斗,提升机,刃板,输送机,挖斗,刀板,齿轮,链轮等HARDOX450产品利用:因为兼具高硬度、高强度以及高韧性,对于那些磨损重大的场合,HARDOX悍达耐磨板显然是现实之选。钢板的高耐磨性缩短了自卸车车身、挖掘机的铲斗、破碎机以及相似设施的使用寿命。HARDOX450悍达耐磨钢板规格范畴:4mm~80mm厚,宽2000mm,长6000mm。

November 20, 2020 · 1 min · jiezi

关于小程序:HARDOX550

悍达耐磨钢HARDOX550是《SSAB OXELOSUND》一种耐磨钢板。按其硬度分:HARDOX400、HARDOX450、HARDOX500、HARDOX550、HARDOX600等。悍达耐磨钢HARDOX550是一种均匀硬度为550HBW的耐磨钢板,被利用于高磨损的场合。其次要针对应用高锰钢或布氏硬度为500的耐磨钢板的用户和制造商。当从HARDOX500钢板降级到该产品时,在布氏硬度上进步了50个单位,在不损失钢板韧性的状况下缩短钢板使用寿命,从而可能禁受重大的磨损。它适宜在强磨损环境中工作,如高强度矿石和腐蚀性资料。HARDOX550布氏硬度为HBW525-575,可供货厚度为10-50mm;可利用在衬板、螺栓固定的刃板、耐磨条、提升机、溜槽、入料器、筛板、破碎机、碎料机、锤头等。

November 18, 2020 · 1 min · jiezi

关于小程序:测试文章测试使用

测试文章 本文由博客一文多发平台 OpenWrite 公布!

November 12, 2020 · 1 min · jiezi

关于小程序:小程序调用原生onShareAppMessage分享imageUrl参数是mp4格式怎么办

因为小程序调用onShareAppMessage的时候,imageUrl参数只能是图片格式,如果是mp4的话会展现不进去分享的图,这个时候怎么办呢? 能够使用阿里云oss视频截帧的形式,截取视频的某一帧作为图片传入和,就能够显示了! 以下是具体方法 onShareAppMessage: function (ops) { if (ops.from === 'button') { // 来自页面内转发按钮 console.log(ops.target)}let path = 门路.split('.')[门路.split('.').length - 1] == "mp4" ? 门路 + "?x-oss-process=video/snapshot,t_7000,f_jpg,w_800,h_600,m_fast" : 原门路return { title: 11223344, path:我的项目门路, imageUrl: path}} 在mp4前面拼上?x-oss-process=video/snapshot,t_7000,f_jpg,w_800,h_600,m_fast"即可 还有更多的解决办法 参考上面链接https://help.aliyun.com/document_detail/64555.html?spm=a2c4g.11186623.6.1408.3f1017f1DL079V&tdsourcetag=s_pcqq_aiomsg

November 9, 2020 · 1 min · jiezi

关于小程序:使用微信的扫码功能实现网站和小程序端用户账号统一

前言上一篇文章(应用小程序内的扫码性能实现网站和小程序端用户账号对立)发表后,微信凋谢社区大佬杨泉和拾忆别离给出了改良倡议,总结两人的倡议,就有了用户体验更好的办法,间接应用微信扫码来实现网站和小程序端用户账号对立。 先说一下前提,这次的办法都要用到扫一般链接二维码关上小程序来实现性能。在小程序后盾实现相干配置后,间接用微信扫码就会关上小程序指定页面个并将网址间接通过参数q带给页面。 小程序扫码登录网站在小程序后盾配置中,将二维码规定设置为附带登录码的网址(比方:http://www.abc.com/?loginCode=),小程序性能页面倡议设置为须要登录能力拜访的页面,小程序中这个页面间接拜访时须要判断是否登录,未登录状态要触发登录性能,登录后原样返回。 网页端业务逻辑不变,要登录时学生成一个惟一的登录码,比方:1234,而后放在小程序后盾配置的二维码规定网址中,比方:http://www.abc.com/?loginCode=1234,而后把这个网址生成二维码展现。 用户应用微信扫码后会主动关上小程序对应页面,并将二维码对应网址通过参数q带给页面,在onLoad事件中提取q参数并提取出其中的登录码,提交到后端接口,后端接口查问该登录码绑定的用户返回后在小程序端实现登录。网页端在展现二维码后,开启一个轮询,定时拜访后端接口查问该登录码的登录状态,在该登录码和小程序已登录用户绑定后实现网站上的用户登录。 小程序扫码登录小程序小程序后盾配置和上一个状况统一,网页端流程略有不同。网页上用户登录后展现带登录码的网址对应的二维码,同时将以后登录用户和登录码绑定。微信扫码关上小程序后提取出登录码,提交到后端接口,后端接口查问该登录码绑定的用户返回后在小程序端实现登录。还能够配合wx.login绑定以后用户的openid,实现主动登录。 网页端展现二维码后应用轮询查看登录码的登录状态,到期或者已登录后在网页端销毁二维码。小程序端也须要对以后是否已登录做一个判断并做好切换用户的相干性能。 总结总结下来,这个办法就是以登录码为媒介,通过在某一端将登录码和登录用户绑定后,在另一端实现同一用户的登录,理论应用中还须要思考登录码的有效期等。 以上办法流程不晓得会有什么危险,欢送大家的探讨。

November 1, 2020 · 1 min · jiezi

关于小程序:记-猜数字-程序

"""coding a gameguess what number is?"""from random import randint welcome="Welcome to the program'Guess number what'!"welcome+="nNow let us playing!"r=randint(1,10**3)trace=0 while trace<=4: # limit is 5 message=input('input a integer in range of 1 to 1000: ') trace+=1 # recording times of tryif message.lower()=='boss': print('Sir. the number is:'+str(r)) message=input('please input a number here, Sir. ')# control user-inputtingif message.isdigit()==False: # determine the character print('Please input a integer.') continueelif int(message)>1000: print('Please input a number between 1 and 1000.') continuemessage=int(message)if message==r: # if guess success print(str(r)+" !") print("Congratulations! You are succeed!") choice=input("Do you want to play again(Yes/No)") if choice.lower()=='yes': trace=0 r=randint(1,10**3) continue else: print('Thanking for playing.') breakelse: # if guess wrong if trace == 5: print('You are fail, Dearly.\nThe game over.') else: if message<r: if r-message<50: print('Try to add a number less than 50 ') elif r-message<100: print('Try to add a number between 100-50.') elif r-message<200: print('Try to add a number between 200-100') elif r-message<300: print('Try to add a number between 300-200') elif r-message<400: print('Try to add a number between 400-300') elif r-message<500: print('Try to add a number between 500-400') else: print( 'the difference between the two number is greater'+ ' than 500.' ) else: if message-r<50: print('Try to minus a number less than 50 ') elif message-r<100: print('Try to minus a number between 100-50.') elif message-r<200: print('Try to minus a number between 200-100') elif message-r<300: print('Try to minus a number between 300-200') elif message-r<400: print('Try to minus a number between 400-300') elif message-r<500: print('Try to minus a number between 500-400') else: print( 'the difference between the two number is greater'+ ' than 500.' )

October 31, 2020 · 2 min · jiezi

关于小程序:记一次微信小程序转字节跳动小程序的经验

作者:iplaycodex仓库:github、codePen博客:掘金、segmentfault、知乎、简书、博客园公众号:FEZONE分割我:iplaycodex@163.com特地申明:原创不易,未经受权不得对此文章进行转载或剽窃,否则按侵权解决,如需转载或开明公众号白名单可分割我,尊重原创尊重知识产权从我做起1. 前言公司最近有个需要是把曾经存在的用微信原生开发的微信小程序转为字节跳动小程序(以下简称头条小程序).因为给的开发工夫太短,重写根本不可能.遂 google 寻找能够不便疾速将微信小程序转为头条小程序的办法.现将整个过程演绎总结如下,不便没有做过的同学能够疾速上手,也不便本人记录.毕竟好忘性不如烂笔头~Orz... 2. 筹备工作1.申请字节跳动开发者账号2.申请头条小程序,配置相干账号权限3.小程序类别如果为非凡类别,确认是否须要相干资质4.配置相干域名,留神:必须为https5.主体认证申请6.申请开明领取7.下载开发工具3. 技术选型3.1. 如何做?<!--more-->下面曾经说了,从 0 开发是不可能的.所以咱们须要一个工具能够把小程序的源码转为头条小程序的代码.通过各方调研,有以下三种工具. 3.2. taro? uniApp? wx2bat?名称个性语法格调官网taro京东出品,一品种react的语法的小程序开发框架,反对一套代码转为微信小程序,H5,百度小程序,支付宝小程序,快利用,ReactNative,字节跳动小程序,QQ 轻利用.能够看到性能还是很弱小的,并且反对将原生开发的微信小程序转为taro小程序reacthttps://taro.aotu.io/uniApp也是声称一套代码打包为不同平台的货色,是一品种vue语法的实现.文档没有taro写得好,目前社区也没有其余框架成熟.理解不是很多,这里就不在赘述了vuehttps://uniapp.dcloud.io/wx2bat本人开发,应用最简略的一个工具,它次要做的事件:将 wxml 后缀名改为 ttml,将 wxss 后缀名改为 ttss,将 wxml 中 wx: 改为 tt,将 js 中 wx: 改为 tt:.同时反对转为百度小程序,支付宝小程序各个平台的原生语法https://www.npmjs.com/package/wx2bat总结:通过下面的剖析和总结,咱们能够得出一个论断:上述 3 种转换形式大略的实现思路如下所示: taro和uniApp wx2bat 1.能够看到应用wx2bat长处是比拟疾速不便,省了中间层的代码.而taro和uniApp则加了一层尽管比拟麻烦,然而却能够反对更多的平台.2.通过自己实际(只试验了 taro),发现错误很多,转换的代码编译后有漏文件的景象,而且谬误频频,不停的再解决BUG.思考到开发工夫不短缺,遂思考应用wx2bat来做转换. 实操下来发现老本较低,有一些简略的语法不兼容,略微修修改改我的项目就能够疾速的跑起来.遂采纳wx2bat来解决此次需要 3.3. 转换后果通过wx2bat咱们曾经能够不便疾速的将微信小程序转为头条小程序了.一些批改的细节参见我的github或者npm或者集体站,地址如下所示:iplaycodex 3.4. 遇到的坑尽管说头条小程序的90%的api 和微信小程序是差不多的,然而还是有一些差异性.须要咱们进行手动批改.现演绎总结如下所示:微信小程序的 .wxs 后缀文件在头条小程序中不反对!下面曾经说了头条小程序 .wxs文件不反对.那天然.wxs中申明的函数在模板中是不能应用的头条小程序不反对在 {{插槽}}中应用函数,更别说过滤器这种货色了,这一点特地坑!微信小程序互跳的相干逻辑代码须要删除!(即A 微信小程序关上 B 微信小程序)微信,wechat等微信的关键字要全副删掉,否则可能会审核被拒获取用户数据的按钮上的 bindgetuserinfo 办法不反对,须要改为一般的bindtap受权登录这里和微信小程序差不多,不须要过多的批改~领取的话,头条小程序反对的比拟多,例如支付宝.这里须要依据需要自行批改如果你的我的项目中有搜寻框须要接入敏感词过滤!!!(咱们的我的项目因为这个审核被拒)对于用户输出非法揭示的toast不能自己随便写,要写头条给的揭示文本,例:因相干法律和要求,相干搜寻后果不予展现等等...4. 总结到这里我的项目应该曾经能够差不多跑起来了,通过在转换后的头条小程序代码上修修改改进行二次开发,能够很疾速的将微信小程序转为头条小程序.接下来就是须要对整个我的项目进行回归测试了~这里就不再赘述了~ 5. 参考文档微信小程序官网文档字节跳动小程序官网文档wx2bat文档 6. 结束语❤️ 关注 + 点赞 + 珍藏 + 评论 + 转发 ❤️ 原创不易,激励笔者创作更好的文章~ ...

October 30, 2020 · 1 min · jiezi

关于小程序:门店小程序附近的小程序这个超级流量入口你知道吗

「左近的小程序」,一看到这5个字,就感觉特地门槛高。 还没去理解开明步骤心里就有了预判: 「我的门店也不大,应该开明不了吧?!」 「开明这个流量入口应该挺贵的!」 「开明这个性能应该很不容易!」 还没开始就打起了退堂鼓,还没开始就发表完结。咱们常常因为本人的“预判”,错失一些对本人无利的货色,“追悔莫及”这个成语就是这么来的吧。 左近的小程序 还是俗话说得好--宁sha错,不放过! 关上手机微信,发现-左近的小程序小程序,这么显著的入口,这么不便的性能,你能忍住不必吗? 你看看他人,便利店也照样在左近小程序的队伍中,跟门店的大小没有关系,并不是大店和连锁店才有资格呈现在这里。 为什么要开明左近的小程序 1.超级流量入口 微信是咱们每天关上最多的APP之一,也是男女老少都在用的手机利用。微信的各种性能大家都十分相熟,生存中遇到问题,如果用这个利用里的性能能够解决,咱们就十分乐意应用。难道你会抉择从新找一个利用下载吗? 不会!因为大家都懒。 你只会关上现有的APP,搜一搜就能找到,所以「左近的小程序」劣势太显著。 2.用户能更快更准地找到你 比如说,遇到长假期,有些人按捺不住就进来游玩了。 走在生疏的路上,水喝完了,你是不是关上左近小程序找便利店?忘了带毛巾和牙刷进去游览,又不想用酒店提供的,是不是要买?拿出手机就能晓得左近能够买洗漱用品的中央。睡觉之前想吃点货色,如果工夫曾经很晚,过了很多店铺的营业时间,难道你会抉择到处去逛营业的店铺吗? 有左近的小程序,你基本不会抉择原始的形式,立刻晓得营业时间,地位,还能抉择去门店还是进入小程序间接下单,能够抉择外卖,也能自提,还有间隔你多少米。 如果抉择到门店自提,那只有关上导航... 线下门店商家心动了吗?然而口头的人真的很少。不信你关上本人的手机看看,左近的小程序,方圆3km有多少门店,对应的左近的小程序又有多少? 很多门店没有在这里呈现,就是“预判”牵累的,其实开明「左近的小程序」一点都不难,甚至不必花钱,文章结尾的预判不精确。 门槛高吗? 不高!有小程序,不花一分钱就能设置。所以,首先得有个专属的小程序! 有了小程序,就要想方法获取流量,开明左近的小程序只是其中一个办法,还有更多流量入口。线下门店不能少了小程序码。

October 16, 2020 · 1 min · jiezi

关于小程序:广汽传祺的创意营销模式剧透带你了解大型车企的数字化升级之路

汽车行业在经验 2019 年经济上行和 2020 年的突发疫情,遭逢双重冲击。销售额大幅下滑、库存压力大、市场竞争强烈、新车利润下滑、老本上涨、盈利艰难、人员散失重大等一系列的问题正在考验每一家经销商。为了走出当下窘境,进步企业生存能力,汽车企业致力寻找改革求存的产业新格局。 广汽传祺是这些探索者中的领先者和开创者,正在借助数字化能力取得新的商业模式、营销模式,并在践行中一直理解消费者的需要,以此提供更合乎现阶段消费者需要的高品质产品和服务。 广汽传祺联结爱范儿及旗下技术服务平台通晓云,通过数字化技术和翻新营销能力,建设一个以用户为核心的数智化营销平台,实现全渠道宣传、服务平台化、全会员营销、数据驱动、治理智能化,为其建设品牌、充沛理解用户、降级产品、实现业务增长提供动摇的根底。 构建数智化营销平台,低成本、高效率解决当下销售问题面对汽车企业的生存窘境,如何获取更多线索、减速潜在客户转化、进步汽车销售额,是汽车经销商的事不宜迟。构建数智化营销平台,作为广汽传祺数字化降级中的重要一环,以 e祺购微信小程序为载体,旨在利用翻新营销模式和数据驱动用户增长,进步销售转化。 e祺购小程序是广汽传祺连贯消费者、传祺合伙人、汽车经销商的挪动互联网平台,是消费者理解广汽传祺产品、服务、流动的挪动窗口,是合伙人与广汽传祺互利共赢的平台,是汽车经销商与消费者建设密切关系的沟通渠道,更是广汽传祺一直去获取用户、理解用户、留下用户、促成转化的以用户为核心的数智化营销平台。 在过来的汽车销售过程中,因为技术限度、营销形式落后、管理混乱等起因导致汽车企业呈现诸如以下的状况: 针对汽车企业所面临的经营难题,广汽传祺在原有的 App 根底上,重构微信小程序平台,重视底层能力、数据互通、成长体系、裂变能力、积分体系、用户治理等外围能力的输入。e祺购小程序满足了消费者购车场景的一站式需要,消费者能够通过小程序实现车系查问和专属参谋征询、预约试驾、左近门店指引、到店试驾和购车的整一个流程。以数字化能力赋予消费者购车新体验。 广汽传祺针对用户生命周期治理,制订一套成熟的用户经营体系,推出「传祺合伙人」打算,所有人均可申请成为合伙人,享受广汽传祺带给他们的资源和权利,而广汽传祺通过合伙人的分享、邀请、潜客上报等行为,取得更多潜在客户,单方将在单干中实现互利共赢。e祺购小程序所搭建的积分体系,把注册处分、分享处分、签到处分、举荐处分、到店处分、成交处分等处分笼罩到全链路上的各个阶段,实现全链路数字化营销,一直的扩充品牌宣传辐射范畴,进步品牌知名度和业务增长数据。 在现在的大数据时代,数据是一个企业重要的生产因素。e祺购小程序全方位买通平台的用户数据、汽车数据、销售数据、员工及经销商数据等多端数据,实现业务流程无缝对接,数据的对立治理。通过大数据来重构指标用户画像,防止「自觉」营销,导致成本增加、成果不佳。 以用户可持续增长体系驱动业务稳定增长e祺购小程序全新改版正式上线一个月后,便带来数百万的新增访问量。新版本针对用户的成长体系、激励机制、行为疏导等模块进行了深度重构,为企业带来显著的数据增长亮点,整体出现新用户减少、用户粘性更高、分享积极性更强、天然增长(分享裂变)用户占比更多的增长趋势。其中,在用户分享渠道所带来的新用户数据有显著的增长趋势,通过用户分享所新增的传祺合伙人占比由  5.00% 上涨到 50.00%,由此可见分享性能对天然增长用户的显著作用。 通过小程序用户经营体系的从新设计,不仅无效激活旧用户、进步整体的活跃度和粘性,同时还带来更多的新用户,造成一个裂变式、可持续性的用户增长体系。 随着小程序访客、传祺合伙人数量的上涨,也带来了销售线索量的减少,为广汽传祺经销商带来了无效的市场信息和销售转化。接下来广汽传祺仍在用户增长方面持续发力,为汽车经销商赋能,进步转化漏斗上各个环节的转化率,促成业务稳定增长。 交融平台、买通数据,进行全链路赋能通晓云作为爱范儿旗下的技术品牌,利用平安稳固、高伸缩性、高可用性的的底层能力,为广汽传祺提供笼罩小程序、App、Web 三个终端的服务,让业务发展不受到终端限度,满足不同角色、不同场景下的应用需要。 通晓云还将为广汽传祺进行数据赋能、营销赋能,基于数据分析引擎能力,对多渠道数据进行采集、存储、解决、剖析,造成可视化的剖析报告和精准用户画像,帮忙企业在经营决策、营销决策上提供弱小的数据撑持。 将来,广汽传祺以用户体验为外围,一直推出满足消费者需要的高品质产品,并持续联手爱范儿,通过翻新营销模式,以互联网平台为沟通桥梁,继续深入与消费者的情感链接,引领汽车行业营销趋势。同时,还将一直赋予e祺购小程序更多的用户裂变能力和汽车经销商的网络盈利能力,晋升企业的抗危险能力和可继续倒退能力。 「寻找创意合伙人——2020 广汽传祺全国大学生广告创意挑战赛」已开启,广汽传祺冀望通过本赛事同大学生建设起良好的沟通平台,激励企业更好的理解年老群体对汽车品牌的创意想法和生产心理,拓宽企业的营销思路及方向。咱们将在下期针对该流动输入案例分享,敬请期待。 另外,如果你刚好为该流动的目标群体,并违心奉献本人的创意,参加到广汽传祺的品牌建设中,那请扫描下方挑战赛小程序二维码,报名成为创意单干人。 查看更对行业解决方案智慧党建小程序省工会小程序疫情服务小程序校园导览小程序文旅行业小程序品牌营销小程序

October 16, 2020 · 1 min · jiezi

关于小程序:微信小程序开发的完整流程介绍新手必读

自从跳一跳小程序游戏呈现后,一夜之间,小程序就变得妇孺皆知了,性能开发也越来越丰盛,在微信搜一搜就会发现许多大品牌早已有本人的小程序了,越来越多的企业和商家都看中了这个风口,想疾速开发出一款属于本人的小程序,那小程序开发的流程是怎么的呢? 一、筹备好小程序开发所要用到的资料企业开发小程序所需的资料有: 公司的营业执照、法人的手机号、身份证号、微信号扫描、认证单——用于微信公众号认证。 银行对公账号、银行开户许可证、企业网银——申请领取接口。 小程序logo、企业介绍。产品信息、联系方式等——小程序开发。 注:集体能够申请微信小程序,但无奈申请微信领取接口。 二、微信小程序开发的残缺流程介绍设计原型图,把想要实现的性能大略画进去,这一步次要探讨的是逻辑思维,只有把逻辑理分明了,前面的工作才会发展的更顺畅,须要客户和设计师重复沟通确定才能够实现,缩小沟通过程中存在的一些误差。注册小程序账号,须要领取300元的认证费用,如果须要应用微信领取性能,那还要申请领取接口。UI设计,UI设计师依据原型图、产品特点、公司文化等来设计界面,比拟重视外观和细节,优质的界面会让人有流连忘返的感觉,让用户把小程序增加到珍藏列表中。后端开发,依据原型图制作零碎后盾和开发相干接口,包含后盾数据管理、和小程序前台交互的接口。小程序接口须要应用HTTPS,也就是服务器必须依照SSL证书,同时须要退出相干域名到治理后盾。前端开发,小程序前端工程师除了制作界面外,还须要对接后盾的接口来进行数据交互,从而制作出残缺的流程,制作实现生成体验版,供大家内部测试。测试环节,小程序也考究兼容性,测试人员要测一下开发进去的性能是否能失常应用,苹果和安卓版本是否会有误差,确保小程序的各项性能失常。最初提交申请上线,体验版测试通过后,管理员能够提交到平台审核,平台审核通过后即可公布上线,供所有平台用户应用。起源:https://www.src1024.com/tech/it/28630.html

October 15, 2020 · 1 min · jiezi

关于小程序:小程序请求网络接口慢问题解决

微信小程序开发过程遇到的问题,排查了一天才找到起因解决。 问题的景象是开发工具上申请后盾接口是毫秒级的,真机小程序上申请接口是秒级的。查了网上很多人遇到过这种问题,网上的图片,不过和我的状况一样! 这个问题是接口地址应用的ssl证书的起因具体理论状况:当小程序首次启动时,无论申请什么链接,前几次条申请会很慢,最长会达到6、7秒。这种状况产生在真机微信上,电脑开发环境没有问题。 后盾web服务更换了ssl证书,接口的访问速度大大晋升。 小程序要求后盾接口都应用https申请,增强安全性。之前在我的项目中应用的是国外letsencrypt.org的收费ssl证书,我的了解尽管这个证书在网页上应用是没有问题的,然而在手机微信中解析这个证书会十分慢。 ssl证书还是挺贵的,不过当初腾讯云和七牛等都有域名型的收费证书能够申请。 不过感觉在微信上申请https地址,还是达不到毫秒级响应。

October 15, 2020 · 1 min · jiezi

关于小程序:搭建在线答题小程序的三种方式你喜欢哪一种

前言 以前大都是在纸面或者电脑上进行,不是太不便。当初随着智能手机和微信的遍及,越来越多的企业开始在微信上发展答题考试。没有工夫、场地和设施的要求,十分不便执行。 很多从事企业培训、单位学习、教育行业等的敌人对于这个小程序软件的抉择有些困惑,上面我就整顿一下搭建在线答题考试零碎的三种形式,看看你喜爱哪一种呢? 形式一、应用成熟的第三方平台进行出题考试 这种形式是绝对较为简单省事的一种,找到市场上比拟成熟的第三方平台,比方问卷星等,注册登录平台即可开始,个别是收费的。这种办法的益处是简略、老本极低,能够很快切入市场,毛病是流量和零碎都是借助的别家的,甚至是本人的题库、用户等数据都在他人那里,无自主性可谈,更不能保护本人的客户关系,看重题库数据保密性和属于本人精准用户的敌人不适宜抉择此类。 形式二、抉择Saas平台搭建本人的考试零碎 绝对后面的入驻应用第三方平台,应用Saas零碎的老本略微高一些,然而可操作性会好一些,这也是目前比拟风行的一种形式。在费用老本方面可能会比拟贵一些,根底版个别一两千块一年,免费模式是按年付、增值服务,像微擎等是目前较为能够抉择的Saas平台。 此类界面和性能的绝对固定,定制化或者半定制化的可能性较低,对数据和用户的自主性低,容易造成被动局面。 形式三、独立部署本人专属的微信答题小程序 大家能够在小程序外面搜一下在线答题,会发现有很多各自专属的在线答题小程序。微信小程序是行业趋势,微信生态日渐欠缺,独立部署的教育小程序曾经绝对成熟了,无需另外购买服务器和域名。价格也比拟亲民,三四位数即可领有本人专属的答题小程序,根本的需要都能满足。 这个老本绝对Saas来说会好一点,然而一次买断,不会每年付钱,并且用户流量都是在本人的服务器上,属于私域流量,自主性十分高,也不会因为不续费导致题库、用户等数据清零的状况呈现。也能够绑定公众号,深度联合微信公众号,打造更弱小的公众号。 常识竞答学习小程序,独立部署,稳固、平安、高效,满足企业、政府、教育行业的各种在线学习、培训需要。实用于企业培训、考核评测、常识比赛、模拟考试等场景。 总结 以上三种就是搭建在线答题零碎的比拟罕用的形式了,我认为依照本人的需要来抉择适宜本人的平台或者软件很重要。 附言 作为小程序开发者,在最初举荐其中一款本人设计、开发的作品,独立部署的在线答题小程序,有趣味的话能够体验一下(微信小程序搜一搜:答题小博士),还有其余作品也能够分割体验

October 14, 2020 · 1 min · jiezi

关于小程序:2020年最新微信小程序全栈项目之喵喵交友附课件和源码

微信小程序,小程序的一种,英文名Wechat Mini Program,是一种不须要下载安装即可应用的利用,它实现了利用“触手可及”的幻想,用户扫一扫或搜一下即可关上利用。 全面凋谢申请后,主体类型为企业、政府、媒体、其余组织或集体的开发者,均可申请注册小程序。微信小程序、微信订阅号、微信服务号、微信企业号是并行的体系。 微信小程序是一种不必下载就能应用的利用,也是一项翻新,通过将近两年的倒退,曾经结构了新的微信小程序开发环境和开发者生态。微信小程序也是这么多年来中国IT行业里一个真正可能影响到一般程序员的翻新成绩,曾经有超过150万的开发者退出到了微信小程序的开发,与咱们一起独特发力推动微信小程序的倒退,微信小程序利用数量超过了一百万,笼罩200多个细分的行业,日活用户达到两个亿,微信小程序还在许多城市实现了反对地铁、公交服务。微信小程序倒退带来更多的就业机会,2017年小程序带动待业104万人,社会效应一直晋升。 2017年1月9日,张小龙在2017微信公开课Pro上公布的微信小程序正式上线。2018年2月,微信官网发布公告称:已对波及假货高仿、色情低俗和违规“现金贷”等超过2000个微信小程序,进行永恒封禁解决。2019年8月9日,微信向开发者公布新能力公测与更新布告,微信PC版新版本中,反对关上聊天中分享的微信小程序。 简介微信小程序全栈我的项目之喵喵交友,包含我的项目的:后期筹备,我的项目开发,多账号测试,我的项目公布等多个环节,并手把手一步步带大家搭建本人的小程序我的项目,内容由浅入深,循序渐进。 小程序知识点笼罩95%以上,包含:内置组件、WSS、常见客户端API、服务端API、自定义组件、云开发、云函数、云存储、HTTP API等。性能波及音讯推送、左近人查找、增加好友、获取微信昵称与头像、小程序鉴权、CMS管理系统等。 2 视频章节01_小程序整体架构介绍.mp4 02_喵喵我的项目演示与介绍.mp4 03_创立我的项目初始化文件.mp4 04_iconfont应用和创立tabBar.mp4 05_首页布局及款式编写.mp4 06_创立用户表及写入用户数据.mp4 07_利用login云函数主动登录.mp4 08_我的页面和个人信息页面布局.mp4 09_创立编辑子页和批改签名性能.mp4 10_批改手机和微信号及共享地位.mp4 11_批改自定义昵称和微信昵称.mp4 12_抉择头像图片及上传到云存储.mp4 13_批改自定义头像和微信头像.mp4 14_首页用户列表渲染及多账号调试.mp4 15_点赞性能实现与update云函数.mp4 16_昵称和点赞的优化及wxs应用.mp4 17_首页的举荐与最新性能实现.mp4 18_详情页渲染数据和款式布局.mp4 19_自定义callPhone和copyText组件.mp4 20_增加好友性能之创立message音讯.mp4 21_增加好友性能之更新message音讯.mp4 22_增加好友性能之监听message音讯.mp4 23_音讯页面和removeList组件布局.mp4 24_实现删除音讯与子父组件间通信.mp4 25_创立friendList字段实现好友关系.mp4 26_详情页依据好友关系解决渲染内容.mp4 27_实现查看好友列表页面.mp4 28_左近页面的布局及地位的获取.mp4 29_获取左近用户及建设地理位置索引.mp4 30_优化左近页面及跳转详情页.mp4 31_search组件的布局和款式.mp4 32_实现搜寻历史记录及本地缓存.mp4 33_数据库正则查问及组件复用.mp4 34_搭建服务器与上传文件到后端.mp4 35_服务器利用HTTP_API进行云上传.mp4 36_服务器利用HTTP_API进行云插入.mp4 37_小程序公布及github代码凋谢.mp4 源码_miaomiao.rar 小程序全栈我的项目之喵喵交友.pptx 3 如何获取视频、课件和源代码视频地址: https://www.bilibili.com/vide...下载源码、课件形式: 首页回复【喵喵】即可获取下载链接

October 14, 2020 · 1 min · jiezi

关于小程序:小程序实现怎么跳转打开-H5-网页链接或跳转至公众号文章

背景有时候,因为业务需要,在小程序当中,须要跳转到 h5 网页,或跳转到公众号,造成流量的闭环,那在小程序当中怎么实现呢? 实例成果不反对gif图展现,残缺成果见这里 前提条件该小程序与须要跳转至的公众号(订阅号/服务号)进行了绑定关联应用小程序凋谢能力web-view实现跳转(承载网页的容器。会主动铺满整个小程序页面,集体类型的小程序暂不反对应用)web-view提供了一个src属性,这个src属性就是能够从小程序跳转到指定链接的地止 留神 应用webview时,须要独自的在小程序中创立一个页面,要在app.json中的pages中注册,如下所示,而后在webview中的wxml中应用webview标签,在webview标签上设置的src属性就是要跳转的地止 { "pages": [ "pages/webview/webview" ]}复制代码在触发事件处:绑定事件 <view> <view class="contaniner-1" bindtap="handleToWxPublic"> 点击跳转到itclanCoder公众号 </view> <view class="contaniner-1" bindtap="handleToWebSite"> 点击跳转到https://coder.itclan.cn/网站 </view></view>复制代码以下是逻辑代码 // pages/handletowebview/handletowebview.jsPage({ /** * 页面的初始数据 */ data: {}, /** * 生命周期函数--监听页面加载 */ onLoad: function(options) {}, handleToWxPublic() { const url = 'https://mp.weixin.qq.com/s/EgSgGqMWoV4nrt7qPF9nzA'; // 跳转的地止,这里写你想要跳转的公众号地止即可 const navtitle = 'itclanCoder'; // 小程序跳转到公众号页面显示的题目 wx.navigateTo({ // 跳转到webview页面 url: `/pages/webview/webview?url=${url}&nav=${navtitle}`, }); }, handleToWebSite() { const url = 'https://coder.itclan.cn/'; // 跳转的外链 const navtitle = 'itclanCoder'; // 这个题目是你本人能够设置的 wx.navigateTo({ // 跳转到webview页面 url: `/pages/webview/webview?url=${url}&nav=${navtitle}`, }); },});复制代码下面示例代码中的跳转的参数url,nav在另一个页面webview中的onLoad生命周期函数中的options参数中能够接管失去,从新赋新值即可 ...

October 14, 2020 · 1 min · jiezi

关于小程序:商城微信小程序一开发环境搭建小程序结构首页完成

这个系列文章记录自己学习微信小程序的过程,教程起源黑马程序员,我只是用文字记录下,以备忘。 筹备工作:装置微信小程序开发工具装置VScode,并装置如下插件:各个插件的作用都有阐明,这里说下Easy LESS,因为微信小程序不反对less语法, 为了不便开发,咱们不间接编写微信的款式文件,而是应用该插件将less语法主动生成wxss款式,插件增加如下设置: "less.compile": { "outExt": ".wxss", },小程序目录:components--寄存自定义组件icons--寄存小程序用到的图标(次要是底部tabs图标)lib--寄存用到的第三方库pages--小程序的页面request--封装request申请styles--寄存公共的款式utils--寄存一些工具类 pages构造 "pages/index/index", "pages/category/index", "pages/goods_list/index", "pages/goods_detail/index", "pages/cart/index", "pages/collect/index", "pages/order/index", "pages/search/index", "pages/user/index", "pages/feedback/index", "pages/login/index", "pages/auth/index", "pages/pay/index"别离是首页、分类页、商品列表页、商品详情页、购物车、珍藏页、订单页、搜寻页、用户核心、反馈、登录、验证、领取页。 应用微信小程序开发工具在app.json中疾速搭建各个页面和底部导航tabs: { "pages":[ "pages/index/index", "pages/category/index", "pages/goods_list/index", "pages/goods_detail/index", "pages/cart/index", "pages/collect/index", "pages/order/index", "pages/search/index", "pages/user/index", "pages/feedback/index", "pages/login/index", "pages/auth/index", "pages/pay/index" ], "window":{ "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#eb4450", "navigationBarTitleText": "黑马优购", "navigationBarTextStyle":"white" }, "style": "v2", "sitemapLocation": "sitemap.json", "tabBar": { "color":"#999", "selectedColor": "#ff2d4a", "backgroundColor": "$fafafa", "position": "bottom", "borderStyle": "black", "list": [{ "pagePath": "pages/index/index", "text": "首页", "iconPath": "./icons/home.png", "selectedIconPath": "./icons/home-o.png" }, { "pagePath": "pages/category/index", "text": "分类", "iconPath": "./icons/category.png", "selectedIconPath": "./icons/category-o.png" }, { "pagePath": "pages/cart/index", "text": "购物车", "iconPath": "./icons/cart.png", "selectedIconPath": "./icons/cart-o.png" }, { "pagePath": "pages/user/index", "text": "我的", "iconPath": "./icons/my.png", "selectedIconPath": "./icons/my-o.png" } ] }}首页次要有四局部组成:搜寻框、幻灯片、分类导航、楼层导航,如下图: ...

October 5, 2020 · 3 min · jiezi

关于小程序:基于云开发搭建-KV-缓存系统-20

昨天分享了基于云开发实现 KV 缓存的办法,但在理论的开发过程中,这样的性能其实很难满足所有的需要。在这个时候,就须要对原有的计划进行优化,来解决一些其余的问题。 具体来说,之前的代码有以下几个问题: 没有进行错误处理没有对数据进行过期工夫的解决如果没有数据的话,如何触发数据更新这些都没有在昨天的文章中提及,明天就补全这些局部。 对数据进行错误处理在应用云开发的时候,是有出错的可能的,因而,咱们须要对可能出错的局部进行解决,以确保函数自身是能够失常返回的。 咱们须要在原有的函数中进行批改,批改后的后果如下 设置缓存async function setCache(key, value) { try { let result = await db.collection("cache").add({ data: { _id: key, value: value } }) return { code:0 } } catch (error) { return { code:1, msg: error } }}读取缓存async function getCache(key) { try { let { data } = await db.collection("cache").doc(key).get(); return { code: 0, value: data.value }; } catch (error) { return { code: 1, msg: error } }}通过这一轮的批改,咱们在原有的函数根底之上增加了错误处理,无论如何,缓存函数自身不会报错,不会阻塞内部逻辑的执行。在内部逻辑侧只须要依据返回的 code 来进行判断是获取缓存,还是间接进行逻辑计算,实现所有的工作。 ...

October 2, 2020 · 2 min · jiezi

关于小程序:键盘设置如何优化小程序使用体验

在小程序开发过程中,用户输出是必不可少的,咱们常常会须要用户输出一些内容,来实现产品收集用户信息的需要。 在这种状况下,咱们能够思考借助小程序提供的一些和键盘相干的 API 来优化小程序的应用体验。 Input 组件的 type 属性 从小程序的 1.0 版本开始,就反对为 input 组件设置 type,不同的 type 会显示不同的手机键盘。默认状况下,显示的是 text 文本输出键盘,这个键盘的特点是显示所有的内容,能够实用于所有的场景。 但,实用于所有场景也就意味着不适用于所有场景,总会在每一个场景中有着种种不便,因而,在理论的开发中,为了取得更佳的体验,你能够通过设置不同的 Type 来管制理论的键盘显示状况。 除了默认的 text 类以外,你还能够应用 number(数字输出键盘)、idcard 身份证输出键盘和 digit 带小数点的数字键盘。 你能够依据本人的理论应用场景来设置不同的类型,比如说 如果你的小程序的验证码都是数字的,那么你给出一个 text 类型的键盘,显然不如给一个 number 类型的键盘更适合。如果你的小程序中波及到了手机号的输出,那么这种状况下你就能够抉择应用 number 类型的键盘,来优化用户输出时的体验。 这里的思路是相似的,当你预期用户输出的内容只有数字,就能够思考 number、digit、idcard 等类型,来优化你的小程序的理论应用体验。 ## 总结 input 组件默认提供的 四种 type ,能够通过抉择不同的类型,从而取得不同的体验成果,从而对于你的小程序体验进行优化和推动。

September 28, 2020 · 1 min · jiezi

关于小程序:如何在微信小程序上开发一个蚂蚁森林和蚂蚁庄园结合体转

如何在微信小程序上开发一个「蚂蚁森林」和「蚂蚁庄园」结合体?小程序微信小程序小游戏商城 公布于 9月11日 你在蚂蚁森林中种了几棵树?你在蚂蚁庄园中捐献了几颗蛋?「蚂蚁森林」和「蚂蚁庄园」是支付宝别离在 2016 年 8 月和 2017 年 8 月上线的两个网上公益活动,通过游戏互动和激励来造就用户的低碳环保经营流动。明天,这两个性能曾经成了支付宝的热门性能,不仅能为支付宝拉好感,还能为支付宝生态内的小程序导流。 用户步行、在线缴纳水电煤、网络购票、捐献旧衣物、捐献废品……这些行为能够缩小用户的碳排放量,将被转化为虚构的「绿色能量」。当能量累计到肯定值就能「种树」,支付宝蚂蚁森林和公益合作伙伴就会帮你在沙漠里种下一棵真树。 蚂蚁庄园的用户应用支付宝付款等行为来支付鸡饲料,应用鸡饲料喂鸡之后能够取得鸡蛋,通过鸡蛋来进行爱心捐献。 生存和公益相结合,将用户行为赋予价值,这类小游戏有利于进步品牌形象、取得用户的认同感。同时,通过小游戏加强社交属性,取得更强的用户粘性。这类游戏的胜利,让更多品牌看到了娱乐游戏的更多价值,天然也引来了不少追随者,「安佳牧场」小程序就是其中之一。 交融品牌个性,宣传+转化+变现在理解安佳牧场小游戏之前,先简略理解一下「安佳」这个品牌。 安佳是新西兰恒人造团体旗下的旗舰品牌,领有 130 多年的悠久历史。安佳始终致力于研发及生产各种高品质的乳制品以满足公众和业余市场的需要,其业务笼罩生产品牌以及餐饮服务等多个畛域。 你每天的早餐面包,可能就有安佳奶油。你午餐吃的披萨,也可能有安佳芝士。 安佳牧场微信小程序是安佳推出的「衰弱理念+小游戏+社交+电商」的小程序,造成一个品牌宣传到用户引流再到变现的一站式解决方案。安佳牧场小程序学习了支付宝蚂蚁森林和蚂蚁庄园的乏味玩法,又联合了品牌个性,将日常的衰弱行为与奶制品从生产、加工到销售的整个供应链过程交融到小游戏中。 小游戏分为两个次要的板块,「原草核心」和「人造牧场」。 「原草核心」是原草的生产核心,用户通过实现已上线的工作来取得原草处分,工作蕴含每日步行、每日签到、每日喝奶等衰弱行为。「人造牧场」是生产优质蛋白的中央,用户所取得的原草能够投喂奶牛,取得养分的奶牛便能够生产蛋白,最终获取的蛋白能够兑换成优惠券和积分,在安佳商场中间接购买或兑换商品。 此外,安佳牧场小程序还充分发挥社交属性,加强小游戏的互动性。用户能够分享本人的情绪,通过应用零碎自带的卡片模板,自定义此时此刻的情绪,生成一张「情绪卡片」。还能够邀请微信好友成为「牧友」,牧友之间能够偷取蛋白及帮喂奶牛,进步蛋白的产能,减少好友的亲密度。 情绪卡片与牧友邀请自身自带裂变的属性,利用用户的社交圈,以此取得更多用户的参加。 安佳牧场小程序的胜利,次要在于它在联合品牌与消费者需要、关系方面,为用户提供了创意十足的应用场景。 基于微信小程序,品牌买通了微信公众号、电商平台,升高了整个流程的参加门槛。 而获取原草和喂食奶牛,体现了安佳奶源的原生态的品牌调性,用户认可品牌。签到、步行、喝奶等工作行为,使用户违心持续性参加。喂养奶牛所取得的蛋白可兑换的实物处分或公益捐献,满足了用户的不同谋求,让用户违心全情投入。 打造微信生态产品,多平台无缝跳转作为恒人造团体和爱范儿共同完成的小程序解决方案。安佳牧场从小程序开发、技术对接到推广营销计划的策动与执行,均由爱范儿旗下品牌共同完成。 爱范儿旗下的技术服务平台通晓云,承当技术开发与接口对接等重要工作。基于通晓云对小程序平台的深度定制化反对,迅速搭建一个微信小程序平台,并与安佳微信公众号、商城买通,用户能够无缝跳转到各个平台,更加不便的参加到整个流动中来。 云函数 开发者通过编写简略的、目标繁多的云函数,并将它与其余性能(如触发器、定时工作)产生的事件关联起来,即可在小程序上实现喂食原草、收取蛋白、邀请好友等更加简单的业务逻辑,极大的升高了运维老本,在疾速实现性能的根底上,依然保留了极强的程度扩大能力。 wxParser 小程序插件 wxParser 小程序插件是通晓云团队通过对微信小程序富文本渲染引擎 wxParser 进行一层封装,解决了应用起来太过麻烦的问题。应用 wxParser 插件并配合富文本编辑器,能够很不便地开发内容展现类小程序。 实时数据库 实时数据库是基于 WebSocket 实现客户端和服务端的实时双向通信,在云端数据发生变化时马上告诉所有客户端来同步数据。通过实时数据库,能够更加方便快捷的实现原草量和蛋白量的实时更新、牧友的实时榜单和动静等性能。 经营后盾 基于 User Dash API 和开箱即用的前端组件库,为用户疾速编写一套独立的经营后盾。经营人员能够通过生成的链接间接拜访应用,灵便高低架「原草核心」的工作、治理用户和「蛋白」兑换、更新「情绪」卡片模板等。 品牌联结互动,全网笼罩,触达精准用户在充沛理解安佳品牌的产品调性、市场挑战以及产品布局后,爱范儿为安佳制订专属的经营策动计划,通过行业报道、品牌联结实现曝光、互动、引流的指标。 借用爱范儿旗下残缺的微信生态媒体矩阵和其它自媒体平台整合全渠道报道,全点位推广,多模式疏导,全网笼罩,最大化裂变流传成果。通过抽奖、安佳牧场等裂变小程序,以低成本高效率的形式实现指数级用户增长,将用户积淀到公众号、小程序、社群、集体号中。通过技术实现小程序无缝跳转到电商平台,最大化实现用户变现。安佳牧场小程序胜利,得益于无论从互动平台的打造、单干品牌的抉择、再到整体的执行节奏与细节,都与安佳的品牌调性和产品布局相匹配。这也意味着作为一家数字化营销平台和技术服务平台,应该在充沛理解客户需要后,能力隔靴搔痒,最大化实现既定目标。

September 23, 2020 · 1 min · jiezi

关于小程序:小程序-vantweapp-SwipeCell-滑动单元格样式问题

微信小程序开发时 vant-weapp SwipeCell 滑动单元格款式问题 如何援用SwipeCell组件不再赘述,vant-weapp 官网**van webapp,有坑~话不多说,搞个款式就好了** .wxcss文件中,当然这里你能够用rpx;.van-swipe-cell__left,.van-swipe-cell__right { display: inline-block; width: 65px; height: 67px; font-size: 15px; line-height: 67px; color: #fff; text-align: center; background-color: #f44;}.van-swipe-cell__left{ background-color: #07c160;}

September 21, 2020 · 1 min · jiezi

关于小程序:设置小程序全局分享名字和封面

设置完默认全局分享名字和封面后,如果页面没有onShareAppMessage则应用全局设定,如果有则不实用全局,而应用页面内onShareAppMessage的设定。代码 !function(){ var PageTmp = Page; Page =function (pageConfig) { // 设置全局默认分享 pageConfig = Object.assign({ onShareAppMessage:function () { return { title:'默认文案', path:'默认分享门路+id', imageUrl:'默认分享图片', }; } },pageConfig); PageTmp(pageConfig); };}();利用场景:设置默认分享页和参数。如在小程序任意页面通过分享带一个举荐id,他人通过点击我分享的卡片就能成为我的团队成员,

September 12, 2020 · 1 min · jiezi

关于小程序:如何在微信小程序上开发一个蚂蚁森林和蚂蚁庄园结合体

你在蚂蚁森林中种了几棵树? 你在蚂蚁庄园中捐献了几颗蛋?「蚂蚁森林」和「蚂蚁庄园」是支付宝别离在 2016 年 8 月和 2017 年 8 月上线的两个网上公益活动,通过游戏互动和激励来造就用户的低碳环保经营流动。明天,这两个性能曾经成了支付宝的热门性能,不仅能为支付宝拉好感,还能为支付宝生态内的小程序导流。 用户步行、在线缴纳水电煤、网络购票、捐献旧衣物、捐献废品……这些行为能够缩小用户的碳排放量,将被转化为虚构的「绿色能量」。当能量累计到肯定值就能「种树」,支付宝蚂蚁森林和公益合作伙伴就会帮你在沙漠里种下一棵真树。 蚂蚁庄园的用户应用支付宝付款等行为来支付鸡饲料,应用鸡饲料喂鸡之后能够取得鸡蛋,通过鸡蛋来进行爱心捐献。 生存和公益相结合,将用户行为赋予价值,这类小游戏有利于进步品牌形象、取得用户的认同感。同时,通过小游戏加强社交属性,取得更强的用户粘性。这类游戏的胜利,让更多品牌看到了娱乐游戏的更多价值,天然也引来了不少追随者,「安佳牧场」小程序就是其中之一。 交融品牌个性,宣传+转化+变现在理解安佳牧场小游戏之前,先简略理解一下「安佳」这个品牌。 安佳是新西兰恒人造团体旗下的旗舰品牌,领有 130 多年的悠久历史。安佳始终致力于研发及生产各种高品质的乳制品以满足公众和业余市场的需要,其业务笼罩生产品牌以及餐饮服务等多个畛域。 你每天的早餐面包,可能就有安佳奶油。你午餐吃的披萨,也可能有安佳芝士。 安佳牧场微信小程序是安佳推出的「衰弱理念+小游戏+社交+电商」的小程序,造成一个品牌宣传到用户引流再到变现的一站式解决方案。安佳牧场小程序学习了支付宝蚂蚁森林和蚂蚁庄园的乏味玩法,又联合了品牌个性,将日常的衰弱行为与奶制品从生产、加工到销售的整个供应链过程交融到小游戏中。 小游戏分为两个次要的板块,「原草核心」和「人造牧场」。 「原草核心」是原草的生产核心,用户通过实现已上线的工作来取得原草处分,工作蕴含每日步行、每日签到、每日喝奶等衰弱行为。「人造牧场」是生产优质蛋白的中央,用户所取得的原草能够投喂奶牛,取得养分的奶牛便能够生产蛋白,最终获取的蛋白能够兑换成优惠券和积分,在安佳商场中间接购买或兑换商品。 此外,安佳牧场小程序还充分发挥社交属性,加强小游戏的互动性。用户能够分享本人的情绪,通过应用零碎自带的卡片模板,自定义此时此刻的情绪,生成一张「情绪卡片」。还能够邀请微信好友成为「牧友」,牧友之间能够偷取蛋白及帮喂奶牛,进步蛋白的产能,减少好友的亲密度。 情绪卡片与牧友邀请自身自带裂变的属性,利用用户的社交圈,以此取得更多用户的参加。 安佳牧场小程序的胜利,次要在于它在联合品牌与消费者需要、关系方面,为用户提供了创意十足的应用场景。 基于微信小程序,品牌买通了微信公众号、电商平台,升高了整个流程的参加门槛。 而获取原草和喂食奶牛,体现了安佳奶源的原生态的品牌调性,用户认可品牌。签到、步行、喝奶等工作行为,使用户违心持续性参加。喂养奶牛所取得的蛋白可兑换的实物处分或公益捐献,满足了用户的不同谋求,让用户违心全情投入。 打造微信生态产品,多平台无缝跳转作为恒人造团体和爱范儿共同完成的小程序解决方案。安佳牧场从小程序开发、技术对接到推广营销计划的策动与执行,均由爱范儿旗下品牌共同完成。 爱范儿旗下的技术服务平台通晓云,承当技术开发与接口对接等重要工作。基于通晓云对小程序平台的深度定制化反对,迅速搭建一个微信小程序平台,并与安佳微信公众号、商城买通,用户能够无缝跳转到各个平台,更加不便的参加到整个流动中来。 云函数 开发者通过编写简略的、目标繁多的云函数,并将它与其余性能(如触发器、定时工作)产生的事件关联起来,即可在小程序上实现喂食原草、收取蛋白、邀请好友等更加简单的业务逻辑,极大的升高了运维老本,在疾速实现性能的根底上,依然保留了极强的程度扩大能力。 wxParser 小程序插件 wxParser 小程序插件是通晓云团队通过对微信小程序富文本渲染引擎 wxParser 进行一层封装,解决了应用起来太过麻烦的问题。应用 wxParser 插件并配合富文本编辑器,能够很不便地开发内容展现类小程序。 实时数据库 实时数据库是基于 WebSocket 实现客户端和服务端的实时双向通信,在云端数据发生变化时马上告诉所有客户端来同步数据。通过实时数据库,能够更加方便快捷的实现原草量和蛋白量的实时更新、牧友的实时榜单和动静等性能。 经营后盾 基于 User Dash API 和开箱即用的前端组件库,为用户疾速编写一套独立的经营后盾。经营人员能够通过生成的链接间接拜访应用,灵便高低架「原草核心」的工作、治理用户和「蛋白」兑换、更新「情绪」卡片模板等。 品牌联结互动,全网笼罩,触达精准用户在充沛理解安佳品牌的产品调性、市场挑战以及产品布局后,爱范儿为安佳制订专属的经营策动计划,通过行业报道、品牌联结实现曝光、互动、引流的指标。 借用爱范儿旗下残缺的微信生态媒体矩阵和其它自媒体平台整合全渠道报道,全点位推广,多模式疏导,全网笼罩,最大化裂变流传成果。通过抽奖、安佳牧场等裂变小程序,以低成本高效率的形式实现指数级用户增长,将用户积淀到公众号、小程序、社群、集体号中。通过技术实现小程序无缝跳转到电商平台,最大化实现用户变现。安佳牧场小程序胜利,得益于无论从互动平台的打造、单干品牌的抉择、再到整体的执行节奏与细节,都与安佳的品牌调性和产品布局相匹配。这也意味着作为一家数字化营销平台和技术服务平台,应该在充沛理解客户需要后,能力隔靴搔痒,最大化实现既定目标。 查看更对行业案例智慧党建小程序省工会小程序疫情服务小程序校园导览小程序文旅行业小程序

September 11, 2020 · 1 min · jiezi

关于小程序:关于ES6尾调用优化

ES6蕴含了一个性能畛域的特殊要求。这与一个波及函数调用的特定优化模式相干:即尾调用优化(Tail Call Optimization,TCO)。简略地说,尾调用就是一个呈现在另一个函数“结尾”处的函数调用。这个调用完结之后就没有其余事件要做了(除了可能要返回后果值) 什么尾调用举个例子,上面是一个非递归的尾调用: function foo(x) { return x}// 尾调用function bar(y) { return foo(y + 1)}// 非尾调用function baz() { return 1 + bar(40)}baz() // 输入42阐明:foo(y+1) 是 bar(...) 中的尾调用,因为在 foo(...) 实现后,bar(...) 也实现了,并且只须要返回 foo(...) 调用的后果。然而,bar(40) 不是尾调用,因为在它实现后,它的后果须要加上1能力由 baz() 返回。 在JavaScript里,调用一个新的函数须要额定的一块预留内容来治理调用栈,成为栈帧。所以后面的代码个别会同时须要为每个 baz() 、bar(...)、foo(...) 保留一个栈帧。然而,如果反对TCO的引擎可能意识到foo(y+1) 调用位于尾部,这意味着 bar(...) 基本上曾经实现了,那么在调用 foo(...) 时,它就不须要创立一个新的帧栈,而是能够重用已有的 bar(...) 的帧栈。这样不仅速度快,而且节俭内存。 什么是尾递归在计算机科学里,尾调用是指一个函数里的最初一个动作是一个函数调用的情景:即这个调用的返回值间接被以后函数返回的情景。这种情景下称该调用地位为尾地位。若这个函数在尾地位调用自身(或是一个尾调用自身的其余函数等等),则称这种状况为尾递归,是递归的一种非凡情景。尾调用不肯定是递归调用,然而尾递归特地有用,也比拟容易实现。 TCO的意义在程序运行时,计算机会为应用程序调配肯定的内存空间;应用程序则会自行调配所取得的内存空间,其中一部分被用于记录程序中正在调用的各个函数的运行状况,这就是函数的调用栈。惯例的函数调用总是会在调用栈最上层增加一个新的堆栈帧(stack frame,也翻译为“栈帧”或简称为“帧”),这个过程被称作“入栈”或“压栈”(意即把新的帧压在栈顶)。当函数的调用层数十分多时,调用栈会耗费不少内存,甚至会撑爆内存空间(栈溢出),造成程序重大卡顿或意外解体。尾调用的调用栈则特地易于优化,从而可缩小内存空间的应用,也能进步运行速度。其中,对尾递归情景的优化成果最为显著,尤其是递归算法非常复杂的情景。 在简略的代码片段中,这类优化算不了什么,然而在解决递归时,这就解决了大问题,特地是如果递归可能会导致成千上百个栈帧的时候。有了TCO,引擎能够用同一个栈帧执行所有的这类调用! 递归是 JavaScript 中一个纷繁复杂的主题。因为如果没有TCO的话,引擎须要实现一个随便的限度来界定递归栈的深度,达到了就得进行,以避免内存耗尽。有了TCO,尾调用的递归函数实质上就能够任意运行,因为再也不须要应用额定的内存,也没有了内存溢出的问题。 上面用尾递归实现一个典型的阶乘函数: // 用循环实现function factorial(n) { if (n<2) return 1 var res = 1 for (var i = n; i > 1; i--) { res *= i } return res}// 用尾递归实现function factorial(n) { function fact(n, res) { if (n < 2) return res return fact(n-1, n*res) } return fact(n, 1)}factorial(5) // 输入120留神:TCO只用于有理论的尾调用的状况,如果你写了一个没有尾递调用的函数,那么性能还是会回到一般帧栈调配的情景,引擎对这样的递归调用栈的限度也依然无效。总结一般来说,尾调用打消是可选的,能够用,也能够不必。然而,在函数编程语言中,语言规范通常会要求编译器或运行平台实现尾调用打消。这让程序员能够用递归取代循环而不丢失性能。ES6之所以要求引擎实现TCO而不是将其留给引擎自在决定,一个起因是不足TCO会导致一些JavaScript算法因为胆怯调用栈限度而升高了通过递归实现的概率。 ...

September 11, 2020 · 1 min · jiezi

关于小程序:h5页面跳转小程序教程只限在公众号里面使用的h5页面

之所以写这个文章记录下,是因为官网文档写的太不置可否了,总有些货色你会不晓得怎么弄,废话不多说,间接看上面vue代码教程<template><div> <div v-if="isShowWeapp"> <wx-open-launch-weapp id="launch-btn" username="gh_ea5b485762d6" path="pages/index/index.html"> <script type="text/wxtag-template"> <style>.wx-btn { display: flex;align-items: center;background-color:red;color:#fff; }</style> <button class="wx-btn">跳转小程序</button> </script> </wx-open-launch-weapp> </div></div></template><script>export default { data () { return { isShowWeapp: false//是否显示小程序按钮 } }, created () { this.getConfig(); }, methods: { getConfig () { this.$api.GetJSSDKWx(window.location.href).then(res => { let config = res.data; wx.config({ debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert进去,若要查看传入的参数,能够在pc端关上,参数信息会通过log打出,仅在pc端时才会打印 appId: config.appId, // 必填,公众号的惟一标识 timestamp: config.timestamp, // 必填,生成签名的工夫戳 nonceStr: config.nonceStr, // 必填,生成签名的随机串 signature: config.signature,// 必填,签名 jsApiList: ["scanQRCode"], // 必填,须要应用的JS接口列表 openTagList: ["wx-open-launch-weapp"] // 可选,须要应用的凋谢标签列表,例如['wx-open-launch-app'] }); wx.ready(() => { this.isShowWeapp = true; }); }); } }}</script>局部代码解释this.$api.GetJSSDKWx 这个是申请接口获取jssdk配置信息不多说username 这个获取的中央,看下图 ...

September 9, 2020 · 1 min · jiezi

关于小程序:mpvue与原生小程序框架混用实践

应用场景mpvue框架与原生小程序开发框架混用 实际背景我的项目开始齐全应用mpvue开发,然而上线后发现有个表单页面双向绑定有问题(页面扭转,然而值不扭转),尝试多种形式仍未解决,遂应用原生小程序框架进行替换 基本思路得益于小程序较好的分包机制,只须要将用原生框架开发的信息页面的包(文件夹)挪动到对应目录,而后批改打包后app.json中pages页面门路即可。原理比较简单,次要解决是流程繁琐的问题。每次改变都须要挪动文件夹,批改json,且批改页面devServer热更新根本处于残废状态,不胜其烦! 解决思路mpvue应用webpack编译打包,性能非常弱小,所以就应用webpack来解决 新建mpvue我的项目将原生编写包放入和失常mpvue页面雷同目录(src/pages),并在app.json增加路由(和失常mpvue一样,本地目录有文件,所以配置路由后不会报错。另外,个别状况下会开启eslint,小程序语法和vue不一样,会报错,所以能够在原生页面js文件头减少/* eslint-disable */)装置FileManagerPlugin webpack插件,该插件能够挪动/复制/新增/删除等文件或目录,参考filemanager-webpack-plugin批改webpack.base.conf配置,引入插件var FileManagerPlugin = require('filemanager-webpack-plugin');,在plugins减少如下配置new FileManagerPlugin({ onEnd: { delete: [ path.resolve(config.build.assetsRoot, './pages/info'), path.resolve(config.build.assetsRoot, './components/info-cell'), ], copy: [ { source: path.resolve(__dirname, '../src/pages/info'), destination: path.resolve(config.build.assetsRoot, './pages/info') }, { source: path.resolve(__dirname, '../src/components/info-cell'), destination: path.resolve(config.build.assetsRoot, './components/info-cell') } ] } })其中:delete是删除无用目录(因为咱们将原生编写的包放在了src/pages目录下,所以启动或打包时也会将这个打包编译,咱们原本就是用原生小程序编写的,所以不须要这个),copy是将原生小程序目录拷贝到dist对应目录注:info是原生编写页面的包,info-cell是info应用的自定义组件,各位依据理论状况批改 当前就能够失常开发了(反对热更新)

September 8, 2020 · 1 min · jiezi

关于小程序:兼容谷歌验证器开源的动态验证码小程序了解一下

在咱们登录一些网站、利用、游戏时,见到动静验证码的频率越来越多了。最常见的应该就是Google Authenticator,暴雪平安令之类的利用,通过一直变换的动静数字来最大限度的保障账号的数据安全。 明天 Gitee 举荐的这款开源我的项目,是依靠于微信小程序的动静验证码利用,它的体现如何呢,一起来看看吧。 项目名称: OTP 我的项目作者: 当当 开源许可协定: MIT 我的项目地址:https://gitee.com/ghostmemory/otp 我的项目简介基于工夫戳算法(TOTP)的动静验证码微信小程序,兼容 Google Authenticator 二步验证。 软件架构基于MinaOTP二次开发,应用小程序云开发实现云端数据备份。 软件性能生成TOTP动静验证码口令反对扫码或手动录入数据反对编辑服务和帐号信息反对手动删除已存在记录反对云端备份与复原数据反对倒计时红色闪动揭示我的项目截图 部署流程 下载本我的项目或者git clone https://gitee.com/ghostmemory/otp.git将我的项目导入微信小程序开发工具批改/project.config.json 中的 appid: '你申请的小程序appid' 4.创立云数据库otp、user、loginlog 5.上传云函数user 如果你想理解无关这个我的项目的代码细节,那就点击前面的链接返回我的项目主页看看吧:https://gitee.com/ghostmemory/otp

September 2, 2020 · 1 min · jiezi

关于小程序:基于Webpack4X小程序工程化落地实践

小程序开发现状:开发工具不好应用(无奈热更新,编译迟缓);无奈应用css预处理语言(Sass、Less),有些IDE的插件能够监听编译,但不同编辑器须要额定装置;无奈应用工程化(图片主动压缩,文件监听编译等);编码繁琐(创立一个页面,须要新建4个文件(.wxml、.js、.json、.wxss),每次新建都须要新建4次或者复制文件比拟浪费时间);团队多人合作,代码格调、应用的编辑器不统一;技术选型:在进行小程序我的项目启动,进行技术选型的时候,对市场上多个小程序框架进行了思考: uni-app、mpVue、wepy、taro、 kbone团队成员mpvue、wepy、uni-app都有理论的我的项目教训,且依据Github上的star数还有issue,最初决定回到到应用原生开发。 起因:尽管框架有些很成熟,有工程化和跨端的解决方案,也有理论的上线我的项目,但思考到后续一些撑持性的问题(保护,文档,坑等),在github上看了issue,有些曾经没在保护了。 想着让我的项目继续迭代,不受第三方框架限度,放弃持重,最初决定应用原生,跟着官网的迭代降级,本人保护,引入前端工程化的思维,进步繁琐的流程以及开发效率。 引入工程化基于Webpack4.x,自定义Webpack配置 scss编译为wxss:定义全局变量,应用公共的款式文件,进步css开发效率和可维护性; 主动压缩图片资源 : 小程序对包大小有限度,压缩图片大小能够缩小空间,放慢页面加载;一般的图片压缩须要将图片上传到在线图片压缩网站,压缩完再保留下来,效率比拟低。当初执行命令就能够主动压缩图片。 代码标准 eslint: 能在js运行前就辨认一些根底的语法错误,缩小不必要的小问题,进步调试效率; husky、line-staged、prettier: 对立团队代码标准: 当执行代码提交到git仓库时,会将已改变文件的代码格式化对立标准的代码格调; 命令行创立页面和组件模板 小程序每次新建页面或者组件,须要依赖4个文件(.wxml,.js,.wxss,.json)。只须要执行npm run create命令,会提醒抉择创立页面还是组件,抉择实现输出页面或者组件的名字,会主动生成4个模板文件(.wxml,.js,json,.scss)到对应的目录 引入jest单元测试 生成测试覆盖率 我的项目构造 app -> 小程序程序的入口,应用微信开发者工具制订app目录cli -> 生pages和components的模板脚手架img -> 图片资源原文件.eslintignore.eslintrc.js.gitignore(疏忽wxss的提交,多人和做改变,容易有抵触,将scss文件传到服务器就好了).prettierrc.js(代码格式化格调配置)babel.config.jsjest.config.js(单元测试配置文件)webpack.compress.js(指定入口图片资源文件,将图片压缩编译到小程序的资源目录)webpack.config.js -> (工程化入口文件,指定入口scss文件,监听文件变动,主动将scss编译为wxss)我的项目应用的包文件webpack、babel、eslint: 转换、标准jschalk: console.log打印黑白色彩scss、css-loader: 编译scssfiglet: 控制台显示字体款式husky,line-staged,prettier: 代码格式化相干jest、miniprogram-simulate: 单元测试我的项目运行. 装置依赖    npm install 或 yarn install. 编译scss    npm run dev. 压缩图片    npm run img. 单元测试    npm run test(生成测试报告)    npm run test:watch(监听测试文件改变—开发环境下应用)示例编译scss执行 npm run dev 压缩图片执行 npm run img将图片压缩到app/assets/img目录下,一张7k的图片变成5k,肉眼看不出有什么差异。 新建页面执行 npm run create终端会提醒抉择页面还是组件,抉择页面,按Enter键,输出页面的名称,会主动将4个文件创建到app/pages/xxx下。 新建组件执行 npm run create终端会提醒抉择页面还是组件,抉择组件,按Enter键,输出组件的名称,会主动将4个文件创建到app/components/xxx下。 单元测试执行 npm run test 生成测试报告执行 npm run test:watch 监听测试文件,不便开发应用 其余思考工程化的初衷就是为了缩小重复性的操作,进步编码的效率和乐趣。 JavaScript是弱类型语言,益处是灵便,害处是太灵便(多人合作,保护他人写的代码就是很苦楚了)。 我的项目最次要的是持重,可高度自定义拓展,不拘谨于版本和地上那方,特地多人合作的团队,工程化能给团队带来更多的收益,后续也会思考将TypeScript等其余好的计划引入我的项目。 我的项目源码https://github.com/czero1995/miniprogram-cli

September 1, 2020 · 1 min · jiezi

关于小程序:粤工惠首创智送清凉活动互联网工会新模式打造智慧工会平台

作者|王启名 7 月 31 日,广东省总工会启动「智送清凉 关爱职工」流动,以「互联网+工会」模式,独创性地将广东工会「粤工惠」实名制服务平台与微信生态体系相交融,实现笼罩全省 400 万商家,更以「无感召」的便捷应用体验,和数据驱动的流程,构建出「工会大数据+微信生产券」的全新模式。 这一针对户外劳动者的福利发放流动,实现了更普惠、更常态、更精准的「送清凉」新形式。 突破时空局限,400 万商家继续 1488 个小时的「天天送」这次的「智送清凉」流动,一共联动了全省 400 万商家,两个月不间断的总时长共计 1488 个小时。 在这 1488 个小时里,流动用户能够在线上进行清凉券的支付,当他们在线下门店进行生产的时候,应用微信领取便会主动抵扣清凉券的优惠金额。 与以往线下送清凉固定的「点对面」式「发放-接管」流动不同,这次的流动以更加互联网化的思维,构建出一套实时动态化的「点对点」式「发放-接管」关系,正是这种新的关系,让流动解脱掉以往的派发局限。 在过来,所有的户外工作者只能定时或定点地支付清凉物资,这对于工夫和行为轨迹极不固定的户外工作者来说十分不不便。 当初,有了遍布全省各个角落的 400 万店家笼罩,送清凉流动能够间接省去了线下摆台发放物资这样的传统形式,每一家街边的商店都能够是清凉券的线下支付点。清凉物资的支付不再受到时空的局限,真正实现了常态化的清凉「天天送」。 技术实现关心,无感召体验带来「便捷送」户外工作者的工作与生活节奏与咱们常人很不一样,习惯于穿梭在大街小巷的他们,每时每刻都在与工夫赛跑。 家喻户晓,城市生产券是一种常见的刺激生产伎俩,通过小额的政府补贴模式撬动生产增长,从而促成短期内的消费市场的回暖。特地是在 2020 年的疫情之后,城市生产券就更是频繁地呈现在咱们的生存里。 「清凉券」是「智送清凉」流动团队借用微信领取城市生产券为原型,针对户外工作者这一非凡的垂直用户群体所设计的非凡抵用券。 一方面,清凉券每天可抵扣的金额可能补贴到户外工作者;另一方面,户外工作者在地理位置上散布宽泛且机动性高的特点,也使得清凉券比个别的城市生产券,能更迅速地深刻到各个地区,从而肯定水平上带活那儿的生产。 但咱们着重要说的,还是「清凉券」的无感召领取体验。 思考到本次流动对象的所在群体中,环卫职工群体的年龄绝对偏大,对于手机的操作熟练度并不是很高。而外卖与快递小哥的工作节奏绝对较快,没有那么多工夫去凑合以往那种繁琐的领券-用券流动流程。 综合以上起因,流动团队在设计「清凉券」之初,便力求将领券的操作门槛尽可能升高,将用券操作流程尽可能简化。 最终实现了在领券到用券的理论过程里,只需在「粤工惠送清凉」微信小程序上点击领券,而后在线下生产时间接应用微信领取即可实现用券,简略到甚至没有感知,为户外工作者繁忙的生存多争取了一点休息时间,也为这次的流动增多了一丝人文关心,真正实现了普惠化的清凉「便捷送」。 数据再造流程,大数据挖掘与实时反馈实现「精准送」广东省总工会的官网粤工惠 App 上线一年多来,粤工惠 App 共计吸纳了超过 400 万工会会员进行实名信息认证。 正是这样宏大工会会员数量作为大数据信息根底,「粤工惠送清凉」小程序才得以精准甄别,哪些登入的用户属于户外工作者,从而让清凉精准触达到这次流动的对象群体。 如果说粤工惠 App 是这次「智送清凉」流动得以发展的前提保障。那么爱范儿所提供的技术服务则是引爆这次流动的催化剂。 *广东省总工会与爱范儿合影留念 此次流动的微信小程序「粤工惠送清凉」,是基于爱范儿旗下的技术服务平台——通晓云开发的。通晓云的 Serverless 无服务架构, 免去了小程序开发中服务器搭建、域名备案、数据接口实现等繁琐流程, 同时又使用牢靠而高效的云服务,  来反对高并发, 快响应的应用服务。 因而从「智送清凉」流动立项,到正式上线,在极短的工夫内流动团队便搭建出了性能非常残缺的小程序利用。同时,基于通晓云稳固的服务,能够接受突发大流量冲击,为流动的全面推广提供了技术保障。 流动期间,「粤工惠送清凉」小程序端应用各类工具、组件,十分准确地监测流动停顿状况并实时反馈,通过查看流动参加对象领券的沉闷时段和等各类等诸多信息,输入参加流动的户外劳动者的准确用户画像,以「数据驱动」的逻辑,时刻关注流动对象一方的数据动静,一直剖析使用者反映出的数据,来调整流动的细节,实现服务对使用者的正向反馈。 其中最为典型的例子,便是流动的「清凉降级」。当流动进行到第 18 天的时候,技术人员依据半个多月来所采集到的用户反馈数据,推断流动有通过策略上的调整能够达到更佳成果的可能性。得悉这一信息反馈后,流动组迅速在外部进行了领券策略降级的模式探讨,并在数天后,实现了升级版流动的迭代。 在「清凉降级」正式上线的三天之内,流动参加人数与核销金额等数据连连大幅增长,胜利调动起全省数万名户外工作者的流动参加激情。 这一案例充分说明了这次「智送清凉 关爱职工」流动的创新性,因为它并非单纯复制以往的案例,而是在「互联网+」的根底上以一种更为粗浅的「数据驱动」逻辑,推动工会流动流程再造,进而实现清凉的「精准送」。 政企单干助力创始「智慧工会」服务新模式广东省总工会智慧办主任沈寒英示意,以后广东省着力建设「数字广东」,广东工会也在致力建设「智慧工会」,通过利用先进的信息化伎俩,营造网上工会生态,为各级工会和会员提供更多、更好、更精准的服务。利用创新性的政企单干模式,通过大数据的互通连结实现了「粤工惠」会员数据在微信生态下的高效率利用,实现了工会送清凉流动的「便捷送、精准送、天天送」三大个性。广东省总工会此次流动,是对「工会要保持以职工为核心的工作导向」的一次贯彻落实,不仅取得了广大职工的认可和更严密的凝聚,更是对工会工作流传力、疏导力、影响力的一次微小晋升,对广东各级工会组织的自我改革、翻新倒退的一次深度的引领、推动和示范。 接下来,省工会还将持续与爱范儿单干,通过爱范儿先进的技术开发和数字营销能力,实现全方位数字化转型和全链路营销模式。 ...

August 31, 2020 · 1 min · jiezi

关于小程序:如何实现小程序用户增长开发者给了几点关键建议

目前除了微信小程序,还有支付宝小程序,百度小程序,字节跳动小程序、京东小程序等,各大流量平台都心愿借助小程序的服务连贯能力,为企业和用户提供更好的服务。企业在小程序赛道上的策略布局,能够借助平台的流量,取得更多的用户和变现。 有些人会认为小程序用户增长是经营的事件,与产品和开发无关,实则不然。对于全栈工程师来说,他们不仅能做好小程序,还能玩溜小程序,真正全方位、无死角实现用户增长最大化。 小晓云近期采访了几位开发者,他们的小程序有些曾经冲破百万用户,在本人的畛域中取得持续性的倒退。开发者围绕用户增长中的拉新、留存、转化等维度,为咱们提供了对于产品设计和开发的倡议,心愿以下的教训对你们都有帮忙。 分享 1:小程序视觉和交互是重点,能够借鉴同行让产品更合乎公众需要小程序的特点是「即搜即用,用完即走」,更适宜那些轻量级的工具型利用。用户来得快去得也快,则更须要简洁、轻便的设计定位。UI 设计师和前端开发者平时能够通过通晓商店等小程序商店,多参考同类型优良小程序的设计与交付,以此优化本人的小程序。尽管小程序视觉和交互并不会带来用户裂变式增长,但这个是留住用户最根本的要求了。 分享 2:微信小程序订阅音讯是一个用户回流的神器往年微信小程序从模板音讯降级为订阅音讯,这是一个帮忙小程序实现用户回流重要能力了。对于开发者来说,重点思考:如何正当的向用户直观传播订阅音讯、在何处弹出订阅音讯。开发者在接入订阅音讯能力时,应该抉择适宜业务场景的模板,并进行文案的疏导,同时能够尝试,发动一次订阅时同时订阅多个模版,让用户一次性取得更多音讯,进步订阅率。新用户粘性较低,能够借助订阅音讯发送处分告诉等,召回用户。 分享 3:联合业务和用户特点,策动合乎平台调性的流动咱们原先是做体育畛域的资讯和商城 App,微信小程序公布后,宏大的微信流量给了咱们一个拓展用户的新机会,于是在 2017 年与通晓云结缘,并相伴 3 年了。用户增长其实不是简略的一两句话能够总结,所以我先分享其中一点。体育畛域的资讯,能吸引和留住用户的,次要靠资讯的时效性、赛事流动、体育明星的加持,因而咱们曾组织体育明星的投票流动,粉丝乐于参加,同时也进步了认同感和自卑感。投票性能设置的门槛很低,但咱们减少了很多排行榜的文案疏导,增强粉丝的紧迫感,同时也减少了很多分享文案疏导,让粉丝被动分享。这个是针对体育畛域上很胜利的增长案例,当然也能够利用于其它追星平台等。 分享 4:做好数据分析,让数据驱动用户增长精细化经营的外围就是数据驱动,明确要害指标,并且通过数据分析的形式进行评估,而后一直优化。数据埋点的毛病是开发成本高,所以咱们是基于无埋点,一次性集成 SDK,采集页面拜访、点击行为、用户特色等全量数据。 分享 5:钻研小程序平台的用户爱好,提供他们想要的服务我是做 QQ 小程序的, QQ 小程序的用户对于社交、恋爱等偏娱乐的场景更感兴趣,针对性提供头像制作、起网名、小游戏等服务有比拟大的市场。所以能够联合平台用户的特点和爱好,开发相干服务的小程序,更有利于小程序的倒退和变现。 以上内容均来自通晓云开发者的教训分享,如果你对哪一个内容感兴趣,能够在文末或者小晓云微信上留言,对于大家感兴趣的内容,咱们将再次邀请开发者进行更全面更残缺的分享。 通晓云成立三年以来,通过提供不断更新的开发工具,帮忙开发者进步开发效率,轻松实现优良的作品。但咱们服务不止于快、省,还要在增长与变现上赋能开发者/企业。 通晓推送在线可视化操作加上业务零碎轻松集成,能够一键推送全平台的订阅音讯推送服务,轻松触达亿万用户。 实时数据库反对各类高实时性的业务场景,以简便的开发方式、更高的时效性实现在云端和客户端来的数据实时同步。通过实时数据库实现的即时聊天室、投票、直播间送礼和弹幕、小游戏等互动性能,晋升用户留存和转化。 经营后盾一键生成可视化的经营治理后盾,User Dash API 和开箱即用的前端组件库,开发者能够疾速编写一套独立的经营后盾,并反对一键部署至通晓云服务器,是开发者的利器,也是运营者的福音。 通晓云福利时刻在 2020/08/21 - 2020/08/31 期间,参加邀请流动,可取得以下处分: 胜利邀请一名新用户,邀请者可取得 30 元代金券,被邀请者可取得 90 元代金券,邀请越多处分越多。???? 立刻邀请邀请者与被邀请者同时购买包年套餐,即可同时享受劲爆团购价。流动详情请征询小晓云(微信号:minsupport3) 通晓云三周年庆,全线产品价格全年最优惠。包年套餐折上折,最低只需 4 折,购买再送等同金额的代金券,约等于包年套餐收费用。????立刻购买 新能力「实时数据库」限时限量收费体验,仅限 2020/08/31 前注册的用户。????立刻注册,支付 120 元

August 20, 2020 · 1 min · jiezi

关于小程序:使用MpKit的事件MixinSetData优化全局拦截等功能增强开发多平台小程序

MpKit与本文章均在不断更新,为保障您获取到的内容是最新的,请关注:https://imingyu.github.io/2020/mpkit/前言近年来,多个公司都开发出了小程序这样的“微利用”计划,其在生态扩大、性能加强等方面都施展着重要的作用; 作为开发者却要同时面对多个小程序平台,实现类似的性能,如果不思考应用框架的话,在底层的一些根底技术解决方案上,有没有一个轻量级的抉择? 咱们在开发一个小程序时,往往会有以下技术需要: 全局事件总线优化小程序的setData函数心愿将App/Page/Component上的共有性能拆分,并能够有效性的反复利用,甚至组建为App/Page/Component基类能够全局拦挡执行某些操作,如:异样报错、网络申请、性能禁止、App/Page/Component的生命周期等基于以上需要,都是我以往实现过的性能,所以我将我的经验总结成了一个开源我的项目MpKit,外面就蕴含对以上需要的性能实现,且不止于此; MpKit的次要性能都通过单元测试,可放心使用,我的项目主页:https://github.com/imingyu/mpkit; 上面我来介绍下它的具体用法和性能列表。 简介MpKit公布到了NPM平台,以模块化的形式划分为多个包,某些包不止能用在小程序平台,还能够用到h5等平台;某些包却无奈在小程序上应用,包列表及相干性能如下: 以下包均反对TypeScript语言包 实用平台 简介 小程序 H5Node.js 微信支付宝百度字节跳动 @mpkit/inject●●●● 提供小程序环境实用的多种实用函数或组件,如setData优化、Mixin、事件总线等。查看文档@mpkit/ebus●●●●●●提供事件触发、监听等性能。查看文档@mpkit/mixin●●●● 为小程序提供混入性能。查看文档@mpkit/util●●●● 工具函数查看文档装置如果你的小程序我的项目中反对引入npm包,那么你间接依据本人的须要装置对应包即可,如: npm i @mpkit/ebus -S然而如果你是原生开发,不反对引入npm包,你最大的可能须要用到@mpkit/inject包,此包中的性能根本蕴含了其余包的所有性能,且反对按需插件化装置,可节俭你的字节空间;应用@mpkit/inject: 在磁盘任意地位创立长期目录如xx/temp;在此目录中执行命令:npm i @mpkit/inject找到xx/temp/node_modules/@mpkit/inject下的dist目录,将其下内容拷贝到你的小程序我的项目目录下;找到dist/config.js文件,将你须要的性能插件引入,如:// 提供事件类性能import { plugin as EbusPlugin } from './plugins/ebus';// 提供混入性能import { plugin as MixinPlugin } from './plugins/mixin';// 提供setData优化import { plugin as SetDataPlugin } from './plugins/set-data';var config = { // 是否重写全局变量 rewrite: { App: false, // 重写全局变量App为 plugins/mixin 中的MkApp 即 MpKit.App Page: false, // 重写全局变量Page为 plugins/mixin 中的MkPage 即 MpKit.Page Component: false, // 重写全局变量Component为 plugins/mixin 中的MkComponent 即 MpKit.Component Api: false, // 重写全局api变量wx/my/tt为 plugins/mixin 中的MkApi 即 MpKit.Api setData: false // 重写Page/Component中的setData为优化后的setData 即 MpKit.setData }, plugins: [ EbusPlugin, MixinPlugin, SetDataPlugin ]};export default config;如果配置了config.rewrite项,请在小程序我的项目的app.js的第一行处引入@mpkit/inject/dist中的index.js文件,否则无奈实现全局变量重写;如果没有配置该项,则须要在应用时引入,如:import MpKit from '@mpkit/inject/dist/index';MpKit.on(...);装置实现。小提示:不须要的插件js文件能够间接删掉,插件不间接相互依赖。应用这里着重介绍@mpkit/inject包的应用形式和细节,其余包可自行参考对应文档;@mpkit/inject包提供下列性能, ...

August 19, 2020 · 3 min · jiezi

关于小程序:微慕小程序开源版A标签优化说明

微慕WordPress小程序所有版本里,对于文章详情里文字内容的解析,都是通过开源组件:wxParse 不过这个组件曾经进行保护,微慕小程序在这个组件上做了一些优化,让文章里文字在小程序显示更加完满。但,对于A标签的解析,始终不够欠缺,比方不能很好跳转小程序里的任意页面,不能跳转到其余小程序,不能关上蕴含业务域名的链接。 比方在文章里跳转到另一个文章,在pc端的html里能够轻易实现的,在小程序却比拟艰难,因为小程序的页面和pc端的页面门路不是一样的。微慕小程序原来的解决方案-wordpress的固定链接设置成如下格局: 而后在小程序端解析这个链接,实现小程序的页面跳转。但这个解决方案不敌对: 1、过于依赖固定链接的格局,而且并不是所有wordpress网站都用这个格局,如果仅仅为了页面跳转就调整固定链接格局,对SEO很不利,代价太大。 2、只能跳转文章的页面,对于其余页面,比方分类、标签页面,就无奈跳转了。 那如何做到既实现在pc端的链接跳转又能够实现在小程序里“定制化”的跳转,受到短代码的启发,能够给A标签加上特定的属性,用于反对小程序里的A标签自定义跳转。于是我在标签里加了三个属性: 1、appid : 须要跳转小程序的appid ,如果是跳转本小程序或业务域名的链接,不须要填写这个属性。 2、path : 小程序页面门路(包含参数),无论是跳转本小程序,还是其余小程序都须要填写这个属性。对于微慕小程序的页面门路和参数的获取能够通过小程序的开发工具,获取办法能够看这个视频:微慕WordPress小程序开发教程——获取小程序页面门路 对于其余小程序的页面门路的获取,请看文章:获取更多页面门路 3、redirectype:跳转的类型,apppage-跳转本小程序 miniapp-跳转其余小程序 webpage-跳转业务域名的链接 优化后的A标签模式如下: 在小程序端显示款式如下图所示:如果是跳转小程序,会在链接后面看见一个小程序logo图标 当然这种对A标签的优化须要手动退出这个三个属性,如果是以前的文章须要再次编辑退出,还是有些麻烦,不过对于新文章你能够思考采纳这个形式来跳转了。 为了不便退出这个优化的A标签,我给TinyMCE编辑器减少A标签按钮,简化录入形式,只须要增加相干属性的值即可。 特地留神:在应用TinyMCE编辑器里,如果应用优化的A标签,不要切换到“可视化”模式,只能在“文本”模式应用,如果切换到“可视化”模式会把原来增加到A标签的三个属性去掉,可能编辑器感觉这三个属性不是规范属性,于是就删除了。 微慕小程序专业版和微慕小程序增强版曾经反对该性能。 btw: 微慕小程序开源版最近做一些小更新,次要更新的内容如下: 1、分享到朋友圈。 2、优化腾讯视频解析 3、去除“猜你喜爱”中反复的文章 4、修复工夫格式化的bug 5、优化A标签的跳转 谢谢你的浏览,谢谢你对微慕小程序的反对。 原文链接:https://www.watch-life.net/wechat/about-minapper-free-a-tag.html

August 17, 2020 · 1 min · jiezi

关于小程序:微慕小程序开源版A标签优化说明

微慕WordPress小程序所有版本里,对于文章详情里文字内容的解析,都是通过开源组件:wxParse 不过这个组件曾经进行保护,微慕小程序在这个组件上做了一些优化,让文章里文字在小程序显示更加完满。但,对于A标签的解析,始终不够欠缺,比方不能很好跳转小程序里的任意页面,不能跳转到其余小程序,不能关上蕴含业务域名的链接。 比方在文章里跳转到另一个文章,在pc端的html里能够轻易实现的,在小程序却比拟艰难,因为小程序的页面和pc端的页面门路不是一样的。微慕小程序原来的解决方案-wordpress的固定链接设置成如下格局: 而后在小程序端解析这个链接,实现小程序的页面跳转。但这个解决方案不敌对: 1、过于依赖固定链接的格局,而且并不是所有wordpress网站都用这个格局,如果仅仅为了页面跳转就调整固定链接格局,对SEO很不利,代价太大。 2、只能跳转文章的页面,对于其余页面,比方分类、标签页面,就无奈跳转了。 那如何做到既实现在pc端的链接跳转又能够实现在小程序里“定制化”的跳转,受到短代码的启发,能够给A标签加上特定的属性,用于反对小程序里的A标签自定义跳转。于是我在标签里加了三个属性: 1、appid : 须要跳转小程序的appid ,如果是跳转本小程序或业务域名的链接,不须要填写这个属性。 2、path : 小程序页面门路(包含参数),无论是跳转本小程序,还是其余小程序都须要填写这个属性。对于微慕小程序的页面门路和参数的获取能够通过小程序的开发工具,获取办法能够看这个视频:微慕WordPress小程序开发教程——获取小程序页面门路 对于其余小程序的页面门路的获取,请看文章:获取更多页面门路 3、redirectype:跳转的类型,apppage-跳转本小程序 miniapp-跳转其余小程序 webpage-跳转业务域名的链接 优化后的A标签模式如下: 在小程序端显示款式如下图所示:如果是跳转小程序,会在链接后面看见一个小程序logo图标 当然这种对A标签的优化须要手动退出这个三个属性,如果是以前的文章须要再次编辑退出,还是有些麻烦,不过对于新文章你能够思考采纳这个形式来跳转了。 为了不便退出这个优化的A标签,我给TinyMCE编辑器减少A标签按钮,简化录入形式,只须要增加相干属性的值即可。 特地留神:在应用TinyMCE编辑器里,如果应用优化的A标签,不要切换到“可视化”模式,只能在“文本”模式应用,如果切换到“可视化”模式会把原来增加到A标签的三个属性去掉,可能编辑器感觉这三个属性不是规范属性,于是就删除了。 微慕小程序专业版和微慕小程序增强版曾经反对该性能。 btw: 微慕小程序开源版最近做一些小更新,次要更新的内容如下: 1、分享到朋友圈。 2、优化腾讯视频解析 3、去除“猜你喜爱”中反复的文章 4、修复工夫格式化的bug 5、优化A标签的跳转 谢谢你的浏览,谢谢你对微慕小程序的反对。 原文链接:https://www.watch-life.net/wechat/about-minapper-free-a-tag.html

August 17, 2020 · 1 min · jiezi

关于小程序:微慕WordPress小程序增强版v20发布

2020年7月10日,我进行了一场微信小程序的直播,直播主题:微慕小程序增强版v2.0版新性能阐明, 在直播里对微慕增强版v2.0版全面论述了新版本减少的性能。 微慕小程序增强版定位就是多端平台内容的散发,因而所有的减少新性能都是围绕此发展。微慕小程序增强版反对:微信、百度、QQ、支付宝、头条等多端,不过目前我集体感觉,这五端倒退是极不均衡的,QQ、支付宝、头条小程序目前显著落后于微信和百度,或者它们定位自身就是防御性的,占坑而已,真正倒退比拟好其实就只有微信小程序,基本上把微信生态各环节都买通了,真正做到了小程序用完即走;同时百度小程序也是围绕百度搜寻来运作的,小程序的定位为百度搜寻一个“延长”工具,因而百度小程序所有外围性能次要是反对百度的SEO。微慕小程序增强版也是基于上述小程序的特点进行性能更新。 微慕WordPress小程序增强版v2.0 次要更新的性能如下: 一、全面优化后盾设置因为多端小程序,小程序的配置放在小程序端来配置的话,不不便,且如果调整配置的话须要从新提交,此次版本更新简直把所有的配置都迁徙到插件后盾进行设置,在小程序端只有设置一个域名即可。在插件后盾减少了一个“扩大配置,”用来配置: 1、首页轮播 2、精选栏目 3、自定义广告 同时,这些跳转反对三种形式跳转类型: 1、跳转本小程序页面 2、跳转其余小程序 3、跳转业务域名的链接和关联的公众号的文章链接 扩大设置的界面如下图所示: 二、反对自定义短代码和优化A标签优化自定义短代码的性能在专业版上曾经反对,增强版的短代码做了优化,反对多端。 A标签的优化,次要是扩大了A标签的跳转,在以前的小程序版本里,A标签的跳转只有两种形式:1、按特定的固定链接格局跳转本小程序页面;2、复制A标签的链接,并提醒在浏览器里复制关上。这极大限度了A标签的性能。增强版在A标签上减少了属性,这些属性岂但放弃了原A标签在PC端的跳转,同时反对小程序端的跳转需要。减少的新属性如下: 1、appid : 小程序的appid,如果跳转其余小程序,须要设置这个属性。 2、path : 小程序的页面门路。跳转小程序页面,须要设置这个属性。 3、redirectype:跳转的类型,A标签反对的跳转类型和短代码一样反对三种形式:跳转本小程序页面,跳转其余小程序,跳转业务域名的链接和关联的公众号文章链接 同时,如果没有设置上述属性,保留着原有两种形式的跳转。 优化后的A标签模式如下: 在小程序端显示款式如下图所示: 三、反对百度天然搜寻和信息流举荐资源api增强版上一个版本的插件曾经反对通过上传sitemap文件提交天然搜寻和信息流举荐资源,但这个形式有肯定的技术难度,操作起来很麻烦,同时也无奈及时收到提交的反馈。百度小程序提供了api提交的形式,据此新版本里减少了对这个形式的反对。提交的形式有两种,一种是在插件的后盾多条记录提交,一种是在小程序的里按需单条记录提交。 通过api的形式提交相干百度资源,十分有利于小程序在百度app里的收录和搜寻,极大进步小程序的曝光度。 在插件的后盾提交的形式如下图所示: 在小程序里提交的形式如下图所示: 四、反对百度小程序“关注组件”、“索引页组件”和“一站式互动组件”百度小程序和其余小程序有一个最大的不同点:提供官网的组件给小程序应用,同时这些组件相干交互也会与百度app进行交互,并存储交互数据在百度app的服务里。通过这样的组件,就能够把用户、小程序 与百度app紧紧绑定在一起。我不确定这个形式对小程序用户是不是最佳的抉择,但这就是百度小程序的游戏规则,你适应之,就会取得百度提供的“特权”。 特地是“一站式互动组件” 提供了评论、点赞、分享、珍藏,尽管很不便,但所有数据都存在百度服务里。微慕增强版曾经反对评论、点赞、分享这些性能,因而新版本兼容了这两种形式,小程序开发者能够依据本人的须要来抉择用那个形式反对小程序和用户的互动。 关注组件显示成果如下: 一站式互动组件在小程序里的显示成果如下: 一站式互动组件百度app里显示成果如下: 五、反对微信小程序的直播和分享到朋友圈微信小程序直播和分享到朋友圈 相干的性能在专业版曾经反对,具体的介绍见本站的相干文章,这里就不赘述了。 将来,咱们团队将持续摸索,针对增强版多端小程序各自特点,有针对性的优化和欠缺,敬请关注。 谢谢你的浏览和反对。 原文链接:https://www.watch-life.net/wordpress/minapper-plus-v-2.html

August 17, 2020 · 1 min · jiezi

关于小程序:微慕WordPress小程序增强版v20发布

2020年7月10日,我进行了一场微信小程序的直播,直播主题:微慕小程序增强版v2.0版新性能阐明, 在直播里对微慕增强版v2.0版全面论述了新版本减少的性能。 微慕小程序增强版定位就是多端平台内容的散发,因而所有的减少新性能都是围绕此发展。微慕小程序增强版反对:微信、百度、QQ、支付宝、头条等多端,不过目前我集体感觉,这五端倒退是极不均衡的,QQ、支付宝、头条小程序目前显著落后于微信和百度,或者它们定位自身就是防御性的,占坑而已,真正倒退比拟好其实就只有微信小程序,基本上把微信生态各环节都买通了,真正做到了小程序用完即走;同时百度小程序也是围绕百度搜寻来运作的,小程序的定位为百度搜寻一个“延长”工具,因而百度小程序所有外围性能次要是反对百度的SEO。微慕小程序增强版也是基于上述小程序的特点进行性能更新。 微慕WordPress小程序增强版v2.0 次要更新的性能如下: 一、全面优化后盾设置因为多端小程序,小程序的配置放在小程序端来配置的话,不不便,且如果调整配置的话须要从新提交,此次版本更新简直把所有的配置都迁徙到插件后盾进行设置,在小程序端只有设置一个域名即可。在插件后盾减少了一个“扩大配置,”用来配置: 1、首页轮播 2、精选栏目 3、自定义广告 同时,这些跳转反对三种形式跳转类型: 1、跳转本小程序页面 2、跳转其余小程序 3、跳转业务域名的链接和关联的公众号的文章链接 扩大设置的界面如下图所示: 二、反对自定义短代码和优化A标签优化自定义短代码的性能在专业版上曾经反对,增强版的短代码做了优化,反对多端。 A标签的优化,次要是扩大了A标签的跳转,在以前的小程序版本里,A标签的跳转只有两种形式:1、按特定的固定链接格局跳转本小程序页面;2、复制A标签的链接,并提醒在浏览器里复制关上。这极大限度了A标签的性能。增强版在A标签上减少了属性,这些属性岂但放弃了原A标签在PC端的跳转,同时反对小程序端的跳转需要。减少的新属性如下: 1、appid : 小程序的appid,如果跳转其余小程序,须要设置这个属性。 2、path : 小程序的页面门路。跳转小程序页面,须要设置这个属性。 3、redirectype:跳转的类型,A标签反对的跳转类型和短代码一样反对三种形式:跳转本小程序页面,跳转其余小程序,跳转业务域名的链接和关联的公众号文章链接 同时,如果没有设置上述属性,保留着原有两种形式的跳转。 优化后的A标签模式如下: 在小程序端显示款式如下图所示: 三、反对百度天然搜寻和信息流举荐资源api增强版上一个版本的插件曾经反对通过上传sitemap文件提交天然搜寻和信息流举荐资源,但这个形式有肯定的技术难度,操作起来很麻烦,同时也无奈及时收到提交的反馈。百度小程序提供了api提交的形式,据此新版本里减少了对这个形式的反对。提交的形式有两种,一种是在插件的后盾多条记录提交,一种是在小程序的里按需单条记录提交。 通过api的形式提交相干百度资源,十分有利于小程序在百度app里的收录和搜寻,极大进步小程序的曝光度。 在插件的后盾提交的形式如下图所示: 在小程序里提交的形式如下图所示: 四、反对百度小程序“关注组件”、“索引页组件”和“一站式互动组件”百度小程序和其余小程序有一个最大的不同点:提供官网的组件给小程序应用,同时这些组件相干交互也会与百度app进行交互,并存储交互数据在百度app的服务里。通过这样的组件,就能够把用户、小程序 与百度app紧紧绑定在一起。我不确定这个形式对小程序用户是不是最佳的抉择,但这就是百度小程序的游戏规则,你适应之,就会取得百度提供的“特权”。 特地是“一站式互动组件” 提供了评论、点赞、分享、珍藏,尽管很不便,但所有数据都存在百度服务里。微慕增强版曾经反对评论、点赞、分享这些性能,因而新版本兼容了这两种形式,小程序开发者能够依据本人的须要来抉择用那个形式反对小程序和用户的互动。 关注组件显示成果如下: 一站式互动组件在小程序里的显示成果如下: 一站式互动组件百度app里显示成果如下: 五、反对微信小程序的直播和分享到朋友圈微信小程序直播和分享到朋友圈 相干的性能在专业版曾经反对,具体的介绍见本站的相干文章,这里就不赘述了。 将来,咱们团队将持续摸索,针对增强版多端小程序各自特点,有针对性的优化和欠缺,敬请关注。 谢谢你的浏览和反对。 原文链接:https://www.watch-life.net/wordpress/minapper-plus-v-2.html

August 17, 2020 · 1 min · jiezi

关于小程序:微信小程序开放分享到朋友圈功能

2020年7月7日(据说是6日深夜),一个很特地的日子,微信低调地放开了一个性能:微信小程序“分享到到朋友圈”,这个看似渺小的变动,对微信小程序来说意义重大。 用fenng大的话说就是: 目前此性能没有齐全放开,需微信安卓7.0.16版本才反对,灰度测试 ,iOS版本暂不反对。 微慕小程序专业版和微慕小程序增强版曾经反对该性能。 想让小程序提供“分享到朋友圈”的性能,小程序端须要通过调用wx.showShareMenu 这个api,反对此性能,具体的操作步骤如下: 1.设置“调试根底库”的版本wx.showShareMenu api反对分享朋友圈的性能参数“menus”须要根底库2.11版本以上,因而首先在微信小程序开发工具里设置根底库为2.11版本以上 设置实现后,在点击小程序右上角的三个点,会呈现“分享到朋友圈”的按钮,不过是灰色的,无奈触发。 2.调用wx.showShareMenu api在须要转发的页面的onLoad(onShow也能够)事件里退出如下代码: `wx.showShareMenu({ withShareTicket:true, menus:['shareAppMessage','shareTimeline']` }) 退出后,点击小程序右上角的三个点“分享到朋友圈”按钮就能够应用了 在开发工具里能够预览分享的成果 小程序提交审核公布后,在敌人圈里的分享成果如下 分享后的封面图是默认小程序的logo,题目是默认以后分享的小程序的页面导航题目。 点击关上小程序后,跳转到分享的小程序页面,点击不能间接应用小程序的跳转,须要点击下方的“返回小程序”才是真正进入小程序。 这个性能目前还有欠缺,在开发工具里里查看小程序的分享页,如果小程序里有“updateManager.onUpdateReady”办法来更新小程序,会提醒报错: Cannot read property 'onUpdateReady' of undefined 目前小程序分享到到朋友圈的形式是:小程序单页模式,并不会间接关上小程序,无奈交互。“单页模式”下,页面顶部固定有导航栏,题目显示为分享时的题目,非常适合浏览类、内容类、资讯类小程序;顶部导航栏与底部操作栏均不反对自定义款式。当前开发须要思考单页模式的布局,同时也要思考专门为转发朋友圈来设计页面导航题目。 无关单页面模式的适配和限度详见微信官网文档: https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html 以上这些功能设计,就是微信避免此性能的滥用。 3.自定义分享的封面、题目和页面参数能够应用页面的分享朋友圈事件处理函数:onShareTimeline(), 编写办法参考微信开发文档:https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html#onShareTimeline 微信小程序都推出3年了,但转发始终不能转发到朋友圈,总算开了这个口子,这对小程序来说是微小的利好,置信后续会不断完善,既减少小程序的曝光率,也避免滥用,这点我对微信的产品设计有信念,此前始终都十分克服。 原文链接:https://www.watch-life.net/wechat/wechat-mini-programs-sharetimeline.html

August 17, 2020 · 1 min · jiezi

关于小程序:微信小程序直播安装和开发指南

2020年2月28日微信小程序直播能力启动公测。微信小程序直播是微信官网提供的商家经营工具,商家可通过在小程序内直播,实现商家与生产用户互动,同时进行商品销售的闭环。在直播的时候无需任何的跳转,间接下单,进步下单转化率。这让直播成为买通商家和生产用户的重要销售渠道。 微慕WordPress小程序专业版 v3.0 和微慕小程序增强版V2.0曾经上线了微信小程序直播性能 微慕团队2020年5月28日在微信小程序专业版进行了《微慕小程序开发调试》的直播。错过过后直播的敌人,能够观看直播的回放,直播回放观看办法: 1.在微信里搜寻:“微慕”,关上微慕小程序,小程序的首页有直播导航链接,点击进入后,可观看直播。 2.微信扫描如下二维码观看: 微慕团队打算将推出更多无关更多无关“微信小程序”开发的直播课程,欢送有趣味的敌人分割咱们,通知咱们你想咱们分享哪些微信小程序相干开发内容。 小程序直播开明条件合乎以下条件且收到邀请的搭档即可开明: 满足小程序18个凋谢类目 主体下小程序近半年没有重大违规 小程序近90天内,有过领取行为 主体下公众号累计粉丝数大于100人 主体下小程序间断7日日沉闷用户数大于100人 主体在微信生态内近一年广告投放理论耗费金额大于1万元注:条件中1、2、3必须满足,4、5、6满足其一即可。 小程序直播申请办法1.进入小程序后盾,申请类别:商家自营->百货或服装或美妆等类目 2.开明微信领取。 3.如果没有领取行为,如果你应用的是基于微慕小程序(开源或专业版都能够)开发的小程序,在小程序里赞叹或付费浏览一次(专业版)。个别第二天就会有一次领取记录了。 .以上三项满足,小程序后盾性能下就会呈现直播,点击申请 如果还不能申请,可能是因为小程序关联的公众号粉丝没有满100,或主体下小程序间断7日日沉闷用户数没有大于100人,这两个很容易实现。 小程序直播创立直播间在小程序后盾创立直播间,能够抉择“手机直播”和“推流设施直播”,具体的创立办法参考官网的文档:《微信小程序直播经营操作手册》 对于手机很简略,直播开始后,主播通过手机端扫描直播二维码就能够开始,但对于推流直播,须要通过第三方推流设施进行直播,无关推流直播设置办法详见下文。 小程序里装置直播插件更新(2020年5月26日):在小程序管理后盾直播菜单中开明小程序直播组件后,间接依据文档阐明开发应用即可,无需在“设置-第三方设置-插件治理”中再增加小程序直播组件。 1.在微信小程序后盾设置插件受权 点击增加“增加插件” 增加小程序插件受权显示如下: 2.在小程序端引入。 我的项目根目录的 app.json 援用,示例代码如下: “plugins”: { “live-player-plugin”: { “version”: “1.0.9”, “provider”: “wx2b03c6e691cd7370” } }“version”: 留神填写该直播组件最新版本号,微信开发者工具调试时可获取最新版本号; “provider”:必须填该直播组件appid,该示例值即为直播组件appid 3.应用直播插件 间接通过链接地址跳转到直播组件页面(即为进直播间页面)链接地址须要带上直播房间 id,这个id是创立直播后,能够在小程序后盾直播里查看到。 注:房间 id 可通过“获取直播房间列表” API 获取,详见链接:https://developers.weixin.qq.com/miniprogram/dev/framework/liveplayer/live-player-plugin.html 在页面里应用 navigateTo 办法跳转进入直播间,比方页面是index.js,代码如下: let roomId = 5// 填写具体的房间号 wx.navigateTo({ url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${roomId} }) // 其中wx2b03c6e691cd7370是直播组件appid不能批改在直播开始的时候,观看直播的用户就能够通过这个页面间接跳转到小程序直播间。 ...

August 17, 2020 · 1 min · jiezi

关于小程序:微信小程序直播安装和开发指南

2020年2月28日微信小程序直播能力启动公测。微信小程序直播是微信官网提供的商家经营工具,商家可通过在小程序内直播,实现商家与生产用户互动,同时进行商品销售的闭环。在直播的时候无需任何的跳转,间接下单,进步下单转化率。这让直播成为买通商家和生产用户的重要销售渠道。 微慕WordPress小程序专业版 v3.0 和微慕小程序增强版V2.0曾经上线了微信小程序直播性能 微慕团队2020年5月28日在微信小程序专业版进行了《微慕小程序开发调试》的直播。错过过后直播的敌人,能够观看直播的回放,直播回放观看办法: 1.在微信里搜寻:“微慕”,关上微慕小程序,小程序的首页有直播导航链接,点击进入后,可观看直播。 2.微信扫描如下二维码观看: 微慕团队打算将推出更多无关更多无关“微信小程序”开发的直播课程,欢送有趣味的敌人分割咱们,通知咱们你想咱们分享哪些微信小程序相干开发内容。 小程序直播开明条件合乎以下条件且收到邀请的搭档即可开明: 满足小程序18个凋谢类目 主体下小程序近半年没有重大违规 小程序近90天内,有过领取行为 主体下公众号累计粉丝数大于100人 主体下小程序间断7日日沉闷用户数大于100人 主体在微信生态内近一年广告投放理论耗费金额大于1万元注:条件中1、2、3必须满足,4、5、6满足其一即可。 小程序直播申请办法1.进入小程序后盾,申请类别:商家自营->百货或服装或美妆等类目 2.开明微信领取。 3.如果没有领取行为,如果你应用的是基于微慕小程序(开源或专业版都能够)开发的小程序,在小程序里赞叹或付费浏览一次(专业版)。个别第二天就会有一次领取记录了。 .以上三项满足,小程序后盾性能下就会呈现直播,点击申请 如果还不能申请,可能是因为小程序关联的公众号粉丝没有满100,或主体下小程序间断7日日沉闷用户数没有大于100人,这两个很容易实现。 小程序直播创立直播间在小程序后盾创立直播间,能够抉择“手机直播”和“推流设施直播”,具体的创立办法参考官网的文档:《微信小程序直播经营操作手册》 对于手机很简略,直播开始后,主播通过手机端扫描直播二维码就能够开始,但对于推流直播,须要通过第三方推流设施进行直播,无关推流直播设置办法详见下文。 小程序里装置直播插件更新(2020年5月26日):在小程序管理后盾直播菜单中开明小程序直播组件后,间接依据文档阐明开发应用即可,无需在“设置-第三方设置-插件治理”中再增加小程序直播组件。 1.在微信小程序后盾设置插件受权 点击增加“增加插件” 增加小程序插件受权显示如下: 2.在小程序端引入。 我的项目根目录的 app.json 援用,示例代码如下: “plugins”: { “live-player-plugin”: { “version”: “1.0.9”, “provider”: “wx2b03c6e691cd7370” } }“version”: 留神填写该直播组件最新版本号,微信开发者工具调试时可获取最新版本号; “provider”:必须填该直播组件appid,该示例值即为直播组件appid 3.应用直播插件 间接通过链接地址跳转到直播组件页面(即为进直播间页面)链接地址须要带上直播房间 id,这个id是创立直播后,能够在小程序后盾直播里查看到。 注:房间 id 可通过“获取直播房间列表” API 获取,详见链接:https://developers.weixin.qq.com/miniprogram/dev/framework/liveplayer/live-player-plugin.html 在页面里应用 navigateTo 办法跳转进入直播间,比方页面是index.js,代码如下: let roomId = 5// 填写具体的房间号 wx.navigateTo({ url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${roomId} }) // 其中wx2b03c6e691cd7370是直播组件appid不能批改在直播开始的时候,观看直播的用户就能够通过这个页面间接跳转到小程序直播间。 ...

August 17, 2020 · 1 min · jiezi

关于小程序:微慕小程序专业版支持WordPress自定义短代码

微慕小程序专业版反对在文章的详情页跳转商品卡片和公众号文章卡片;不过这些跳转卡片,只能固定在小程序文章里顶部或者底部,无奈搁置在文章里的某个地位。因为微慕小程序后端采纳的WordPress,WordPress反对短代码的性能,于是在文章的任意地位插入卡片式链接成为可能。 用WordPress的自定义短代码须要反对以下3个性能: **1.在小程序的文章详情页任意地位反对卡片式链接 2.卡片式链接的跳转反对多个跳转形式:跳转本小程序,跳转其余小程序,跳转网页 3.须要兼容WordPress的页面卡片式链接显示和跳转。** 自定义短代码的格局如下: [minappershortcode qrcode=”小程序二维码图” poster=”封面图” title=”题目” appid=”小程序appid” path=”小程序页面门路” url=”网页链接” codetype=”短代码类型” redirectype=”跳转形式” description=”阐明” price=”价格” buttontext=”跳转按钮文字”] 示例如下: [minappershortcode qrcode=”https://blog.minapper.com/wp-...” poster=”http://shop.minapper.com/uplo...” title=”【专业版Pro】微慕WordPress小程序专业版” appid=”wxc1771b619b83316b” path=”pages/goods_details/index?id=27″ url=”” codetype=”goods” redirectype=”miniapp” description=”最新版本V3,蕴含后盾插件+前端小程序源码” price=”1688″ buttontext=”立刻购买”] 在小程序端的效果图如下: 查看实际效果请拜访:微慕小程序专业版 ,或间接能够扫描如下二维码查看实际效果: 在pc端浏览器里的效果图如下: 实际效果请拜访如下链接:https://blog.minapper.com/wordpress/theme/test-shortcode.html 在手机浏览器里的成果如下: 使用wordpress短代码,能够为小程序扩大更多的性能。 原文链接:https://www.watch-life.net/wordpress/minapper-shortcode.html

August 17, 2020 · 1 min · jiezi

关于小程序:微慕WordPress小程序专业版v30发布

通过两个多月的缓和开发,微慕WordPress小程序专业版v3.0正式公布,新版本在v2.0的根底上,减少不少性能,同时优化和欠缺许多的性能细节。所有新性能开发和性能优化,都是围绕微慕小程序产品的核心理念进行,微慕小程序要做业余的媒体资讯类小程序,提供业余的媒体、资讯、社交的性能。 微慕WordPress小程序专业版v3.0 更新的性能中重点如下: ** 1.订阅音讯 2.小程序直播; 3.付费、积分浏览优化; 4.会员星级等级; 5.投稿优化; 6小程序内音讯; 7.媒体核心优化; 8.评论点赞; 9.管理中心 ** 一.全新的订阅音讯微慕小程序v2.0版本提供了一个性能比较简单的小程序订阅音讯性能,因为订阅音讯须要用户被动确认订阅,所以上一个版本的订阅音讯,应用起来不不便。在新版本的订阅音讯进行全新设计和流程优化。 目前在微慕小程序里反对3类订阅音讯:内容更新揭示,新的评论揭示,评论回复告诉 1.内容更新揭示:在小程序里公布新的文章或话题时,给订阅用户发送内容更新的揭示音讯。 此音讯揭示分两类: 1)全局内容更新揭示:用户订阅了此类音讯,只有小程序内公布了新的内容,就会承受音讯揭示。 2)专题(分类)内容更新揭示:用户只订阅某一个专题或分类的内容更新音讯,相干专题或分类里有新内容公布后,就会收到音讯揭示。 用户订阅新内容音讯揭示,以下几个设置入口: (1)分类文章的列表页面进行订阅 (2)分类页面进行订阅 (3) 在文章详情页面进行订阅 (4) 在分类的话题列表页面订阅 2.新的评论揭示:作者在小程序里公布新的文章或话题后,如果订阅新的评论音讯,有人评论后,会发订阅音讯揭示作者。此音讯的订阅是在作者公布文章或话题后,提醒作者是否订阅? 如果作者心愿收到屡次的新评论揭示,能够在“我的文章(话题)”页面屡次订阅。 2.评论回复告诉:读者在评论文章或话题后,如果想获取其他人对这个评论的回复,并给出告诉揭示,能够在评论提交后,订阅“评论回复告诉”。 如果想收到多条评论被回复的音讯,能够在“我的评论”页面订阅屡次。 二.小程序直播2020年2月28日,微信小程序直播能力启动公测。微信小程序直播是微信官网提供的商家经营工具,商家可通过在小程序内直播实现用户互动与商品销售的闭环,无需任何的跳转,进步下单转化率,直播更是成为链接商家和消费者的重要销售渠道。 微慕团队在新版本退出了小程序直播,小程序的直播是重要的营销工具和互动工具,对于小程序来说是十分重要的性能;同时,直播的接入是很不便,应用微信官网提供的直播组件,马上能够在小程序中实现直播性能。小程序直播是微信官网收费提供给商家的实时视频直播工具,包含直播治理端、主播端和观众端等模块。 如果申请开明了小程序直播的性能,无需二次开发,通过微慕小程序v3.0版接入小程序直播。 2020年3月31我也进行平生第一场直播,讲述了微慕小程序的相干开发,有趣味的敌人能够去看看回放,用微信扫描以下二维码即可收看。 无关小程序直播申请开明,请查看文章:微慕WordPress小程序开发教程——如何申请开明小程序直播? 三.付费、积分浏览优化付费浏览和积分浏览是上一个版本曾经具备的性能,此次优化次要是优化性能细节。 1)在专题分类页面里,如果是付费的专题,显示付费标识,进入专题分类列表后,能够间接微信领取或积分兑换。 2)在须要付费或积分兑换的页面,领取或兑换后,刷新以后页面,不在须要从新进入页面能力浏览。 四.会员星级等级微慕小程序2.0版本里就引入了会员,不过还不够欠缺和精密,会员没有等级,没有和积分挂钩,没有激励机制,没有和小程序里的性能权限想关联。小程序3.0版里引入会员星级等级,一共5个星级,每个星级所对应的积分能够在微慕小程序的wordpress插件后盾进行设置,同时也能够设置每个星级所对应的权限,比方发表话题,发表评论,免审等。 通过会员等级的功能完善,冀望进步用户互动积极性,加强小程序的活跃度和留存率。 五.投稿优化微慕小程序专业版提供编辑投稿的性能,在2.0版本里这个这个性能应用起来有些繁琐,同时无奈对所编辑的文字进行格局的管制,在3.0版本里,微慕团队做了重构和优化,采纳微信小程序官网提供的富文本编辑组件,同时减少了在文章里放入视频的性能(包含腾讯视频),给小程序的文字创作者带来极大的不便。 同时,这个编辑能够临时保留投稿内容,下次关上投稿后,能够持续编辑。 六.小程序音讯微慕小程序3.0版在订阅音讯上做了很大的优化,然而订阅音讯须要用户被动订阅。为了加强小程序的互动性,在3.0版本里减少了小程序的音讯,是微慕小程序音讯揭示性能重要欠缺。文章被评论,评论被回复,文章点赞赞,评论被点赞,用户被关注时,给予音讯揭示。 ...

August 17, 2020 · 1 min · jiezi

关于小程序:微慕WordPress小程序开源版v36发布

2019年11月7日,是我的集体网站“守望轩”建设17年的日子。在网络上无数个大大小小网站里,这个网站可能是最小的,最不闻名的网站之一。我不晓得,有多少人从这个网站上取得一点点的启发和播种,对我来说她的意义就是一种记录,她不会展示我对这个世界的齐全的、残缺的思考,但至多内容是真挚的。这个网站也是我和这个世界一个链接的通道,去表白我的观点,去分享我的技术心得。 两年前,我写了留念15周年的文章。而明天,我打算通过公布新版本微慕小程序来留念这个日子。 通过一个月的调整,微慕WordPress小程序开源版v3.6明天公布。新的版本做了如下调整和欠缺。 一.简化或优化小程序的配置只管微慕开源版小程序是所有版本中配置最简略的,不过仍然有很多人在装置和应用小程序的时候,被外面的配置难住了。新版做了两方面的调整: 1)简化小程序端config.js的配置。只有在配置config.js文件里的域名,就能够让小程序根本运行起来。 2)局部配置内容转移到插件里配置。这样批改配置就不须要像老版本一样从新提交小程序审核了。次要转移的配置内容是:小程序首页滑动文章ID ,在小程序里显示的文章分类ID,”对于”页面。 二.退出微信广告如何让小程序的流量变现,困扰着不少小程序的开发者。广告,无疑是最间接,最简略粗犷的形式。v3.6版提供的齐备的小程序广告治理公布性能。目前反对的广告模式包含列表、文章详情的banner广告和激励视频广告。如果你的小程序流量比拟大,广告无疑会带来不小的收益。 1.通过WordPress后盾的插件后盾对广告的公布进行治理。实现的配置包含:广告id的设置,是否开启,广告显示的地位,插入广告的频率。 阐明:倡议列表显示广告的时候,频率不能太低了,否则一屏显示两条广告会被微信广告审核回绝。 列表广告 内容详情页里的广告 如果你想在某篇文章显示“激励视频的广告”,在编辑文章的时候,勾选”启用激励视频”。 关上文章详情的时候,会提醒“观看视频,浏览更多”,点击提醒文字就会关上激励视频广告。用户在观看一次后,下次关上文章就不会呈现广告了。目前,设定的是一天一个用户能够关上20次激励视频广告,所以小程序的管理者,不要启动太多的激励视频广告,太频繁的打搅用户的浏览,可能导致用户散失。 三.性能优化1.优化音频的播放。因为iOS版本小程序不反对audio组件,导致音频文件无奈播放,在微慕新版本里,优化音频的播放,岂但反对iOS,同时给音频加上了进度条和播放按钮。 你能够在小程序关上这个文章体验下,文章的链接:https://www.watch-life.net/life-thinking/at-the-moment.html 2.反对WordPress相册。 小程序的富文本解析组件wxParse 对文章里的WordPress相册反对不好,无奈显示相册图片。新的版本调整插件程序,优化了相册的显示,能够在小程序端浏览相册里图片了。 你能够通过小程序和pc浏览器,拜访这个链接:https://www.watch-life.net/life-thinking/70-national-day.html,看看WordPress相册在小程序和pc浏览器里的成果。 3.反对pc版微信,反对手机端横屏显示小程序 4.图片反对懒加载和辨认二维码 5.调整首页导航 6.优化登录弹出框 微慕WordPress小程序开源版下载地址:https://github.com/iamxjb/winxin-app-watch-life.net 配套WordPress插件地址:https://wordpress.org/plugins/rest-api-to-miniprogram/ 思考到国内网络起因,可能无奈下载小程序和插件,咱们提供备用下载地址,下载办法: 1. 关注公众号:微慕(minapper) 2. 发送关键词音讯:开源 微慕WordPress小程序开源版提供20项根底外围的性能,这些可能满足90%以上的WordPress站长对微信小程序的需要;但如果你对媒体、资讯、社交的性能有更多、更业余的需要,能够尝试应用微慕WordPress小程序专业版,专业版包含动静朋友圈,广告零碎,积分零碎,管理系统,媒体核心,期待构建最业余的媒体资讯类小程序。如果你有趣味理解,能够拜访链接:https://www.watch-life.net/wechat/minapper-professional-v-3.html。 如果你关注内容的多平台散发,能够试试微慕小程序增强版,反对多端内容散发,目前反对的多端包含:微信,百度,QQ,头条,支付宝,理解增强版详情请拜访链接:https://www.watch-life.net/wordpress/minapper-plus.html 原文链接:https://www.watch-life.net/wordpress/minapper-free-3-6.html

August 17, 2020 · 1 min · jiezi

关于小程序:微信小程序订阅消息开发指南

2019年10月12日微信凋谢了小程序订阅音讯的性能。按官网的说法,目前的模板音讯在实现小程序服务闭环上存在缺点: 1. 局部开发者在用户无预期或未进行服务的状况下发送与用户无关的音讯,对用户产生了骚扰; 2. 模板音讯需在用户拜访小程序后的 7 天内下发,不能满足局部业务的工夫要求模板音讯的确存在上述的硬伤,不利于小程序的用户留存和用户体验。为了解决这些问题,微信官网推出了用户订阅音讯性能。我在微慕专业版上加了订阅音讯的性能,并验证了这个性能。这个性能是否能都达到官网的预期,这个我感觉不那么乐观。这里我先说我的感触:目前的订阅音讯还很不欠缺,根本是“半成品”,后续还有很大的优化空间。 目前,官网只凋谢了“一次性订阅音讯”,尚未凋谢“长期性订阅音讯”,因而我只尝试了“一次性订阅音讯”。 一次性订阅音讯:用于解决用户应用小程序后,后续服务环节的告诉问题。用户自主订阅后,开发者可不限工夫公开发一条对应的服务音讯;每条音讯可独自订阅或退订。 订阅音讯推送地位:服务告诉 订阅音讯下发条件:用户自主订阅 订阅音讯卡片跳转能力:点击查看详情可跳转至该小程序的页面 以下我简略阐明订阅音讯的开发过程和应用体验。 一.订阅音讯的开发1.获取订阅音讯的模板ID 在微信小程序的治理后盾,在左侧“性能”菜单,抉择“订阅音讯”,而后点击“增加” 而后抉择你须要的音讯模板,并配置关键词。 配置实现后,如下图所示。 值得关注的是,在配置好的模板详情页面里的“具体内容”很重要,这个就是开发订阅音讯时须要遵循的音讯格局,这个格局和模板音讯有轻微的差异 依据微慕小程序的须要,我选用了“新的评论揭示”和“内容更新揭示”这两个音讯模版。前者用于揭示发表话题或文章的作者,有新的话题或文章评论,加强作者与读者之间的交换互动;后者是揭示订阅用户,小程序有新的文章公布,疏导用户回归小程序。 订阅音讯申请模板的时候,须要抉择所属类目,只能抉择以后小程序相干的类目模板,对于模板音讯不须要抉择对应类目。如果删除小程序类目,就会把订阅音讯模板一起删除。因而删除类目要小心谨慎。 2.触发用户订阅,获取下发的权限 触发用户订阅,微信小程序提供的api是: wx.requestSubscribeMessage,用户产生点击行为或者发动领取回调后,才能够调起订阅音讯界面。 留神:微信小程序开发工具尚不反对此性能,在开发工具触发订阅的api,会提醒: requestSubscribeMessage:fail 开发者工具临时不反对此 API 调试,请应用真机进行开发 update:2020年5月18日,日前订阅音讯曾经反对微信小程序开发工具。 调用api的代码示例如下: `wx.requestSubscribeMessage({ tmplIds: ["模板A","模板B"], success: function (res) { //胜利 }, fail(err) { //失败 console.error(err); } })` wx.requestSubscribeMessage(Object object) 的回调函数object.success 参数有两个:errMsg和TEMPLATE_ID; 接口调用胜利时errMsg值为’requestSubscribeMessage:ok’。TEMPLATE_ID是动静的键,即模板id,值包含’accept’、’reject’、’ban’。’accept’示意用户批准订阅该条id对应的模板音讯,’reject’示意用户回绝订阅该条id对应的模板音讯,’ban’示意已被后盾封禁。例如 { errMsg: “requestSubscribeMessage:ok”, zun-LzcQyW-edafCVvzPkK4de2Rllr1fFpw2A_x0oXE: “accept”} 示意用户批准订阅zun-LzcQyW-edafCVvzPkK4de2Rllr1fFpw2A_x0oXE这条音讯。 集体感觉这个动静键不是特地正当,代码解决起来有些麻烦,如果改成动态键的json格局比拟不便解决,例如: `{ errMsg:"requestSubscribeMessage:ok", result: [ { templateId:"zun-LzcQyW-edafCVvzPkK4de2Rllr1fFpw2A_x0oXE", status:"accept" } ] }` ...

August 17, 2020 · 1 min · jiezi

关于小程序:微慕WordPress小程序专业版v20

不经意间,微慕专业版公布曾经过来一年了,微慕开源版的推出也有两年半了。2017年5月间,我花了2天工夫,用WordPress插件做后端,写了个微信小程序,并开源到github(截至2019年10月14日,star数目为1.4k),利用业余时间不断完善,让我没想到的是,由当初简陋的几百行代码程序,当初曾经是20000多行代码(包含插件和小程序)的小型软件产品了。 这个小程序应用的人越来越多,从最后几十人,到上百人,到当初退出这个开源小程序微信群的人有4个群了。每天花点工夫欠缺一点,这2年的工夫始终继续着。我想继续专一一件事,并把这个事一直地做得更好,那么这个事产生无益价值的可能性就会很大。 微慕小程序目前有三个版本:开源版,增强版,专业版。 开源版提供20项根底外围的性能,这些可能满足90%以上的WordPress站长对微信小程序的需要。 增强版基于开源版进行重构,性能加强,性能优化,一个后端对接5个小程序端,反对百度、微信、QQ、头条抖音及支付宝小程序,是WordPress站利用各大平台获取流量的利器。 专业版提供的媒体、资讯、社交的性能。是三个版本中性能最多最强的,,也是最业余的媒体资讯类小程序。 微慕业余去年9月公布的时候,推出了付费浏览,在线投稿,动静圈子,积分零碎,用户核心,订单治理,自定义表单字段。尽管比起开源版减少了不少的性能,但在我看来离“业余”的规范还有差距。这差距次要体现在以下几个方面: 1.积分零碎不欠缺,没有造成积分充值、处分、应用、耗费的闭环,是一个半吊子的积分零碎。 2.动静圈子性能比较简单,施展微信小程序社交、交换、互动的属性。 3.不足为站长带来经济价值的性能,无奈流量变现。 针对以上问题,全新推出的微慕小程序专业版v2.0,置信会给WordPress站长带来耳目一新的惊艳感觉。 一.全新动静朋友圈1.0版本的动静圈子,性能比较简单,只提供了简略的文字、图片发帖性能,帖子的评论不反对回复。2.0版本做十分大的重构,根本复刻了微信朋友圈的性能,甚至减少一些微信朋友圈没有的性能,让小程序的敌人互动圈真正互动交换起来。 1.发帖反对上传多种媒体,媒体包含图片、视频、音频、解析媒体、文档。 (1)图片:反对上传9张图,反对gif图片。 (2)视频:反对上传拍摄视频和相册视频 (3)音频:反对上传录制的音频和音频文件 (4)解析媒体:提供腾讯视频、抖音、微博、抖音的链接解析,并把解析的文字和媒体文件显示在帖子里。 (5)文档:反对上传微信小程序能够关上的多种格局文档上传,文档类型包含:PPT,Excel,Word,PDF。 2.反对开启地址信息,显示朋友圈发帖地位地图,找到左近的人。 2.反对开启集体赞叹,通过微信赞叹码进行打赏,加强网友间的互动。 2.反对对网友的关注,显示关注的敌人的帖子,理解本人的关注者和粉丝,加强网友间的互动,沉闷圈子的氛围。 二.欠缺积分零碎1.积分的获取.小程序提供多种路径,帮忙使用者获取积分,也加强使用者的参加动静圈的积极性;同时在WordPress后盾微慕小程序管理里,反对给用户进行积分充值,这样就能够实现线下领取,线上积分充值。 2.积分的应用 2.0版本里提供应用积分的一个重要场景:积分浏览。以前的版本里,付费浏览只反对安卓,iOS因为家喻户晓的起因无奈反对,因而在新版里退出了积分浏览,这样既能够付费浏览,也能够积分浏览。 同时,每个用户能够看到本人的积分流水以及在小程序里积分排行,后续积分零碎将会退出越来越多利用和玩法,比方积分等级和积分兑换的性能将在后续版本推出。 三.流量变现的广告零碎如何让小程序的流量变现,困扰着不少小程序的开发者。广告,无疑是最间接,最简略粗犷的形式。2.0版提供的齐备的小程序广告治理公布性能。目前反对的广告模式包含列表、文章详情的banner广告和激励视频广告。后续将会退出视频广告和前贴视频等广告模式。 1.通过WordPress后盾的插件后盾对广告的公布进行治理。实现的配置包含:广告id的设置,是否开启,广告显示的地位,插入广告的频率。 2.小程序端显示广告。通过上述广告配置来调配广告的显示。 (1)列表中广告 (2)文章详情里广告 (3)激励广告 四.精彩纷呈的媒体核心小程序用户在发表文章或帖子的时候,上传的各种媒体文件,包含图片、视频、音频、文档等。这些大量的媒体文件都扩散在文章和动静圈的帖子里。媒体核心就是把这些媒体文件进行会集,并从新排版和展现。媒体核心能够认为是小程序里的媒体内容从新整合和扩大,通过这个聚合的性能你能够扩大成一个短视频核心、图片核心、音频核心和文档核心,用来满足用户对不同媒体浏览需要。 1.视频核心 2.图片核心 3.文档核心 4.音频核心 五.快捷的内容审核治理因为业余提供了许多用户自行公布内容的性能,目前微信对用户提供内容的审核十分严格,因而对内容的审核变得越来越重要了,如果呈现违规的内容,小程序很可能被微信永恒封禁。为了防止这个危险,小程序要提供内容审核的性能,目前有两种形式的审核:(1)接入微信公众平台内容平安API(imgSecCheck、msgSecCheck、mediaCheckAsync)进行审核,不过这个api目前是不是很欠缺,有些违规的内容可能漏网。(2)人工审核。 以前版本的小程序尽管能够在WordPress后盾进行审核,不过须要关上电脑在操作,比拟的麻烦。专业版2.0版为小程序的管理员提供了,在微信小程序里进行内容审核的性能,对未公布和已公布的内容进行审核,审核的流程包含审核公布或者删除。这样很不便小程序的管理员,通过手机就能够间接治理小程序的内容。 后续更新版本里,将会退出更多的小程序的配置管理性能,让小程序的管理员简略手机操作,就能够轻松治理治理小程序 六.功能完善和问题修复除减少上述外围性能外,微慕小程序专业版v2.0还进行了以下功能完善和问题修复: 1、修复音频无奈在iOS里播放的问题,在文章详情页减少音频播放组件。 2、调整转发文章详情的图片尺寸,应用5:4裁剪图片 ,解决iOS分享转发图片不残缺的问题。 3、退出中文提醒:有域名未退出downloadFile非法域名。 4、图片加载应用懒加载。 5、在文章列表和动静话题列表退出点赞事件,并即可更新点赞数量。 6、文章列表退出瀑布流模式和无图模式。 7、插件反对古腾堡编辑器。 8、反对WordPress文章的相册媒体。 ...

August 17, 2020 · 1 min · jiezi

关于小程序:WebSocket-开发实战三步实现实时弹幕系统

前言往年疫情的突袭,扭转了很多人以往在生存和工作中的形式,视频会议、协同编辑、在线直播 / 教育等业务场景凸显重要性。人们通过线上形式,实时的获取信息、同步信息,以快捷且不受空间限度的模式实现沟通、学习、工作等需要。 本文将以微信小程序实时弹幕性能为例,向大家介绍高实时业务场景的性能技术实现过程。 实时弹幕性能的技术实现实现形式比照短轮询 短轮询是客户端每隔一段时间向服务器发出请求,服务器端在收到申请后,不管是否有数据更新,都间接进行响应。 长处:实现简略,易于了解,适宜异步查问业务。毛病:一直的去申请没有意义的更新的数据,节约服务器资源,不适宜同时在线用户多的业务。长轮询 当服务器收到客户端发来的申请后,服务器端不会间接进行响应,而是先将这个申请挂起,而后判断服务器端数据是否有更新。如果有更新,则进行响应,如果始终没有数据,则达到肯定的工夫限度才返回。 长处:缩小不必要的申请,缩小资源节约,有较好的时效性。毛病:占较多的内存资源与申请数。Server-sent Events(SSE) SSE 容许服务器推送数据到客户端,不须要建设或放弃大量的客户端发往服务器端的申请,能够实现只有服务器端数据有更新,就马上发送到客户端。 长处:实现简略,一个连贯能够发送多个数据,节约了很多资源。毛病:兼容性不好(IE,Edge 不反对),服务器只能单向推送数据到客户端。WebSocket WebSocket 是一种网络传输协定,反对双向牢靠的通信。首先须要在客户端和服务器端建设起一个连贯,这部分须要 http。连贯一旦建设,客户端和服务器端就能够互相发送数据,不存在申请和响应的区别。 长处:双向通信,节约资源,时效性十分高。毛病:服务器端的逻辑简单,开发成本高。实时数据库实时数据库是通晓云近期推出的重磅根底能力,基于 WebSocket 实现客户端和服务端的实时双向通信,在云端数据发生变化时马上告诉所有客户端来同步数据,从而扭转了以往只能由客户端按需向云端申请或通过定时轮询来刷新数据的单向模式。 实时数据库能够让开发者无需投入额定的开发资源,便可轻松、疾速的搞定实时性高的业务场景。对于社交聊天、弹幕、多玩家游戏、协同编辑、股票基金实时报价、体育实况更新、视频会议 / 聊天、基于地位的利用、在线教育、智能家居等场景都很有帮忙。 开发过程筹备 注册一个微信小程序 https://mp.weixin.qq.com/注册一个通晓云账号,并创一个通晓云利用 https://cloud.minapp.com/ps:在左侧栏找到「设置」,选项「利用」能够找到开发者 ID,用于通晓云 SDK 初始化。 装置 目前反对的版本 3.14.0-beta.2 及以上。 通过 npm 装置:npm install minapp-sdk通过文件下载:https://doc.minapp.com/js-sdk/download-sdk.html剖析 剖析需要通晓云 实时数据库有一个限度就是必须先登录,所以咱们在实现视频弹幕的时候,须要先实现登入登出。 有两个界面状态: 未登入:简略的显示一个登入按钮即可。已登入:会有一个视频组件、一个输入框(弹幕内容)、 一个按钮(点击发送弹幕)、还有对应的登出按钮。这样子就是一个绝对齐备的利用了。 实现步骤清单搭建简略的微信小程序脚手架(用开发者工具创立一个新的利用即可,而后清理一下不必的代码)初始化通晓云 SDK实现登入登出实现弹幕成果实现实时弹幕要害代码首先是订阅一个表的事件 : const Danmu = new BaaS.TableObject('danmu')const subscription = MyTable.subscribe('create', {   oninit: () => { console.log('订阅胜利')   },   onerror: error => {     console.log('订阅失败', error)   },   onevent: ({after}) => { console.log('接管到通晓云推送过去的音讯', after)    // 这个时候就能够调用小程序视频组件的 API 产生弹幕成果   },})每次订阅都会返回一个订阅关系对象 subscription,使用者能够在特定机会调用 subscription.unsubscribe() 勾销订阅。比如说小程序页面加载的时候发动订阅,页面销毁的时候勾销订阅(网页端,刷新的时候不须要被动调用勾销订阅也会勾销订阅)。 ...

August 17, 2020 · 1 min · jiezi

关于小程序:一个内嵌全国高校地图的小程序走到哪导航到哪

目前,全国 31 省区市 2020 年高考分数线已全副颁布,考生们也已实现意愿填写,陆续收到录取通知书。在各位学子金榜题名时,微博、朋友圈等各个社交渠道也开始了晒录取通知书的 battle 名局面。 ▲新版清华大学研究生录取通知书 ▲上海交通大学本科录取通知书 各所大学的录取通知书充沛交融校园修建风景、历史文化、业余特点等元素,通过数字插画、平面纸雕、盲盒设计、音乐盒等极具创意和富裕设计感的形式,向新生展现漂亮校园、美妙学习生存和对他们热烈的欢送和冀望。 蕴含校园风景和地图的录取通知书,更多是一种珍藏纪念的见面礼,但对于第一次到心仪校园的新生来说,可能会面临: 在面积多达几百万平方米的生疏校园里迷路;对大量类似教学楼摸不着头脑;不晓得各个修建的历史文化;不分明学校近期的校园流动以及举办地位。就算新生征询行将毕业的师兄师姐,他们也未必晓得;就算他们晓得,新生也可能因为途程太远持续迷路。 ▲图片起源:清华大学小研在线 但如果把所有校园景色以手绘图+风光照的模式,联合实地导览,既特色又实用的承载在一个小程序上,会是一种什么体验呢? 为了进步教育服务工作,为全国师生提供一个教育信息化服务平台,教育部、各大高校和通晓云独特打造了 1 个「微信教育小程序」和 30+ 个「校园导览小程序」。微信教育小程序蕴含教育资讯、流动、全国各大高校散布地图等性能,并内嵌全国各大高校的校园导览小程序,可进行小程序间的跳转。 ▲扫描微信教育小程序二维码,旅行全国各大高校 校园导览小程序,以合乎学校格调的手绘地图、具体的文字介绍和精美的摄影照片,全方位展示了校园景观、出入门、院系、教学楼、宿舍、图书馆、体育场馆、文化场馆、停车场、卫生间和相干服务。通过准确的定位信息与智能的路线图,让在校师生及游客无论身在校园何处,都能顺利找到目的地。 小程序还设置预约性能,在暑期等人流量剧增的非凡工夫进行人流限度,营造文化、有序的入校体验。游客能够通过线上实名认证预约,线下人脸识别验证,从而进入校园旅行或参加流动。 「参观北大」小程序上线后,为在校师生提供了便捷的校园导览工具的同时,也吸引泛滥游客的参观,上线不久后,用户数冲破三百万。微信教育小程序和全国 30+ 高校的校园导览小程序开发我的项目,最大的特点是小程序开发数量多且性能类似,如何解决工作量沉重且开发工作反复是其次要问题。 因而,所有小程序通过通晓云后端云服务实现,不仅免去了后端的搭建工作,能够疾速实现一个性能残缺的小程序;同时基于通晓云「复制利用性能」,将已实现的小程序复用到其余小程序中,一键「克隆」小程序,打造弱小的校园导览矩阵。 校园导览、定位性能手绘地图依据学校的风光、特色坐标、文化定制合乎学校格调的手绘地图,展现了漂亮校园的同时,也激发了师生浓浓的校园情怀。 LBSLBS(基于地位的服务)实现校园内外无缝定位、路线导航技术,校园再大修建再类似也不会迷路。 室内定位基于 iBeacon 实现的园内定位,精度 2m 以内,远超国际标准(3m)。反对联合校园流动,向在校师生及访客发送欢送语音、学校介绍、流动举荐与导览等性能,用技术实现智慧校园。 复制利用性能复制利用性能能够帮忙开发者疾速的将一个利用的配置复制到新的利用,该性能仅会复制对应的配置信息,不波及数据表中的信息,疾速又平安。 通过复制利用性能,实现一个学校的校园导览小程序,其它学校只需批改设计及局部非凡性能,无需反复开发,便可取得性能类似的小程序。 开学季即将来临,校园导览小程序为全国新生提供一个不便实用的小工具。目前,通晓云仍在联结高校及相干部门,摸索小程序在教育行业的更多利用场景,为教育行业从业者和学生提供更好的线上服务。 ????点此理解详情

August 17, 2020 · 1 min · jiezi

关于小程序:代码之旅基础规范

在设计架构的时候,要思考由下而上的模式,底层的实际最终会影响整个零碎的架构。再好的架构,如果没有辅以无效的工程实际,那么最终咱们失去的只是一只空有其表的架构计划。能自下而上影响软件架构的,就只有代码了。 代码自身是一种难以掂量的实际。同一个业务性能有不同的代码实现。设想一个场景,咱们对外提供了一个 RESTful API 接口,是不是只有咱们能以标准的形式提供这个RESTful API 接口,代码的实现形式和品质就变得不重要了? 从短期来看,如果一个API能疾速地提供性能以驱动业务增长,那么它就就是一个胜利的 API。不管其设计得如许俊俏,代码品质多差,只有不影响性能,将来就有改良的空间。可是从长期来看,API是要可能面向变动而疾速拓展的,如果咱们不能不便地在 API 中拓展性能,那么它就真的会影响业务了。只管重构的代码能够帮忙咱们走向更好的架构,然而在业务进度不合理的状况下,咱们只能在旧的、俊俏的代码上一直堆砌性能。直至有一天,咱们欢快地抉择重写零碎。 在本节里,咱们将探讨代码中的一些根底标准,他们更多地关注代码的可读性,而不是代码的品质,咱们会在前面的章节里关注代码品质。为了晋升代码的可读性,咱们须要做到以下的几方面: 标准代码组织构造 对立代码格调,即源代码的书写格调组件、函数等命名标准开发工具标准光看这几点要求,总感觉仿佛多了很多条条框框。只管这种统一性会扼杀团队的多样性,然而对于代码档次的格调对立是相当有必要的。 在这些实际中,有些并不仅仅是实际,他还反馈了架构的模式,如代码组织构造 —— 从代码的组织构架上,咱们能够真真切切地感触到他与零碎架构的相似之处。因为利用内的代码复用采纳组件化的架构,所以咱们应该隔离不同的组件。比方,在 Angular 生成的组件 component 中,咱们就能够看到一种组件齐全独立的存在模式。 本文由博客一文多发平台 OpenWrite 公布!

August 16, 2020 · 1 min · jiezi

关于小程序:代码之旅基础规范

在设计架构的时候,要思考由下而上的模式,底层的实际最终会影响整个零碎的架构。再好的架构,如果没有辅以无效的工程实际,那么最终咱们失去的只是一只空有其表的架构计划。能自下而上影响软件架构的,就只有代码了。 代码自身是一种难以掂量的实际。同一个业务性能有不同的代码实现。设想一个场景,咱们对外提供了一个 RESTful API 接口,是不是只有咱们能以标准的形式提供这个RESTful API 接口,代码的实现形式和品质就变得不重要了? 从短期来看,如果一个API能疾速地提供性能以驱动业务增长,那么它就就是一个胜利的 API。不管其设计得如许俊俏,代码品质多差,只有不影响性能,将来就有改良的空间。可是从长期来看,API是要可能面向变动而疾速拓展的,如果咱们不能不便地在 API 中拓展性能,那么它就真的会影响业务了。只管重构的代码能够帮忙咱们走向更好的架构,然而在业务进度不合理的状况下,咱们只能在旧的、俊俏的代码上一直堆砌性能。直至有一天,咱们欢快地抉择重写零碎。 在本节里,咱们将探讨代码中的一些根底标准,他们更多地关注代码的可读性,而不是代码的品质,咱们会在前面的章节里关注代码品质。为了晋升代码的可读性,咱们须要做到以下的几方面: 标准代码组织构造 对立代码格调,即源代码的书写格调组件、函数等命名标准开发工具标准光看这几点要求,总感觉仿佛多了很多条条框框。只管这种统一性会扼杀团队的多样性,然而对于代码档次的格调对立是相当有必要的。 在这些实际中,有些并不仅仅是实际,他还反馈了架构的模式,如代码组织构造 —— 从代码的组织构架上,咱们能够真真切切地感触到他与零碎架构的相似之处。因为利用内的代码复用采纳组件化的架构,所以咱们应该隔离不同的组件。比方,在 Angular 生成的组件 component 中,咱们就能够看到一种组件齐全独立的存在模式。 本文由博客一文多发平台 OpenWrite 公布!

August 16, 2020 · 1 min · jiezi

关于小程序:JavaScript正则表达式常用技巧

正则表达式是用于匹配字符串中字符组合的模式。在 JavaScript 中,正则表达式也是对象。这些模式被用于 RegExp 的 exec 和 test 办法, 以及 String 的 match、matchAll、replace、search 和 split 办法。正则表达式的把握水平能粗略地看出程序员的技术底子,所以技术面试、编程比赛等 都特地喜爱考查正则表达式。本篇就带你一起夯实一下 JavaScript 正则表达式的一些应用技巧: 创立正则表达式在 JavaScript 的世界,创立正则表达式有2个办法:(1)应用一个正则表达式字面量,其由蕴含在斜杠之间的模式组成。比方 : const reg = /ab+c/(2)调用RegExp对象的构造函数。比方: const reg = new RegExp("ab+c")留神:以上2个办法尽管都能创立正则表达式,然而还是有区别的:(1)应用第一个办法,在脚本加载后正则表达式字面量就会被编译。当正则表达式放弃不变时,应用此办法可取得更好的性能。(2)应用第二个办法,在脚本运行过程中用构造函数创立的正则表达式会被编译。如果正则表达式将会扭转,或者它将会从用户输出等起源中动静地产生,就须要应用构造函数来创立正则表达式。 当然,这样表述可能不太粗浅,上面找一道面试题带你实际一下。 经典面试题 "Word Finder"题目要求:应用一个办法来扩大字典,该办法返回与模式匹配的单词列表。这个模式能够蕴含字母(小写)和占位符("?")。占位符只代表一个任意的字母,比方: const fruits = new Dictionary(['banana', 'apple', 'papaya', 'cherry']);fruits.getMatchingWords('lemon'); // must return []fruits.getMatchingWords('cherr??'); // must return []fruits.getMatchingWords('?a?a?a'); // must return ['banana', 'papaya']fruits.getMatchingWords('??????'); // must return ['banana', 'papaya', 'cherry']补充阐明:(1)单词和模式都是小写(2)返回单词的程序无关紧要下面这道题目是典型的 正则表达式应用题,考查的知识点是2个:(1)应用 RegExp 对象 动态创建正则表达式(2)应用 /./ 匹配一个任意字符 ...

August 15, 2020 · 2 min · jiezi

关于小程序:JavaScript正则表达式常用技巧

正则表达式是用于匹配字符串中字符组合的模式。在 JavaScript 中,正则表达式也是对象。这些模式被用于 RegExp 的 exec 和 test 办法, 以及 String 的 match、matchAll、replace、search 和 split 办法。正则表达式的把握水平能粗略地看出程序员的技术底子,所以技术面试、编程比赛等 都特地喜爱考查正则表达式。本篇就带你一起夯实一下 JavaScript 正则表达式的一些应用技巧: 创立正则表达式在 JavaScript 的世界,创立正则表达式有2个办法:(1)应用一个正则表达式字面量,其由蕴含在斜杠之间的模式组成。比方 : const reg = /ab+c/(2)调用RegExp对象的构造函数。比方: const reg = new RegExp("ab+c")留神:以上2个办法尽管都能创立正则表达式,然而还是有区别的:(1)应用第一个办法,在脚本加载后正则表达式字面量就会被编译。当正则表达式放弃不变时,应用此办法可取得更好的性能。(2)应用第二个办法,在脚本运行过程中用构造函数创立的正则表达式会被编译。如果正则表达式将会扭转,或者它将会从用户输出等起源中动静地产生,就须要应用构造函数来创立正则表达式。 当然,这样表述可能不太粗浅,上面找一道面试题带你实际一下。 经典面试题 "Word Finder"题目要求:应用一个办法来扩大字典,该办法返回与模式匹配的单词列表。这个模式能够蕴含字母(小写)和占位符("?")。占位符只代表一个任意的字母,比方: const fruits = new Dictionary(['banana', 'apple', 'papaya', 'cherry']);fruits.getMatchingWords('lemon'); // must return []fruits.getMatchingWords('cherr??'); // must return []fruits.getMatchingWords('?a?a?a'); // must return ['banana', 'papaya']fruits.getMatchingWords('??????'); // must return ['banana', 'papaya', 'cherry']补充阐明:(1)单词和模式都是小写(2)返回单词的程序无关紧要下面这道题目是典型的 正则表达式应用题,考查的知识点是2个:(1)应用 RegExp 对象 动态创建正则表达式(2)应用 /./ 匹配一个任意字符 ...

August 15, 2020 · 2 min · jiezi

关于小程序:小程序自动化测试

背景近期团队打算做一个小程序自动化测试的工具,冀望可能做到业务人员操作一遍小程序后,主动还原之前的操作门路,并且捕捉操作过程中产生的异样,以此来判断这次公布是否会影响小程序的根底性能。 上述形容看似简略,然而两头还是有些难点的,第一个难点就是如何在业务人员操作小程序的时候记录操作门路,第二个难点就是如何将记录的操作门路进行还原。 自动化 SDK如何将操作门路还原这个问题,首选官网提供的 SDK: miniprogram-automator。 小程序自动化 SDK 为开发者提供了一套通过内部脚本操控小程序的计划,从而实现小程序自动化测试的目标。通过该 SDK,你能够做到以下事件: 管制小程序跳转到指定页面获取小程序页面数据获取小程序页面元素状态触发小程序元素绑定事件往 AppService 注入代码片段调用 wx 对象上任意接口...下面的形容都来自官网文档,倡议浏览前面内容之前能够先看看官网文档,当然如果之前用过 puppeteer ,也能够疾速上手,api 基本一致。上面简略介绍下 SDK 的应用形式。 // 引入sdkconst automator = require('miniprogram-automator')// 启动微信开发者工具automator.launch({ // 微信开发者工具装置门路下的 cli 工具 // Windows下为装置门路下的 cli.bat // MacOS下为装置门路下的 cli cliPath: 'path/to/cli', // 我的项目地址,即要运行的小程序的门路 projectPath: 'path/to/project',}).then(async miniProgram => { // miniProgram 为 IDE 启动后的实例 // 启动小程序里的 index 页面 const page = await miniProgram.reLaunch('/page/index/index') // 期待 500 ms await page.waitFor(500) // 获取页面元素 const element = await page.$('.main-btn') // 点击元素 await element.tap() // 敞开 IDE await miniProgram.close()})有个中央须要揭示一下:应用 SDK 之前须要开启开发者工具的服务端口,要不然会启动失败。 ...

August 10, 2020 · 4 min · jiezi

关于小程序:用好知晓云从此不再网抑云

近期在多个社交平台上,都能看到一些打着「网抑云」标签的视频或文章,引起大家的关注。 「网抑云」最开始来自网友对音乐 APP 里的矫情式评论的调侃,是指到夜深时刻,在咱们最敏感的时候,关上音乐 APP ,听着悲伤的歌曲,再浏览充斥悲伤抑郁的评论,从而感同身受,越发抑郁。无论什么格调的歌,仿佛都能让人听出一股淡淡的难过。 作为一名传统企业的老板,你是否因为「企业该如何效率高、成本低、成果好实现数字化转型」的问题陷入「网抑云」了? 作为一名 996 工作制的优良程序员,你是否因为「开发工作简单且繁琐、第三方服务兼容差且费用高」等问题陷入「网抑云」了? 无论你是企业老板还是集体开发者,咱们通晓你的需要和难题。用好通晓云,从此不再「网抑云」。 通晓云不仅提供便捷易用的 SDK ,使得集体开发者能够高效率、低成本的实现小程序开发,同时也提供了企业级定制服务,帮忙企业实现互联网畛域的策略布局。 小程序开发繁琐?——后端的繁琐工作就交给咱们吧,你只须要专一业务逻辑的实现就好。 小程序开发老本高?——实时数据库等服务收费用、产品 1 折秒杀、包年套餐免费送,这些福利咱们都在周年庆流动中为你筹备了,大大降低了开发成本。 小程序获客难?——咱们提供了交融全平台订阅音讯推送服务,帮忙你精准触达用户,获客与变现也变得容易了。此外咱们还提供了媒体加持,只有你的小程序有用、实用,就有机会取得品牌曝光,失去更多的关注与用户转化。 企业数字化转型难?——咱们为企业提供一站式的小程序解决方案,在理解企业的业务需要和经营指标后,从小程序设计开发、经营推广、系统维护全方位制订一套合乎企业倒退布局的解决方案,助力企业又快又好实现数字化转型。 ???? 通晓云三周年流动进行中,泛滥优惠,先到先得。微信扫一扫海报二维码或点击此处理解流动详情。

August 9, 2020 · 1 min · jiezi

关于小程序:用好知晓云从此不再网抑云

近期在多个社交平台上,都能看到一些打着「网抑云」标签的视频或文章,引起大家的关注。 「网抑云」最开始来自网友对音乐 APP 里的矫情式评论的调侃,是指到夜深时刻,在咱们最敏感的时候,关上音乐 APP ,听着悲伤的歌曲,再浏览充斥悲伤抑郁的评论,从而感同身受,越发抑郁。无论什么格调的歌,仿佛都能让人听出一股淡淡的难过。 作为一名传统企业的老板,你是否因为「企业该如何效率高、成本低、成果好实现数字化转型」的问题陷入「网抑云」了? 作为一名 996 工作制的优良程序员,你是否因为「开发工作简单且繁琐、第三方服务兼容差且费用高」等问题陷入「网抑云」了? 无论你是企业老板还是集体开发者,咱们通晓你的需要和难题。用好通晓云,从此不再「网抑云」。 通晓云不仅提供便捷易用的 SDK ,使得集体开发者能够高效率、低成本的实现小程序开发,同时也提供了企业级定制服务,帮忙企业实现互联网畛域的策略布局。 小程序开发繁琐?——后端的繁琐工作就交给咱们吧,你只须要专一业务逻辑的实现就好。 小程序开发老本高?——实时数据库等服务收费用、产品 1 折秒杀、包年套餐免费送,这些福利咱们都在周年庆流动中为你筹备了,大大降低了开发成本。 小程序获客难?——咱们提供了交融全平台订阅音讯推送服务,帮忙你精准触达用户,获客与变现也变得容易了。此外咱们还提供了媒体加持,只有你的小程序有用、实用,就有机会取得品牌曝光,失去更多的关注与用户转化。 企业数字化转型难?——咱们为企业提供一站式的小程序解决方案,在理解企业的业务需要和经营指标后,从小程序设计开发、经营推广、系统维护全方位制订一套合乎企业倒退布局的解决方案,助力企业又快又好实现数字化转型。 ???? 通晓云三周年流动进行中,泛滥优惠,先到先得。微信扫一扫海报二维码或点击此处理解流动详情。

August 9, 2020 · 1 min · jiezi