微信小程序开发者：门槛虽然低 但成功难束缚多_网易科技
微信小程序开发者：门槛虽然低 但成功难束缚多
用微信扫码二维码
分享至好友和朋友圈
文/网易科技　王先1月9日凌晨时分，微信低调上线了小程序，准时兑现了两周前张小龙在微信公开课上的承诺：无需安装、触手可及、用完即走、无需卸载。虽然默默上线，众多科技媒体还是在凌晨第一时间建起了小程序体验群，期待着见证一场颠覆App的技术盛筵，甚至有报道将其比作迄今“互联网史上最受追捧的‘期货’”。不过还没过当天的早高峰时间，盛赞不绝于耳的人群对面，也出现了不少窃窃疑问：腾讯给开发者规定的小程序大小不能超过1MB是否真能“解救16G手机”？热闹之后是否会沦为广告工具？所谓开发成本低廉究竟会低多少？低频App真将被取代吗？高频App也上线小程序是什么逻辑？根据网易科技了解，从目前来看，首批上线小程序的公司，大多都是在2016年9月微信宣布将推出小程序之后开始关注，并在开放公测后第一时间申请了开发者账号。开发时间则根据产品情况不同，花费一周到一个月时间不等。开发过程中会遇到平台限制及适配问题，但相对较容易解决，且已经有了官方和非官方的非常活跃的小程序开发者社群。与App相比，同款产品的小程序现阶段主要求快，几乎没有下载安装过程，社交分享转化率极高，而且开发门槛与运营成本相对较低，是一些高频应用的某种场景补充；但是同时也由于小程序入口深、做了太多减法、占内存局限于1MB，导致有许多原产品功能暂时无法实现。现代主义建筑大师密斯·凡·德·罗曾提出这样一个理论：Less is more（少即是多），以反对当时建筑界过多过度的装饰。本来主打封闭社交与轻应用的微信，如今上线小程序，究竟会助其锦上添花，还是“体重超标”的开始？网易科技采访了几位第一批上线小程序产品的负责人，看看他们都怎么说。网易科技：什么时间得知的微信将上线小程序的消息，为什么会成为第一批上线的小程序？美柚：微信2016年9月宣布将推出小程序之后，团队便对其一直保持关注，所以可以在微信小程序开放公测之后第一时间申请了开发者账号，工程师继续跟进了解小程序的语言代码以及开发条件，在一周时间内完成了第一代产品的规划、开发和提交审核，所以美柚小程序得以赶在第一批上线产品阵列中对外发布。FellowPlus：我们也是在日微信宣布将推出小程序并发布内测时了解到小程序的。小程序的开发是从11月底开始，我们一位前端工程师大约花了一个月时间完成了整个“FellowPlus创投数据库”小程序的开发。整个开发过程还算比较顺利，会遇到小程序平台的一些限制和适配问题，好在官方和非官方的小程序开发者社群都非常活跃，基本上遇到的所有问题都可以在这些社群中找到解决方案。下厨房：2016年9月下厨房是第一批受邀参与微信小程序内测的200个合作小伙伴之一。我们最开始认真讨论过的名字是“下厨房-”，这个其实更符合最小、用完即走的理念，后来觉得-号看上去不够礼貌，好像我们的小程序不能提供好服务，所以就改成了+号。中间经过几次讨论，线上版本经过两周时间开发完成。网易科技：与App相比，小程序的优势和劣势分别在哪里？美柚：小程序作为微信所孵化的一项快捷生态，讲究“快”。快速进入，快速使用，快速走。美柚小程序现阶段也是讲究快，进入美柚小程序，可以快速记录经期，快速浏览一些知识。但是小程序和APP相比，最大的区别一是入口很深，所以用户真正使用情况还不太好判断；二是在服务方面，小程序有很多服务没办法达到，比如在美柚应用里面，我们会有经期预测提醒，这是目前小程序还无法实现的功能，希望未来有可能实现。FellowPlus：小程序相对于App 的主要优势在于几乎没有下载安装过程，社交分享的转化率极高，也更容易让用户了解到产品所提供的服务和品牌；而小程序的劣势也在于做了非常多的减法，常规的促活运营手段基本都不能在小程序中运用，同时在小程序上实现复杂交互还是要比 App 要麻烦很多。下厨房：跨平台，一套代码可以适配& iOS 和 Android 节省了很多时间和人力成本。继承了web开发的特点，前端人员可以很快的上手，开发难度比原生app的门槛低很多，很多适配的问题交给
微信来处理就好了。但是下厨房有海量的菜谱，用户需要下载App查看，所以其实对于用户来说存在一定的门槛。微信是与用户沟通的重要渠道。无论是公众号运营还是今天上线的微信小程序，都大大增加了下厨房与用户交流互动的机会。腾讯地图：我们也发布了一款名为“通勤助手”的小程序，主要包括实时路况订阅与找厕所两大亮点功能点，一次设置家公司就可快速获得到家到公司的最佳路线，可以一键获取周边厕所，相比地图APP中的路线路况查看功能，通过小程序提供的路况订阅更加轻量直观。携程：小程序的开发门槛要比APP低一些
，但是要做到优秀，投入的成本其实和做APP无异。很多创业公司打算押宝在小程序上，想要以此弯道超车，其实在框架后面，最终和客户交互的还是内容或者服务，考验的是一家企业的综合实力。去哪儿：优势就是开发上更加方便，运营成本可以直接对接客户对话，小程序的平台是基于微信，面向用户群更广。局限的话，就是小程序的大小，只有1MB，许多功能受大小限制不太好提供，小程序门槛低，未来竞争会更加激烈。网易科技：未来运营重心是否会由App向小程序转移？美柚：目前来看不会。小程序是在微信场景下的一种补充，能帮助我们满足用户不同场景的使用需求。对于使用频次和时长较高的社区类产品来说，原生APP的用户体验更加丰富。FellowPlus：我们会同时保持在 App 上和小程序上的产品更新和工程、运营的投入，目前 App 仍然可以为重度用户提供优质体验和实时投融资信息提醒，小程序则会为更广泛的创投行业从业人员提供轻量高效的数据服务，“用完即走”的理念也会降低用户的心理负担，更加轻松地使用我们提供的数据工具。下厨房：APP的功能迭代，一直都是我们的技术、运营工作的重心，小程序先是满足了用户工具化需求、浏览需求。未来我们会加大这部分的技术和运营人力的投入，创造出更多“玩法”。携程：中低频的应用、有线下扫码场景的应用特别适合小程序，比如火车票、汽车票的电子预定。携程的部分业务天然适合放在小程序里完成。去哪儿：小程序会增加一种新型终端形式，重要程度同等于app，touch，PC，我们在流量推广上近期会侧重于小程序的线上线下推广，对公司原有业务影响是提供一个新的渠道，增加更多的机会。网易科技：小程序不能被分享到朋友圈，是否介意它没有流量入口和分发渠道？美柚：其实可以分享到朋友圈，只是有些繁琐：在小程序后台有提供二维码，可以将二维码分享到朋友圈。分发渠道只是时间问题，目前就有一家“知晓程序”的小程序应用商店。总体来看，小程序还是很强大的。尤其是在安卓手机上，可以直接在桌面生成快捷入口，这已经是在跟原生APP抢占入口。预计在未来两个月内，将有一些有创意的小程序会爆发。网易科技：怎么看腾讯给开发者规定的小程序大小不能超过1MB这个问题，就好像之前我们下载微信，开始也就一百多兆，但是用着用着就能到几个G，用微信小程序刷视频或图片，应该还是会存在很多内存占用，每次搜索之后是否默认为已下载？美柚：使用小程序会产生占用的情况，但是占用内存的大小就要看不同产品了。小程序不需要下载，但是使用之后会默认已下载。
FellowPlus：小程序目前仅有几十 KB 的大小，FellowPlus
App 体积为 27.9 MB，不过我们在 App 中有着更多的面向投资人的数据和工具服务。小程序大小不能超过 1MB 的限制，其实是指用户启动小程序所需要下载的代码本身不能超过 1MB。小程序使用过程中产生/下载到手机上的文件可以在小程序运行的过程中使用，但是如果希望持久保存在手机里下次启动小程序还继续使用，那么每个小程序最多只可以存储 10 MB 的内容。因此不用太担心小程序会在手机里存储大量的文件，占据手机的存储空间。下厨房：微信小程序也是需要类似于“下载安装”过程的，体积小，速度快，用户感受不是特别明显。为了提升体验流畅度，微信规定编译后的代码包大小需小于 1MB 。由于小程序体现在在“小”上，比如“下厨房+”
只提供了菜谱搜索等相关主要功能，目前的这些功能代码编译后大小不超过 100KB。对于用户来说，比下载一张图片还小。而小程序本地的缓存有最大10M限制，每次搜索和APP一样通过
请求服务器，来获取最符合要求的菜谱，所以不会存在过多占用内存空间的问题。
本文来源：网易科技报道
责任编辑：彭丽慧_NT5727
用微信扫码二维码
分享至好友和朋友圈
加载更多新闻
热门产品:　　　
:　　　　　　　　
:　　　　　　　　　
热门影院：
阅读下一篇
用微信扫描二维码
分享至好友和朋友圈微信小程序开发容易吗？_百度文库
赠送免券下载特权
10W篇文档免费专享
部分付费文档8折起
每天抽奖多种福利
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
内容提供机构
更多优质内容和服务
微信小程序开发容易吗？
0|0|文档简介|
我们为您提供专业的互联网服务，包括：软件...|
总评分0.0|
2017年是微信小程序元年,有人把这次类比成2013年的微信公众号。很多人都后悔错过了当年的红利,觉得这次微信小程序的红利要抓住。因此市场上微信小程序的开发需求渐渐增多,也正是因为小程序的即搜即用、用完即走、方便推广、费用比APP低等特点,让很多创业者,特别是一些微小型企业下意识觉得小程序的开发很容易,不会发生像APP的大概率烂尾事件。
阅读已结束，如果下载本文需要使用0下载券
想免费下载更多文档？说说微信小程序开发的那些坑 - 简书
说说微信小程序开发的那些坑
转载请注明来源和原作者，感谢您的阅读
微信小程序开发难，难于坑特别多
坑一：Content-type问题
坑指数：★★★★★
Paste_Image.png
官网里面的示例代码中content-type是设置为'application/json'的，然而……！！！
Paste_Image.png
无限黑人问号，怀疑过豆瓣的接口的问题，怀疑过网络问题，怀疑过人生......
但是原来是微信开发工具升级后（目前是0.12），请求的header的Content-type写法变了，要改成:
header: { content-type: 'json' }
这样就可以请求成功了！
p.s：这个问题在交流群遇到最多的提问，微信的文档害人不浅啊...
坑二：Promise库问题
坑指数：★★
相信很多前端开发人员都喜欢使用Promise，然而目前微信开发工具版本（0.12）不支持Promise，需要自己引用，Bluebird作为最受欢迎的Promise库之一，很多人都会使用它。
引入后本地开发没问题，十分顺利，iOS运行也可以，但是Android一打开就会显示‘发生未知错误’
如果是引入了Bluebird，安卓又提示这样的错误，那你需要做的就是换掉Bluebird，比较多人建议是的使用 ，es6-promise-min只有6kb，下载后把原来的Bluebird替换即可。
坑二：Object.assign问题
坑指数：★★★
此坑一般在开发工具开发的时候不会展现，但是Android真机调试的时候问题就来了...
具体症状看你在哪里运用了，小的开发是在request的地方使用了，导致在Android机上数据显示不了（微信开发工具和iOS都正常），最后把Object.assign处理好就ok了
另外根据一些前辈谈及，使用es6会在Android上遇到各种奇奇怪怪的问题，如果遇上只在Android上的问题，可以怀疑是不是使用了什么es6特性。
tips：微信小程序最后的页面大部分都web页，所以一些Android在web上不支持的es6特性，在小程序里面也是有问题的，不过我们还是可以使用强大的babel进行转换。
以上是开发时候遇过的或者在交流群里面有人踩的坑，有问题欢迎大家讨论~
生活不止眼前的苟且，还有踩不完的坑
this.setData估计是小程序中最经常用到的一个方法，但是要注意其实他是有限制的，忽略这些限制的话，会导致数据无法更新 setData的反模式：-- 短时间频繁进行setData操作--页面进入后台后依然进行setData操作-- 使用setData一次性设置太多的数...
用两张图告诉你，为什么你的 App 会卡顿? - Android - 掘金Cover 有什么料？ 从这篇文章中你能获得这些料： 知道setContentView()之后发生了什么？ ... Android 获取 View 宽高的常用正确方式，避免为零 - 掘金相信有很多朋友...
用两张图告诉你，为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料？ 从这篇文章中你能获得这些料： 知道setContentView()之后发生了什么？ ... Android 获取 View 宽高的常用正确方式，避免为零 - 掘金 相信有很多...
现在的教程越拉越多，希望各位善于运用“Ctrl+F”查询自己需要的教程！ 最新小程序商城类开发教程： 1微信小程序之侧栏分类 —— 微信小程序实战商城系列（1） 2微信小程序之仿淘宝分类入口 —— 微信小程序实战商城系列（2） 3微信小程序之购物数量加减 —— 微信小程序实...
转载链接 注：本文转载知乎上的回答 作者：初雪 链接：https://www.zhihu.com/question//answer/ 来源：知乎 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 微信小程序正式公测，张小...
如果您在登录和登出页面看到错误来到这里，说明您无法载入我们的验证码控件，而无法登录。 简书在登录和注册页面使用 极验验证提供的滑动验证码服务，所以使用简书网页需要您可以正确访问极验服务的域名: api.geetest.com 。 如果您在登录和登出页面看到错误，说明在您的电...
《首页和今日看点收录文章》 文:丹菡 每株植物都是一个上天派来的治愈系精灵，它们有自己的特性，自己的喜怒哀乐，驯养它们的同时，你也在被它们驯化改变着，直到有一天，你会发现自己和它们心意相通，浇水除草栽种，会令你内心宁愿快乐喜悦感恩…… 我想要讲的画的，就是我与一个个植物精灵...
“总算装好了，也不知道这老古董还能不能用！” 这一切的起因都是因为张遥在雷达站6S管理时从角落里发现了一个写着“千万别看”的录像带。“这到底是想让我看啊，还是想让我看啊，还是想让我看啊?”于是，忍不住好奇心的张遥又费了半天劲将仓库里万年闲的录像机安装了起来。 “指示灯亮了，...
雪霁——（雨雪停止，天放晴） 这是专属于冬天的景色。 雪是耀眼的白，天是澄澈的蓝。 连着下了一周的雪，稀稀落落缺一点都不热闹。天空，似乎是听到了对大雪的召唤，终于在一个不经意的夜晚赠予这世界一片纯白。 早晨，堆积起来的雪像沙粒一样绵软，大概是铺就了很久很久吧。若是不怕冷，一...
自从2012年赵薇执导的《致青春》、徐峥执导的《泰囧》接连成为“爆款”，演而优则导就成为近几年中国电影市场上一个十分显著的现象。2017年由演员转型而来的导演纷纷交出他们的作品。包括吴京的《战狼2》、苏有朋的《嫌疑人X的献身》、韩寒的《乘风破浪》以及大鹏的《缝纫机乐队》；后...微信小程序怎么测试_百度经验
&&&&&&&&&手机软件微信小程序怎么测试听语音123456推荐视频微信的聊天小程序怎么用？时长：00:43来自：skyshileisl返回暂停重播播放
百度经验:jingyan.baidu.com微信小程序已经上线了，不知道你们是不是在用了呢？小编在小程序刚出来的时候写过一个很简单的关于小程序的经验，不知道大家看了没有。那一篇告诉大家怎么样找到微信小程序，今天我们来测试一下小程序。百度经验:jingyan.baidu.com微信6.5.3百度经验:jingyan.baidu.com1如果之前你有搜索过小程序，那么你的微信应该已经升级了，而且在“发现”那一页的最下方会有“小程序”。2如果你说不好意思我这还没有，不用担心。手机先把微信升级到6.5.3版本，在首页搜索“小程序示例”，然后在发现页就会有记录了，下次直接打开“发现”就有小程序了。3上面的步骤都不重要，重要的是还在搜索页。现在有点饿了，该订餐了。那么不需要你下载饿了么就可以订餐了，直接微信首页搜索“饿了么”，然后会出来一个“饿了么外卖服务”的小程序4点开，获取位置，填写送餐地点，选择你要订的餐点，付款等餐就OK了！5如果晚上需要跟朋友聚个餐唱个歌，很多人会用到美团吧，这里也可以。直接收索美团，找到美团的相关小程序，直接打开团购就可以了。6目前使用比较频繁的小程序有：美团外卖、滴滴、大众点评、京东购物、携程酒店机票火车票等等END经验内容仅供参考，如果您需解决具体问题(尤其法律、医学等领域)，建议您详细咨询相关领域专业人士。作者声明：本篇经验系本人依照真实经历原创，未经许可，谢绝转载。投票(34)已投票(34)有得(0)我有疑问(0)◆◆说说为什么给这篇经验投票吧！我为什么投票...你还可以输入500字◆◆只有签约作者及以上等级才可发有得&你还可以输入1000字◆◆如对这篇经验有疑问，可反馈给作者，经验作者会尽力为您解决！你还可以输入500字相关经验00220热门杂志第1期你不知道的iPad技巧3762次分享第1期win7电脑那些事6619次分享第2期新人玩转百度经验1398次分享第1期Win8.1实用小技巧2646次分享第1期小白装大神1910次分享◆请扫描分享到朋友圈& & & & & 小程序：传图识字君& & & & & & & & & & & & & & & & & 小程序：厕所在哪呢
& & &传图片上去把上面的文字抓取下来& & & & & & & & & & & & & 定位附近的厕所位置
　　做任何程序开发要首先找到其官方文档，我们先来看看其有哪些官方文档。
微信小程序开发文档链接为：https://mp.weixin.qq.com/debug/wxadoc/dev/index.html，如下图：
这里就是做微信小程序开发的全部官方文档。
知道了文档的位置，下面我们来介绍下如何做一个微信小程序开发：
&/*********************************************************************
&微信小程序全套视频教程在线观看地址：
&由于上传到腾讯视频后，视频文件被自动压缩了，导致在线观看的视频不是特别清晰。
&如需清晰版的视频文件，请从以下链接下载：
本套视频教程包含了微信小程序开发的基础知识，特别适合学习微信小程序开发入门使用，请按照顺序观看学习。
本套教程原来销售199元，现免费奉送，所有内容都是笔者亲自录制。
需要课程讲解中用到的示例源码请关注微信公众号：&微little程序&，按照提示获取源码。关注成功后，也可直接点击公众号中的&视频教程&菜单，详细了解获取配套示例源码的方式。
拿到示例源码后，自己再做尝试，学习会更有效果。
也可扫描下方二维码关注该公众号：
& & & & & &
******************************************************************************/
第一步：下载微信小程序开发者工具并安装，下载路径：
进到下载界面后，根据自己的操作系统选择相应的链接进行下载，下载完成后进行安装。
第二步：登录工具
开发者工具安装完成后我们就可以将其打开，初次打开会需要用微信扫码登录，入下图，用手机微信扫一扫后确认登录就可以了。
第三步：创建一个项目
登录成功后，如果是第一次使用该工具会弹出创建项目的窗口，如下图：
在创建过程中，如果选择的本地文件夹是个空文件夹会出来一个勾选项&在当前目录中创建quick start项目&，为方便初学者了解微信小程序的基本代码结构，请勾选此项，勾选后，开发者工具会帮助我们在开发目录里生成一个简单的 demo，如下图：
第四步：项目代码结构解释
点击开发者工具左侧导航的&编辑&，我们可以看到这个项目，已经初始化并包含了一些简单的代码文件。最关键也是必不可少的，是 app.js、app.json、app.wxss 这三个。其中，.js后缀的是脚本文件，.json后缀的文件是配置文件，.wxss后缀的是样式表文件。微信小程序会读取这些文件，并生成小程序实例。
下面我们简单了解这三个文件的功能，方便修改以及从头开发自己的微信小程序。
1、app.js是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API，如本例的同步存储及同步读取本地数据。
2、 app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成，配置小程序的窗口背景色，配置导航条样式，配置默认标题。注意该文件不可添加任何注释。
3、app.wxss 是整个小程序的公共样式表。我们可以在页面组件的 class 属性上直接使用 app.wxss 中声明的样式规则。
　　我们注意到，在实例程序的代码中还有2个文件夹，一个是pages,一个是utils,其中utils是放通用工具类方法的一个文件夹，pages是存放所有页面的文件夹。我们着重讲一下这个pages.
第五步：小程序页面文件构成
　　在这个示例中，我们有两个页面，index 页面和 logs 页面，即欢迎页和小程序启动日志的展示页，他们都在 pages 目录下。微信小程序中的每一个页面的【路径+页面名】都需要写在 app.json 的 pages 中，且 pages 中的第一个页面是小程序的首页。
&每一个小程序页面是由同路径下同名的四个不同后缀文件的组成，如：index.js、index.wxml、index.wxss、index.json。.js后缀的文件是脚本文件，.json后缀的文件是配置文件，.wxss后缀的是样式表文件，.wxml后缀的文件是页面结构文件。
index.wxml 是页面的结构文件：
&!--index.wxml--&
&view class="container"&
bindtap="bindViewTap" class="userinfo"&
&image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"&&/image&
&text class="userinfo-nickname"&{{userInfo.nickName}}&/text&
&view class="usermotto"&
&text class="user-motto"&{{motto}}&/text&
本例中使用了、、来搭建页面结构，绑定数据和交互处理函数。
index.js 是页面的脚本文件，在这个文件中我们可以监听并处理页面的生命周期函数、获取小程序实例，声明并处理数据，响应页面交互事件等。
//index.js
//获取应用实例
var app = getApp()
motto: 'Hello World',
userInfo: {}
//事件处理函数
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
onLoad: function () {
console.log('onLoad')
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function(userInfo){
//更新数据
that.setData({
userInfo:userInfo
index.wxss 是页面的样式表：
/**index.wxss**/
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
.userinfo-nickname {
color: #aaa;
.usermotto {
margin-top: 200px;
页面的样式表是非必要的。当有页面样式表时，页面的样式表中的样式规则会层叠覆盖 app.wxss 中的样式规则。如果不指定页面的样式表，也可以在页面的结构文件中直接使用 app.wxss 中指定的样式规则。
index.json 是页面的配置文件：
页面的配置文件是非必要的。当有页面的配置文件时，配置项在该页面会覆盖 app.json 的 window 中相同的配置项。如果没有指定的页面配置文件，则在该页面直接使用 app.json 中的默认配置。
logs 的页面结构
&!--logs.wxml--&
&view class="container log-list"&
&block wx:for-items="{{logs}}" wx:for-item="log"&
&text class="log-item"&{{index + 1}}. {{log}}&/text&
logs 页面使用&&控制标签来组织代码，在&&block/&&上使用&&绑定&logs&数据，并将&logs&数据循环展开节点
var util = require('../../utils/util.js')
onLoad: function () {
this.setData({
logs: (wx.getStorageSync('logs') || []).map(function (log) {
return util.formatTime(new Date(log))
运行结果如下：
第五步：手机预览（只有获得AppId的才有权限预览）
开发者工具左侧菜单栏选择"项目"，点击"预览"，扫码后即可在微信客户端中体验。
&以上是微信小程序前端开发的基本流程，而实际上要做一个内容可以更新的小程序，单有前端开发是远远不够的，还需要后台开发。后台开发与web开发的后台基本无异，可以选择用java、php、nodejs等任一语言，有一点需要注意的是小程序后台服务器必须是https协议的，这就要求必须购买云服务器并将后台服务器设置成https服务。
本文由微信公众号&微little程序&整理发布，可在微信中搜索公众号&微little程序&关注，也可扫描下面的二维码关注。专注微信小程序领域，发布微信小程序资讯，探讨微信小程序开发技术。
最新文章将第一时间在该公众号中发布。
&微信号：lxwl360
小程序制作服务商：
阅读(...) 评论()
友情链接:(联系QQ:)