如何在客户端 javascript 中使用 Grafana Http API

Posted 2023-02-27

【中文标题】如何在客户端 javascript 中使用 Grafana Http API

【英文标题】：How to use Grafana Http API with client-side javascript

【发布时间】：2016-03-06 17:16:56

【问题描述】：

是否可以将Grafana Http API 与客户端javascript 一起使用？ 我从获取已创建仪表板的 json 的最基本知识开始。

function getHome2Dashboard(callback) 
  $.ajax(
      type: 'GET',
      url:  'http://localhost:3000/api/dashboards/db/home-2',
      crossDomain: true,
      dataType: 'json',
      headers: 
      "Authorization": "Bearer eyJrIjoiYkdURk91VkNQSTF3OVdBWmczYUNoYThPOGs0QTJWZVkiLCJuIjoidGVzdDEiLCJpZCI6MX0="
  ,
  success: function(data)
       
      if( callback ) callback(data);
  ,
  error: function(err)
  
    console.log(err);
  
); 

但我得到一个：

No 'Access-Control-Allow-Origin' header is present on the requested resource.

我也尝试使用jsonp 方法，开发工具显示服务器发回 json 数据但 js 失败，因为（我认为）结果未包装在回调函数中。欢迎就如何实现这一点提出任何建议......

// At the moment I think of something like:

┌──────────┐           ┌───────────┐
│  Browser │ <-------> │  Grafana  │
└──────────┘           └───────────┘

// In order to overcome the cross-origin problems,
// should I go towards something like this?:

┌──────────┐           ┌───────────┐           ┌───────────┐
│  Browser │ <-------> │  Web api  │ <-------> │  Grafana  │
└──────────┘           └───────────┘           └───────────┘

【参考方案1】：

根据theselinks，目前在 Grafana 中无法直接在服务器中设置 CORS 标头，因此您需要将 Grafana 服务器放在反向代理（如 nginx 和在那里添加标题。

请参阅Mozilla Developer documentation about CORS 以了解您面临的问题。