配置小程序

优质
小牛编辑
134浏览
2023-12-01

1. 全局配置

app.json 文件用来对小程序进行全局配置,页面路径、窗口表现、设置网络超时时间、设置 tabbar 等;如果页面内存在的json文件,配置同样的选项,则会覆盖全局的配置(页面内的json 文件只能配置部分选项,具体可参看页面内的配置);

以下是示例配置文件 app.json:

{
  "pages": [
    "pages/index/index",
    "pages/my/my"
  ],
  "window": {
    "navigationBarTitleText": "凡泰小程序 Demo",
    "navigationBarHideCloseButton": true, // 隐藏胶囊关闭按钮
    "navigationBarHideMoreButton": true, // 隐藏胶囊更多按钮
    "navigationStyle": "default/custom/hide"
  },
  "tabBar": {
    "list": [{
      "pagePath": "pages/index/index",
      "text": "首页"
    }, {
      "pagePath": "pages/my/my",
      "text": "个人中心"
    }]
  },
  "networkTimeout": {
    "request": 10000,
  },
  "debug": true
}

1.1 app.json 配置项列表

属性类型必填描述
pagesString Array页面路径列表
windowObject全局的窗口表现
tabBarObjecttab 栏的表现
networkTimeoutObject网络超时时间
debugBoolean是否开启 debug 模式,默认关闭

1.2 window 全局窗口表现

用于设置小程序全局的状态栏、标题、窗口表现等。

属性类型默认值描述
navigationBarBackgroundColorHexColor(十六进制颜色值)#000000导航栏背景颜色,如 #000000
navigationBarTextStyleStringwhite导航栏标题颜色,目前仅支持 black / white
navigationBarTitleTextString导航栏标题文字内容,字数不宜过多
navigationStyleStringdefault导航栏样式,仅支持以下值:1. default(默认样式), 2. custom(自定义导航栏,只保留右上角按钮), 3.hide(隐藏导航栏和右上角胶囊)
backgroundColorHexColor#ffffff窗口的背景色
backgroundTextStyleStringdark下拉 loading 的样式,仅支持 dark / light
backgroundColorTopString#ffffff顶部窗口的背景色,仅 iOS 支持
backgroundColorBottomString#ffffff底部窗口的背景色,仅 iOS 支持
navigationBarHideCloseButtonBooleanfalse隐藏胶囊关闭按钮
navigationBarHideMoreButtonBooleanfalse隐藏胶囊菜单按钮

注意

navigationStyle 只在 app.json 中生效,请勿在页面的json中配置。

示例代码

{
  "window":{
    "navigationBarBackgroundColor": "#ffffff",
    "navigationBarTextStyle": "black",
    "navigationBarTitleText": "小程序接口功能演示",
    "backgroundColor": "#eeeeee",
    "backgroundTextStyle": "light"
  }
}

1.3 tabBar tab 栏表现

tabBar 用来配置小程序底部或者顶部的 tab 导航栏的样式以及跳转的页面等。

详细配置项如下:

属性类型必填默认值描述
colorHexColortab 上的文字默认颜色
selectedColorHexColortab 上的文字选中时的颜色
backgroundColorHexColortab 的背景色
borderStyleStringblacktabbar上边框的颜色, 仅支持 black、white
listArraytab 的列表,详见list 属性说明,支持2-5个tab选项
positionStringbottomtabBar的位置,仅支持两个值: bottom、top

其中 list 是数组类型,只能配置最少2个、最多5个 tab。tab 按数组的顺序排序,每个项都是一个独立的对象,其可配置值如下:

属性类型必填说明
pagePathString页面路径,必须在 pages 数组中先定义
textStringtab 上按钮文字
iconPathString图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,不支持网络图片。当 postion 为 top 时,不显示 icon。
selectedIconPathString选中时的图片路径,要求同 iconPath

1.4 networkTimeout 网络超时时间

网络请求的超时时间,单位均为毫秒。

属性类型必填默认值说明
requestNumber60000ft.request 的超时时间

1.5 debug

布尔类型,当配置为true时,扫码后,小程序中会增加一个信息查看按钮,可以查看 Page 的注册,页面

2. 页面配置

用于指定小程序由哪些页面组成,每一项都对应一个页面的 路径+文件名 信息,pages 数组的第一项代表小程序的首页,增加或减少页面,都需要对 pages 数组进行手动增加或减少,值得注意的是,pages 数组中的项目不能重复。

如开发目录为:

├── app.js
├── app.json
├── app.ftss
├── pages
│   │── index
│   │   ├── index.fxml
│   │   ├── index.js
│   │   ├── index.json
│   │   └── index.ftss
│   └── my
│       ├── my.fxml
│       └── my.js

则需要在 app.json 中写

{
  "pages":[
    "pages/index/index",
    "pages/my/my"
  ]
}

3. sitemap 配置

凡泰现已开放小程序内搜索,开发者可以通过 sitemap.json 配置,当用户的搜索词条触发该索引时,小程序的页面将可能展示在搜索结果中。

3.1 sitemap 配置

小程序根目录下的 sitemap.json 文件用于配置小程序及其页面是否允许被凡泰索引,文件内容为一个 JSON 对象,如果没有 sitemap.json ,则默认为所有页面都允许被索引;

sitemap.json 有以下配置项

属性类型必填描述
rulesObject[]索引规则列表

3.2 rules 配置项

rules 配置项指定了索引规则,每项规则为一个JSON对象,属性如下所示:

属性类型必填默认值取值取值说明
actionstring"allow""allow"、"disallow"命中该规则的页面是否能被索引
pagestring"*"、页面的路径* 表示所有页面,不能作为通配符使用
paramsstring[][]当 page 字段指定的页面在被本规则匹配时可能使用的页面参数名称的列表(不含参数值)
matchingstring"inclusive"参考 matching 取值说明当 page 字段指定的页面在被本规则匹配时,此参数说明 params 匹配方式
priorityNumber优先级,值越大则规则越早被匹配,否则默认从上到下匹配

matching 取值说明

说明
exact当小程序页面的参数列表等于 params 时,规则命中
inclusive当小程序页面的参数列表包含 params 时,规则命中
exclusive当小程序页面的参数列表与 params 交集为空时,规则命中
partial当小程序页面的参数列表与 params 交集不为空时,规则命中

3.3 配置示例

3.3.1 示例1

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "exact"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}
  • path/to/page?a=1&b=2 => 优先索引
  • path/to/page => 不被索引
  • path/to/page?a=1 => 不被索引
  • path/to/page?a=1&b=2&c=3 => 不被索引
  • 其他页面都会被索引

3.3.2 示例2

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "inclusive"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}
  • path/to/page?a=1&b=2 => 优先索引
  • path/to/page?a=1&b=2&c=3 => 优先索引
  • path/to/page => 不被索引
  • path/to/page?a=1 => 不被索引
  • 其他页面都会被索引

3.3.3 示例3

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "exclusive"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}
  • path/to/page => 优先索引
  • path/to/page?c=3 => 优先索引
  • path/to/page?a=1 => 不被索引
  • path/to/page?a=1&b=2 => 不被索引
  • 其他页面都会被索引

3.3.4 示例4

{
  "rules":[{
    "action": "allow",
    "page": "path/to/page",
    "params": ["a", "b"],
    "matching": "partial"
  }, {
    "action": "disallow",
    "page": "path/to/page"
  }]
}
  • path/to/page?a=1 => 优先索引
  • path/to/page?a=1&b=2 => 优先索引
  • path/to/page => 不被索引
  • path/to/page?c=3 => 不被索引
  • 其他页面都会被索引

注意

  • 没有 sitemap.json 则默认所有页面都能被索引
  • {"action": "allow", "page": "*"} 是优先级最低的默认规则,未显式指明 "disallow" 的都默认被索引