是否可以在不使用外部后端的情况下编写 grafana 数据源插件？答案

【问题标题】：Is it possible to write a grafana datasource plugin without using a external backend?是否可以在不使用外部后端的情况下编写 grafana 数据源插件？
【发布时间】：2016-09-01 16:25:12
【问题描述】：

我想写一个不依赖外部后端的 grafana 数据源插件。

我基于 simple-json 数据源插件构建了我的插件：https://github.com/grafana/simple-json-datasource

我尝试将datasource.js中的查询功能改成如下：

原文：

 query(options) {
    var query = this.buildQueryParameters(options);

    if (query.targets.length <= 0) {
      return this.q.when([]);
    }

    return this.backendSrv.datasourceRequest({
      url: this.url + '/query',
      data: query,
      method: 'POST',
      headers: { 'Content-Type': 'application/json' }
    });

我的查询函数：

  query(options) {
      return [
      {
        "target":"upper_75",
        "datapoints":[
          [622,1450754160000],
          [365,1450754220000]
        ]
      },
      {
        "target":"upper_90",
        "datapoints":[
          [861,1450754160000],
          [767,1450754220000]
        ]
      }
    ];
  }

当我实现查询功能并尝试在 graphana 面板中显示图形时，我收到错误消息：

“未定义不是一个对象（评估'dataList.map'）”

不要担心我尝试了所有的数据格式，但似乎 grafana 期望不同的东西作为回报，但我无法弄清楚是什么格式。

我追踪了原始实现返回的内容并复制了它，但它不起作用。

我相信

this.backendSrv.datasourceRequest({
      url: this.url + '/query',
      data: query,
      method: 'POST',
      headers: { 'Content-Type': 'application/json' }
    });

应该返回类似http响应的东西，但为什么我不能手动返回呢？

提前感谢您的帮助！

【问题讨论】：

如果你有原始插件后端工作，那么在浏览器控制台中查看console.log的输出( this.backendSrv.datasourceRequest({ url: this.url + '/query', data:查询，方法：'POST'，标题：{'Content-Type'：'application/json'}}））；在 return 之前插入的语句......必须准确显示 query() 函数应该返回什么。
感谢您的提示！我查了一下，它返回： Object { $$state: Object } $$state 似乎是某种角度对象。我正在进一步调查，谢谢您的帮助！

标签： javascript json callback response grafana

【解决方案1】：

看起来需要包装成promise，不能直接返回。他们使用角度 $q 组件。我让它与返回一起工作：

return this.q(function(resolve, reject) {
    var result = {
      data : [
        {
          "target":"upper_75",
          "datapoints":[
            [622,1450754160000],
            [365,1450754220000]
          ]
        },
        {
          "target":"upper_90",
          "datapoints":[
            [861,1450754160000],
            [767,1450754220000]
          ]
        }
      ]
    }
    resolve(result)
});

你将在构造函数中通过依赖注入获得 $q：

constructor(instanceSettings, $q, backendSrv) {
this.type = instanceSettings.type;
this.url = instanceSettings.url;
this.name = instanceSettings.name;
this.q = $q;
this.backendSrv = backendSrv;}

【讨论】：