全局配置

小程序根目录下的app.json文件用来对小程序进行全局配置,决定页面的窗口表现、设置多 tab ,设置权限等。

配置示例:


{  
  "window": {
    "navigationStyle": "default",
    "navigationBarBackgroundColor": "#2DBCFE",
    "navigationBarTitleText": "小程序列表",
    "navigationBarTextStyle": "black"
  },
  "tabBar": {
    "color": "#000000",
    "selectedColor": "#0000FF",
    "backgroundColor": "#FFFFF0",
    "borderStyle": "black",
    "list": [
        {
        "pagePath": "index.js",
        "text": "首页",
        "iconPath": "img/wx.png",
        "selectedIconPath": "img/wxfriend.png" 		
      },
      {
        "pagePath": "feedback.js",
        "text": "服务",
        "iconPath": "img/wx.png",
        "selectedIconPath": "img/wxfriend.png" 		
      }
    ]
},

"permission": {
   "scope.userLocation": {
     "desc": "你的位置信息将用于小程序位置接口的效果展示"
    },
	 "scope.userInfo": {
      "desc": "你的用户信息将用于小程序用户展示"
    }
  }
}

app.json配置项列表

属性 类型 必填 描述 最低版本
window Object 全局的默认窗口表现
tabBar Object 底部 tab 栏的表现
permission Object 小程序接口权限相关设置

表4-1

  • window用于设置小程序的状态栏、导航条、标题、窗口背景色。
属性 类型 默认值 描述
navigationStyle String default 导航栏样式,仅支持以下值: default 默认样式 custom 自定义导航栏,只保留右上角胶囊按
navigationBarBackgroundColor String #FF00FF 导航栏背景颜色 和 状态栏背景色 如 "#FF00FF"
navigationBarTitleText String 导航栏标题文字内容
navigationBarTextStyle String white 导航栏标题颜色,胶囊按钮的颜色。仅支持 black / white

表4-2

  • tabBar如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。
属性 类型 默认值 描述
color String tab 上的文字默认颜色
selectedColor String tab 上的文字选中时的颜色
backgroundColor String tab 的背景色
borderStyle String black tabbar上边框的颜色, 仅支持 black / white
list Array tab 的列表,详见 list 属性说明,最少2个、最多5个 tab

表4-3

其中 list 接受一个数组,只能配置最少 2 个、最多 5 个 tab。tab 按数组的顺序排序,每个项都是一个对象,其属性值如下:

属性 类型 必填 说明
pagePath String 页面路径,必须在 pages 中先定义
text String tab 上的文字选中时的颜色
iconPath String 图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,不支持网络图片。
selectedIconPath String 选中时的图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,不支持网络图片。

表4-4 图4-1

  • permission

小程序接口权限相关设置。字段类型为 Object,结构为

属性 类型 必填 默认值 描述
scope.userLocation PermissionObject 位置相关权限声明

表4-5

PermissionObject 结构

属性 类型 必填 默认值 说明
desc String 小程序获取权限时展示的接口用途说明。最长30个字符

表4-6

如:


{

"permission": {

"scope.userLocation": {

"desc": "你的位置信息将用于小程序位置接口的效果展示"

},

"scope.userInfo": {

"desc": "你的用户信息将用于界面展示"

}

}

}

授权

部分接口需要经过用户授权同意才能调用。我们把这些接口按使用范围分成多个 scope ,用户选择对 scope 来进行授权,当授权给一个 scope 之后,其对应的所有接口都可以直接使用。

部分接口需要获得用户授权同意后才能调用。此类接口调用时:

  • 如果用户未接受或拒绝过此权限,会弹窗询问用户,用户点击同意后方可调用接口;

  • 如果用户已授权,可以直接调用接口;

  • 如果用户已拒绝授权,则不会出现弹窗,而是直接进入接口 fail 回调。请开发者兼容用户拒绝授权的场景。

获取用户授权设置(暂未实现)

开发者可以使用 moduleName.getSetting 获取用户当前的授权状态。

打开设置界面(暂未实现)

用户可以在小程序设置界面(「右上角」 - 「关于」 - 「右上角」 - 「设置」)中控制对该小程序的授权状态。

开发者可以调用 moduleName.openSetting 打开设置界面,引导用户开启授权。

提前发起授权请求

开发者可以使用 moduleName.authorize 在调用需授权 API 之前,提前向用户发起授权请求。

scope 列表

scope 对应接口 描述
scope.userInfo moduleName.getUserInfo 用户信息
scope.userLocation moduleName.getLocation 地理信息
scope.userCamera moduleName.captureImage moduleName.captureVideo moduleName.scanCode 摄像头

表4-7