【微信小程序】小程序框架(四)

小程序开发框架的目标是通过尽可能简单、高效的方式让开发者可以在微信中开发具有原生 APP 体验的服务。

一、小程序配置

1. 全局配置

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置。文件内容为一个 JSON 对象。有很多的属性配置项。

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html

2. 页面配置

每一个小程序页面也可以使用 .json 文件来对本页面的窗口表现进行配置。页面中配置项在当前页面会覆盖 app.json 的 window 中相同的配置项。文件内容为一个 JSON 对象。有很多的属性配置项。

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html

3. sitemap

微信现已开放小程序内搜索,开发者可以通过 sitemap.json 配置,或者管理后台页面收录开关来配置其小程序页面是否允许微信索引。当开发者允许微信索引时,微信会通过爬虫的形式,为小程序的页面内容建立索引。当用户的搜索词条触发该索引时,小程序的页面将可能展示在搜索结果中。 爬虫访问小程序内页面时,会携带特定的 user-agent:mpcrawler 及场景值:1129。需要注意的是,若小程序爬虫发现的页面数据和真实用户的呈现不一致,那么该页面将不会进入索引中。

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/sitemap.html

二、场景值

场景值用来描述用户进入小程序的路径。

由于Android系统限制,目前还无法获取到按 Home 键退出到桌面,然后从桌面再次进小程序的场景值,对于这种情况,会保留上一次的场景值。

https://developers.weixin.qq.com/miniprogram/dev/reference/scene-list.html

获取场景值

  • 对于小程序,可以在 App 的 onLaunch 和 onShow,或wx.getLaunchOptionsSync 中获取上述场景值。
  • 对于小游戏,可以在 wx.getLaunchOptionsSync 和 wx.onShow 中获取上述场景值

三、渲染层和逻辑层

小程序的运行环境分成渲染层和逻辑层,其中 WXML 模板和 WXSS 样式工作在渲染层,JS 脚本工作在逻辑层。

小程序的渲染层和逻辑层分别由2个线程管理:渲染层的界面使用了WebView 进行渲染;逻辑层采用JsCore线程运行JS脚本。一个小程序存在多个界面,所以渲染层存在多个WebView线程,这两个线程的通信会经由微信客户端(下文中也会采用Native来代指微信客户端)做中转,逻辑层发送网络请求也经由Native转发,小程序的通信模型下图所示:

1. 逻辑层 App Service

小程序开发框架的逻辑层使用 JavaScript 引擎为小程序提供开发者 JavaScript 代码的运行环境以及微信小程序的特有功能。

逻辑层将数据进行处理后发送给视图层,同时接受视图层的事件反馈。

开发者写的所有代码最终将会打包成一份 JavaScript 文件,并在小程序启动的时候运行,直到小程序销毁。这一行为类似 ServiceWorker,所以逻辑层也称之为 App Service。

在 JavaScript 的基础上,我们增加了一些功能,以方便小程序的开发:

  • 增加 App 和 Page 方法,进行程序注册和页面注册。
  • 增加 getApp 和 getCurrentPages 方法,分别用来获取 App 实例和当前页面栈。
  • 提供丰富的 API,如微信用户数据,扫一扫,支付等微信特有能力。
  • 提供模块化能力,每个页面有独立的作用域。

注意:小程序框架的逻辑层并非运行在浏览器中,因此 JavaScript 在 web 中一些能力都无法使用,如 window,document 等。

开发文档:https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/

2. 视图层

框架的视图层由 WXML 与 WXSS 编写,由组件来进行展示。

将逻辑层的数据反应成视图,同时将视图层的事件发送给逻辑层。

WXML(WeiXin Markup language) 用于描述页面的结构。

WXS(WeiXin Script) 是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构。

WXSS(WeiXin Style Sheet) 用于描述页面的样式。

组件(Component)是视图的基本组成单元。

开发文档:https://developers.weixin.qq.com/miniprogram/dev/framework/view/

四、框架接口

 开发文档:https://developers.weixin.qq.com/miniprogram/dev/reference/api/App.html

五、WXML语法

开发文档:https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/

六、WXS语法

开发文档:https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/

七、小程序组件

 开发文档:https://developers.weixin.qq.com/miniprogram/dev/component/

八、小程序API

 开发文档:https://developers.weixin.qq.com/miniprogram/dev/api/

九、服务端API

开发文档:https://developers.weixin.qq.com/miniprogram/dev/api-backend/

原文地址:https://www.cnblogs.com/myitnews/p/12105849.html