通过设置日志服务控制台内嵌参数,可以调整内嵌页面的显示效果。

日志服务提供免登方式嵌入自建Web页面,支持您快速方便地对日志进行查询分析。在此基础上,还提供了一系列UI参数与第三方自建Web页面进行融合展示。免登方式嵌入自建Web页面详情请参见控制台内嵌及分享

URL格式

所有UI参数均以URL格式进行控制,URL格式示例如下:
https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}?参数1&参数2
说明
  • ${ProjectName}${LogstoreName}之外的参数必须位于URL末尾的问号(?)之后。
  • 支持同时设置多个参数,参数之间通过and(&)连接。
  • 增加参数theme=dark&sls_iframe=true,可将页面设置为黑色主题。

公共参数

使用公共参数设置控制台页面。

参数名 类型 是否必选 说明 示例
hideSidebar boolean 隐藏侧边栏。 hideSidebar=true
hideTopbar boolean 隐藏顶部阿里云标题栏。 hideTopbar=true
hiddenBack boolean 隐藏导航栏返回按钮。 hiddenBack=true
hiddenChangeProject boolean 隐藏切换Project功能。 hiddenChangeProject=true
hiddenOverview boolean 隐藏Project概览 hiddenOverview=true
ignoreTabLocalStorage boolean 关闭Tab访问的历史记录。 ignoreTabLocalStorage=true
keyFilter JSON 过滤显示导航栏资源列表,支持过滤的资源类型如下:
  • logstore:日志库
  • savedsearch:快速查询
  • dashboard:报表
说明
  • 通过短划线(-)表示模糊匹配。
  • 格式为JSON类型,必须经encodeURL进行两次转码。
{"logstore":["logstore-xx"],"savedsearch":["savedsearch-xx"],"dashboard":["dashboard-xx"]}
queryTimeType long 指定查询的时间范围,详情请参见表 1。取值范围为:
  • 1~26:表示指定查询的时间范围为数字对应的区间。
  • -2:表示自定义(相对)。此时必须配置start和end。例如:start:-10m,end:now。
  • -3:表示自定义(整点)。此时必须配置start和end。例如:start:-2h,end:absolute。
  • 99:表示自定义时间范围。此时必须设置startTime和endTime,且只能配置为时间戳。
queryTimeType=1
startTime timestamp(date) 指定查询时间范围的起始时间。当queryTimeType设置为99时生效。 startTime=1547776643
endTime timestamp(date) 指定查询时间范围的结束时间。当queryTimeType设置为99时生效。 endTime=1547776731
表 1. queryTimeType指定查询的时间范围说明
queryTimeType 代表含义
1 1分钟(相对)
2 15分钟(相对)
3 1小时(相对)
4 4小时(相对)
5 1天(相对)
6 1周(相对)
7 30天(相对)
8 1分钟(整点)
9 15分钟(整点)
10 1小时(整点)
11 4小时(整点)
12 1天(整点)
13 1周(整点)
14 30天(整点)
15 今天(整点)
16 昨天(整点)
17 前天(整点)
18 本周(整点)
19 上周(整点)
20 本月(整点)
21 本季度(整点)
22 今天(相对)
23 5分钟(相对)
24 今年(整点)
25 本月(相对)
26 上月(整点)
27 本周(相对)
99 自定义时间,此时要传入startTime和endTime。
URL参数及效果示例如下所示:
  • 使用如下URL隐藏导航栏返回按钮、Project切换、Project概览入口和顶部的阿里云标题栏。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}?hiddenBack=true&hiddenChangeProject=true&hiddenOverview=true&hideTopbar=true
    隐藏设置
  • 使用如下URL隐藏侧边栏。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}/?hideSidebar=true
    隐藏侧边栏
  • 使用如下URL隐藏导航栏返回按钮。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}/?hiddenBack=true
    隐藏导航栏返回按钮
  • 使用如下URL过滤导航栏资源列表。

    例如在URL中设置参数keyFilter,通过设置的JSON对象对左侧资源列表进行筛选。需要指定显示名称包含aegis-和名称为500osslog的日志库、包含OSS的快速查询以及包含DDOS的报表。

    原始JSON为"{"logstore":["aegis-","500osslog"],"savedserach":["oss"],"dashboard":["ddos"]}",其中aegis-表示模糊匹配名称中包含aegis的所有日志库,500osslog表示精确匹配名称为500osslog的日志库,即使用名称和短横线(-)来表示模糊查询。

    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}/?keyFilter=%7B"logstore":%5B"aegis-","500osslog"%5D,"savedsearch":%5B"oss"%5D,"dashboard":%5B"ddos"%5D%7D 
    过滤导航栏资源列表
  • 使用如下URL设置时间选择器。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}/?queryTimeType=2
    时间选择器

Logstore查询分析页面相关参数

使用Logstore查询分析页面相关参数设置Logstore查询分析页面。

参数名 类型 是否必选 说明 示例
ProjectName string Project名称。
LogstoreName string Logstore名称。
queryString string 预先搜索的字符串。 queryString=${使用base64编码后的sql语句}
readOnly boolean 隐藏编辑、修改按钮,例如分享查询分析属性另存为快速查询另存为告警等。 readOnly=true
encode string 为了避免queryString中出现特殊字符,建议使用encode=base64,此时queryString为base64编码后的字符串。 encode=base64
hiddenEtl boolean 隐藏数据加工入口。 hiddenEtl=true
hiddenShare boolean 隐藏分享按钮。 hiddenShare=true
hiddenIndexSetting boolean 隐藏索引设置按钮。 hiddenIndexSetting=true
hiddenSavedSearch boolean 隐藏快速查询按钮。 hiddenSavedSearch=true
hiddenAlert boolean 隐藏告警按钮。 hiddenAlert=true
hiddenQuickAnalysis boolean 默认收起快速分析栏。 hiddenQuickAnalysis=true
hiddenDownload boolean 隐藏下载功能。 hiddenDownload=true
keyDispalyMode string 内容列显示。
  • single:整行。
  • multi:换行。
keyDispalyMode=single
URL参数及效果示例如下所示:
  • 使用如下URL设置预先搜索的字符串。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}?encode=base64&queryString=${使用base64编码后的sql语句}
  • 使用如下URL隐藏编辑、修改按钮。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}?readOnly=true
    设置readOnly
  • 使用如下URL隐藏数据加工入口。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}?hiddenEtl=true
    隐藏数据加工入口

Logstore快速查询页面相关参数

使用Logstore快速查询页面相关参数设置快速查询页面。

参数名 类型 是否必选 说明 示例
ProjectName string Project名称。
savedSearchName string 快速查询名称。 {savedSearchName}
URL参数及效果示例如下所示:
https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/savedsearch/${savedSearchName}
快速查询页

仪表盘内嵌参数

使用仪表盘内嵌参数设置仪表盘页面。

参数名 类型 是否必选 说明 示例
ProjectName string Project名称。
dashboardName string 仪表盘名称。
filters string 过滤条件,需要手动转码。

例如:转码前格式为encodeURIComponent('filters=key1:value1&filters=key2:value2')。转码后为"filters%3Dkey1%3Avalue1%26filters%3Dkey2%3Avalue2"

encodeURIComponent('filters=key1:value1&filters=key2:value2')
token JsonString 变量替换,需要手动转码。

例如:转码前为encodeURIComponent('token=[{"key": "projectName","value":"1"}, {"key": "xxx", "value": "yy"}]')。转码后为"token%3D%5B%7B%22key%22%3A%20%22projectName%22%2C%22value%22%3A%221%22%7D%2C%20%7B%22key%22%3A%20%22xxx%22%2C%20%22value%22%3A%20%22yy%22%7D%5D"

encodeURIComponent('token=[{"key": "projectName","value":"1"}, {"key": "xxx", "value": "yy"}]')
readOnly boolean 隐藏仪表盘页面的编辑、设置按钮,例如编辑告警等按钮。 readOnly=true
hiddenFilter boolean 隐藏过滤条件。 hiddenFilter=true
hiddenToken boolean 隐藏变量替换。 hiddenToken=true
hiddenProject boolean 隐藏Project信息。 hiddenProject=true
hiddenEdit boolean 隐藏编辑按钮。 hiddenEdit=true
hiddenReport boolean 隐藏订阅按钮。 hiddenReport=true
hiddenTitleSetting boolean 隐藏标题设置按钮。 hiddenTitleSetting=true
hiddenReset boolean 隐藏重置时间按钮。 hiddenReset=true
autoFresh string 报表定时刷新,例如:30s、5min,最小刷新间隔必须大于15s。 autoFresh=5m
URL参数及效果示例如下所示:
  • 使用如下URL使仪表盘页面为只读模式,即不可编辑模式。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/dashboard/${dashboardId}/?readOnly=true 
    只读仪表盘
  • 使用如下URL为仪表盘增加两个过滤条件key1=value1和key2=value2。

    仪表盘中所有图表的查询分析语句会针对过滤条件先进行一次过滤,再继续执行查询语句中的条件。

    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/dashboard/${dashboardId}?encodeURIComponent('filters=key1:value1&filters=key2:value2') 
    仪表盘过滤
  • 使用如下URL增加多个变量替换条件。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/dashboard/${dashboardId}?encodeURIComponent('token=[{"key": "projectName","value":"1"}, {"key": "xxx", "value": "yy"}]') 
    变量替换条件
  • 使用如下URL使仪表盘每5分钟刷新一次。
    https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/dashboard/${dashboard_name}?autoFresh=5m
    自动更新

树状结构参数

树状结构参数用于定义控制台的左侧导航栏。

参数名 类型 是否必选 说明 示例
treeConfig JSON 定义左侧导航树状结构,需要手动转码。完整示例

例如转码前为{"logstore":{"expand":true,"resourceList":["delete-log"],"template":["savedsearch","alert"]}}。转码后为eyJsb2dzdG9yZSI6eyJleHBhbmQiOnRydWUsInJlc291cmNlTGlzdCI6WyJkZWxldGUtbG9nIl0sInRlbXBsYXRlIjpbInNhdmVkc2VhcmNoIiwiYWxlcnQiXX19

treeConfig=eyJsb2dzdG9yZSI6eyJleHBhbmQiOnRydWUsInJlc291cmNlTGlzdCI6WyJkZWxldGUtbG9nIl0sInRlbXBsYXRlIjpbInNhdmVkc2VhcmNoIiwiYWxlcnQiXX19
treeEncode string treeConfig的编码方式,默认为空,表示不编码。如果要编码,仅支持base64。 treeEncode=base64
treeConfig参数完整示例如下所示:
{
    "logstore": { 
        "search": true, 
        "expand": true, 
        "resourceList": [ 
            "L1",
            "L2"
        ],
        "template": [
            "favor", 
            "logtail",
            "import", 
            "etl", 
            "savedsearch",
            "alert",
            "export", 
            "consumergroup", 
            "dashboard" 
        ]
    },
    "machineGroup": {
        "search": true,
        "resourceList": [
            "m1",
            "m2"
        ]
    },
    "savedSearch": {
        "search": true,
        "resourceList": [
            "s1",
            "s2"
        ]
    },
    "alarm": {
        "search": true,
        "resourceList": [
            "a1",
            "a2"
        ]
    },
    "dashboard": {
        "search": true,
        "resourceList": [
            "d1",
            "d2"
        ]
    },
    "etl": {
        "search": true,
        "resourceList": [
            "e1",
            "e2"
        ]
    }
}
表 2. treeConfig参数说明
参数名 类型 是否必选 说明
logstore Object Logstore列表的资源控制。
template string[] Logstore列表内的一些功能控制,详情请参见表 4
machineGroup Object 机器组列表的资源控制。
savedSearch Object 快速查询列表的资源控制。
alert Object 告警列表的资源控制。
dashboard Object 仪表盘列表的资源控制。
etl Object 数据加工列表的资源控制。
表 3. 资源相关参数说明
参数名 类型 是否必选 说明
search boolean 是否显示搜索框,默认为true,表示不显示。
resourceList String[] 显示当前资源的列表。如果为空数组,则显示空列表,如果不设置该参数则全部显示,精准匹配。默认显示全部列表。
expand boolean 是否展开列表,默认为false,表示不展开,仅针对Logstore列表有效。
表 4. template参数说明
参数名 类型 是否必选 说明
favor string 我的关注
logtail string Logtail配置
import string 数据导入
etl string 数据加工
savedsearch string 快速查询
alert string 告警
export string 数据导出
consumergroup string 数据消费
dashboard string 可视化仪表盘
使用如下URL设置左侧导航栏。
https://sls4service.console.aliyun.com/lognext/project/${ProjectName}/logsearch/${LogstoreName}?treeconfig=eyJsb2dzdG9yZSI6eyJleHBhbmQiOnRydWUsInJlc291cmNlTGlzdCI6WyJkZWxldGUtbG9nIl0sInRlbXBsYXRlIjpbInNhdmVkc2VhcmNoIiwiYWxlcnQiXX19&hiddenBack=true&hiddenChangeProject=true&hiddenOverview=true&hideTopbar=true&treeEncode=base64&ignoreTabLocalStorage=true
树状结构

仪表盘高阶参数

将iframe容器嵌入仪表盘页面时,无法确定iframe容器的高度,有可能导致两层滚动条,包括嵌入页面外层滚动条和iframe内部报表的滚动条。此时,您可以使用仪表盘高阶参数用于自适应仪表盘高度。仪表盘高阶参数
对于外层iframe的高度可以通过日志服务postmessage的dashboardHeight来获取,并设置为iframe高度,从而避免该问题。示例代码如下所示:
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>POST message测试</title>
</head>
<style>
  * {
    padding: 0;
    margin: 0;
  }

  iframe {
    display: block;
    width: 100%;
  }
</style>
<body>
  <script>
    window.addEventListener('message',function(e){
      console.log(e.data.dashboardHeight)
      document.getElementById('test').style.height = e.data.dashboardHeight + 'px'
    });
  </script>
  <div style="height: 700px;">somethings</div>
  <iframe id="test" src="http://sls4service.console.aliyun.com/lognext/project/${projectName}/dashboard/${dashboardName}?hideTopbar=true&product=${productCode}">
</body>
</html>