小程序学习笔记计划都更新到: 这里 。
2015 年,微信发布了一整套网页开发工具,开放了拍摄、录音、语音识别、二维码、地图、支付、分享、卡券等几十个API,在微信的 WebView 中运行的页面,可以调用的微信原生组件的 JS API,后来演变成了小程序。
虽然小程序等开发过程类似于网页开发,但是它本身已经不是传统意义上的网页,更像是托管在微信上的应用,与微信的结合更紧密,发布修改需要经过微信的审核。
参考:小程序技术发展史
运行环境 逻辑层 渲染层
iOS JavaScriptCore WKWebView
安卓 V8 chromium定制内核
小程序开发者工具 NWJS Chrome WebView
流量主获取广告收益,不需要认证,开通条件如下:
小程序内增值服务,已经认证的小程序可以申请微信支付,在 IOS 系统上不能展示、提供购买、支付功能。
微信提供了 sketch 和 PS 格式设计组件,可以直接使用: 微信小程序设计UI组件。
Sketch 是一个矢量绘图设计工具, 使用方法见:矢量绘图工具 Sketch 的基本用法。
开发者工具才是重点,微信提供了专门用于小程序开发的 IDE, 代码编辑、调试、辅助工具等都有,可以实时预览,支持 Windows 和 macOS: 微信开发者工具下载。
开发小程序可以使用的资源有:小程序开发框架、小程序前端组件、小程序前端交互 API、小程序服务端接口、云端运行的计算存储资源。
组件内容角度,直接阅读 组件文档。
计划单独写一篇笔记。 2019-06-12 23:33:07
交互 API,直接阅读 API 文档
计划单独写一篇笔记。 2019-06-12 23:33:11
计划单独写一篇笔记。 2019-06-12 23:33:16
微信提供了专门用于小程序的云服务,不需要自己维护服务器、创建服务,可以直接使用云函数、数据库、存储、云调用等接口:云开发。
云开发提供了四种能力:数据库、云存储、云函数、云调用。
云开发还提供了 HTTP 接口,开发者可以在自己的服务器上调用云开发的功能:云开发 HTTP API 文档。
云开发提供的数据库是 json 文档数据库,支持条件查询、结果排序等。
数据库 API 分为小程序端和服务端:小程序端数据库 API、服务端数据库 API。
云开发提供非结构化的云存储,支持文件夹、文件和目录搜索、权限设置、临时连接(有效期 2h),可以用 image、audio 等组件直接导入。
文件名编码长度最大为 850 个字节,不能以 / 开头,不能有连续的 /,特殊字符不要用,中文按照 URL Encode 规则转化,建议用大小写字母、数字和富豪 “-、!、_、.、*“组合。
存储的 API 比数据库简单多了,但同样分为小程序端和服务端: 小程序端存储 API、服务端存储 API
云函数就是在云端运行一个或者多个程序文件,占用 CPU 和内存资源,云函数完全独立部署,可以分别部署在不同的地区,云函数可以互相调用。
__dirname
获取,可以在从根目录中获得上传的云函数文件;云调用就是云函数中调用小程序开发的接口 ,。
支持云调用的服务端接口标识有云调用
,见 微信小程序服务端接口。
开发数据也可以通过云调用获取:服务端获取开放数据。
配置文件:app.json,小程序全局配置。
工具配置:project.config.json,开发者工具配置。
页面配置:page.json,独立定义页面属性。
WXML 模板:类似于 HTML 的存在,小程序的页面文件,小程序提供的组件和 api,可以在这里使用。
WXSS 样式:类似于 CSS 的存在,对 CSS 做了一些扩充和修改。
目录结构如下:
├── app.js
├── app.json # 小程序全局配置
├── app.wxss
├── pages
│ │── index
│ │ ├── index.wxml
│ │ ├── index.js
│ │ ├── index.json
│ │ └── index.wxss
│ └── logs
│ ├── logs.wxml
│ └── logs.js
└── utils
当前(2019-06-09 23:00:33) app.json 一共有 16 个配置项。
pages: []string,字符串列表,必须,包含小程序的所有页面,排在最前面的就是小程序的首页;
window: Object,可选,全局设置小程序的状态栏、导航条、标题、背景色等,总共 11 项;
tabBar:Object,可选,小程序的 tab 标签设置,最多 5 个 tab;
networkTimeout: 网络请求超时时间;
debug:debug 模式,输出调试信息;
functionalPages:启用插件功能页;
subpackages: 项目分包结构,启用分包加载时使用,分包加载就是将小程序打包成多个包,按需加载;
preloadRule: 分包预下载的规则 ,就是分包预先下载;
workers:处理多线程任务的 woker 的代码目录,worker 在小程序后台运行;
requiredBackgroundModes: 申请要用到的后台运行的功能;
plugins: 用到的小程序插件;
resizable:在 iPad 上是否可以屏幕旋转;
navigateToMiniProgramAppIdLis: 当前小程序会跳转到的其它小程序的 appid 列表,最多允许填写 10 个;
usingComponents:将自定义组件声明为全局组件,在小程序内可直接使用,不需要再次声明;
permission:小程序需要的接口权限;
sitemapLocation: sitemap.json 文件的路径,默认就是根目录下的 sitemap.json。
把小程序开发指南中的步骤走一遍,就完成入门了。指南文档非常详细,不得不说,原始文档为中文,学习起来顺畅太多了!下面只记录一些要点。
使用微信开发者工具的时候,要用微信登陆。
就是知道用户是从那里进入小程序的,调用相关接口可以得到一个场景值,每个场景值是一类进入场景: 场景值列表。
有些场景还会附带来源的 appid ,可精确知道用户如何过来的,能够返回来源 appid 的场景:
场景值 场景 appId含义
1020 公众号 profile 页相关小程序列表 来源公众号
1035 公众号自定义菜单 来源公众号
1036 App 分享消息卡片 来源App
1037 小程序打开小程序 来源小程序
1038 从另一个小程序返回 来源小程序
1043 公众号模板消息 来源公众号