组件数据源选择为接口时，可将接口返回结果设置为组件展示的数据。目前支持的接口来源有数据分析服务、自定义接口、服务开发工作台、产品与物的管理。本文介绍接口数据源的参数配置。

在Web可视化编辑页面的画布中，选中待配置的组件，例如文字组件，单击右侧样式中文字内容提交框右侧的配置数据源按钮数据源，选中接口数据源进行配置。

说明 各组件数据源的配置操作，请参见本产品文档中Web可视化开发 > 组件目录下的各组件文档。
接口
参数 说明
选择数据源 选择接口。
接口来源 可选：
  • 数据分析服务：调用开发者在物联网数据分析服务中开发的API接口（包含官方通用接口、用户自定义接口），将返回数据作为组件数据源。

    有关数据分析服务的API接口更多信息，请参见SQL分析。

    注意 数据分析服务接口的每秒请求数（QPS）最大限制为1。更多信息，请参见API调用相关限制。
  • 自定义接口：调用开发者自己开发的开放接口或第三方接口，将返回数据作为组件数据源。
    注意 自定义接口必须满足以下要求：
    • 如果设置了请求参数，该参数必须使用JSON格式数据。
    • 接口返回的数据必须是JSON格式的。
    • 调用自定义接口，最大超时时间为10秒。若10秒内未收到接口返回的数据，则返回超时错误。

    支持的JSON的数据格式有：

    • 对象（Object）：{}
    • 数组（Array）：[]
    • 字符串（string）："test"
    • 数字（number）：123
    • 布尔值（bool）：true、false
  • 服务开发工作台：调用在当前项目中，通过服务开发工作台开发的服务接口，将返回数据作为组件数据源。
    注意 如果业务服务中使用了数据分析节点，则该服务接口的QPS最大限制为1。更多信息，请参见数据分析。
  • 产品与物的管理：调用查询产品信息列表的接口、查询产品属性的接口、查询物的详情列表的接口、或查询物的数量的接口，将返回数据作为组件数据源。
说明 部分图表组件（表格、柱状图、条形图、折线图、双Y轴折线图、饼图）和重复列表组件配置接口数据源时，支持的接口类型为数据分析服务、自定义接口和服务开发工作台。
请求方法 选择自定义接口的请求方法，可选：get、post。

当接口来源选择为自定义接口时出现的参数。

请求地址 输入您的自定义接口的请求地址。

当接口来源选择为自定义接口时出现的参数。

选择接口 选择要调用的接口。

当接口来源选择为数据分析服务、服务开发工作台或产品与物的管理时出现的参数。

请求参数 可选：
  • 静态参数：需在下方输入框中，填入键值对组成的请求参数，格式需为标准的JSON格式。
  • 动态参数：需在下方添加请求参数，设置键和值。

    自动更新：当参数变化时，数据源更新。如果不勾选该选项，您可以通过交互动作触发数据源更新。

    参数值来源可选择为：

    • 变量：选择在当前应用中，已创建的变量作为参数值来源。创建变量和给变量赋值的具体操作，请参见变量管理。
    • 组件值：选择当前应用中，已配置的表单组件作为参数值来源。
    • URL参数：以最终发布页面上的某个参数，作为该接口的请求参数值。常用于嵌入页面时，由宿主页提供动态参数，如将传入的产品型号，作为当前接口的请求参数。
    • 登录账号：在开启应用账号鉴权的情况下。配置自定义接口和服务开发工作台接口时，可以选择登录的账号信息做为请求参数，以完成一些界面或功能的定制需求。具体操作，请参见账号数据。
返回结果 单击验证数据格式或确定时，系统都会调用该接口，请求结果会写入到返回结果中，以供您参考。
数据过滤脚本 选中后，基于JavaScript对接口返回的原始数据进行一定的加工以适配图表或文字的展示需求。更多信息，请参见数据过滤器。
数据表配置 选中后，对接口返回或脚本处理之后的结构化数据进行解析并排序，以决定在组件上具体显示数据。更多信息，请参见数据过滤器。
处理后结果 经过脚本处理以及数据表配置优化之后的结果，将直接用于组件的显示。

当勾选了数据过滤脚本或数据表配置时出现的参数。

定时刷新 选中后，需指定每隔多少秒自动调用接口一次，以获得最新数据。默认不开启。

不同组件支持返回数据格式不同，其中需注意的组件有：

  • 表格组件

    如果接口返回的数据格式和静态数据中的格式相同，则是否分页展示的规则也相同。

    接口数据源也支持动态返回每页的内容，如果开启表格组件的分页器，需要满足以下要求：

    • 接口请求参数需包含：pageSize（每页记录数）；pageNo（当前页码，第一页从1开始）
    • 接口返回参数需包含：pageSize（每页记录数）；pageNo（当前页码，第一页从1开始）；total（总记录数，可不传。不传时，目前会影响表格组件的分页器显示）
    说明 以上参数名的字母大小写需与此处描述保持一致。

    组件调用接口时将自动传递pageSize和pageNo参数，如果接口支持返回分页数据，则数据必须满足以下的格式： 

    {
  "pagination":{
    "pageSize": 3,
    "pageNo": 1,
    "total":6
  },
  "data": [
    {
      "month": "Jan",
      "sales": 300,
      "cost": 150
    },
    {
      "month": "Feb",
      "sales": 300,
      "cost": 150
    },
    {
      "month": "Mar",
      "sales": 300,
      "cost": 150
    }
  ]
}

    total表示所有数据的总条数，表格组件将根据这个数字和每页的条数显示分页，data表示当前页的数据，格式和上方静态数据源中一致。

    注意 建议data中的数据个数和参数中的pageSize保持一致，如果不一致，会导致表格的分页器无法正常展示。
  • 支持配置静态数据源的表单组件

    接口返回数据需与静态数据的数据格式要求一致。更多信息，请参见静态数据。

    说明 如果接口返回数据不满足要求，可使用数据过滤脚本功能处理数据。
表 1. 数据格式验证
操作 说明
格式参考 单击格式参考，查看组件支持的数据格式。
验证数据格式 单击验证数据格式按钮，验证当前数据格式是否满足组件的格式要求。满足要求，则提示“验证成功”；不满足，则会提示详细的错误信息。