cloudspout / cloudspout-button-panel Goto Github PK
View Code? Open in Web Editor NEWGrafana panel to integrate with any kind of HTTP/REST API
License: MIT License
Grafana panel to integrate with any kind of HTTP/REST API
License: MIT License
Hi,
I tried to make a post request using this button from Grafana cloud v8.4.3.
The post request is used to write point info to the Influxdb cloud, using its API.
To make sure that the problem is not from the Influxdb side, I have written a similar code that runs in Python and works alright.
url = "https://us-east-1-1.aws.cloud2.influxdata.com/api/v2/write?org='ORG’&bucket='BUCKET’&precision=ns"
custom_header = {"Authorization":"Token ‘#token_value’",
"Content-Type": "text/plain; charset=utf-8" }
data = " #Arbitrary_DATA"
r = requests.post(url,data,headers=custom_header)
I have also contacted the Grafana support team to make sure that the "Failed to fetch" error is not because of their API. However, they suggested contacting the button panel team and seeking a solution.
The POST request works well for httpbin.org/post, but not for Influxdb requests.
I would appreciate your suggestions in this regard.
Hi,
We have one urgent request, we are trying to download the file using API, we are seeing the response data as encoded content.
We need to download the file on click.
we are using flask API from flask.send_file
I'm quite new to the grafana env.
I've just set up a button to do a GET to an host inside my local network but when i press it in the console i receive
ButtonPanel.tsx:171 Request error: TypeError: Failed to fetch
In this case the request is done to
http://192.168.188.99/status
which is fully accessible via browser
Many of method are used via PUT, e.x. https://docs.gitlab.com/ee/api/merge_requests.html#merge-a-merge-request
Minor issue: In the Button Panel section, with the 'custom' variant, we see 'Fackground Color'.
I assume this must be corrected to 'Foreground Color'.
Kind regards, - Dirk
hello ,
how can we manage data response ( json ) of Post request
Thanks
When I try to execute a REST call to my home assistant server I get the following error from the preflight request:
Credentials flag is true, but Access-Control-Allow-Credentials is not "true".
I have configured my home assistant server with the correct cors_allowed_origins
I am using the following headers:
Authorization: Bearer (my home assistant token)
Authentication switch is turned off and the request is a POST request with a valid json which works fine if I try it with another HTTP client.
Installed using readme
7.0.2 does not appear under visualisers at all.
7.0.3 and 7.0.4 does, however either of them, when selecting button panel triggers Grafana error;
An unexpected error happened
Details
Error: Minified React error #130; visit https://reactjs.org/docs/error-decoder.html?invariant=130&args[]=undefined&args[]= for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
Hello
Is there a way to skip tls check , in order to be able to deal with https rest witch is using an auto signed certificate
With https i'am getting net::ERR_CERT_AUTHORITY_INVALID
NB : tls check disabled is already implemented in other plugins
Thanks
Hi, thank you for cool project!
Is it possible to add support for http/socks5 proxies?
In my case it will be usefull to bypass IP whitelist for remote API without need to use VPN or export http_proxy
on server with Grafana
When I use 'Custom' variant, save my dashboard and reload the page, the variant option resets to 'Primary'.
Because Grafana doesn't save undefined values into json configs, it uses the defaultValue which is 'primary'.
What is the point of using undefined value instead of 'custom' str?
cloudspout-button-panel/src/module.ts
Line 107 in 743a01b
Hi, @derjust Thanks for the contributions!
I am using your button now. But I don't expect to see the "check" logo after successful request, do you know where to edit the related codes?
Hi guys,
i have tried to install this plugin packaged here (https://github.com/cloudspout/cloudspout-button-panel/releases/download/7.0.7/cloudspout-button-panel.zip) through normal grafana process installation, that is :
But going to grafana plugin page i see the message "Error loading plugin. check the server startup logs for more information. if this plugin was loaded from git, make sure it was compiled".
So is there no a zip file already prepared for the grafana installation ?
I have also tried to change current cors status for my firefox (versione 82.0 64bit) (https://www.google.com/search?client=firefox-b-d&q=firefox+enable+cors) but without success.
OS version : Redhat 7.7
From grafana log i see only this without any errors...
[root@node001 grafana]# grep -i button grafana.log
t=2020-10-27T06:42:53-0300 lvl=info msg="Registering plugin" logger=plugins name="Button Panel"
[root@node001 grafana]#
Thanks for any feedback.
Regards
thanks for nice plugin
Not sure if I'm doing it right, but when I have received the GET request from Grafana button Plugin in node-red, I return StatusCode 200. But the Button Panel symbol changes to warning triangle and not the check mark as show in Code section of the plugin.
Is it wrong to send StatusCode 200 or is there any documentation on how to do this properly ?
When I click to edit a button panel, the set text will revert to the default text. I am fairly sure this has to do with the fact that my button text is completely whitespace since I just want a left / right arrow for the button icon
steps to reproduce:
this was using plugin version 7.0.23 on grafana v8.1.5
Would it be an idea to have an option to not send any REST query, so that it only does a mysql query.
A possible Use Case would be to press a button that only updates a mysql table entry. A process that monitors changes of this mysql table could trigger further actions.
Implementation of such an option may be possible to simply leave the URL of REST Integration empty:
If the url is not defined, it simply does not invoke any REST query.
Currently, when leaving the url empty, the button shows a rotating icon as if something is running but most likely is not.
Thanks in advance and kind regards.
I download the .zip file and unpack it into grafana plugins directory(*/grafana/data/plugins).
But get "Panel plugin not found: cloudspout-button-panel" error.
Here my code in Dockerfile
RUN wget -O cloudspout-button-panel.zip 'http://***/cloudspout-button-panel.zip'
RUN unzip cloudspout-button-panel.zip -d ./data/plugins
RUN rm -rf cloudspout-button-panel.zip
Grafana version is 6.3.6
Thanks for your work to create that plugin. Really helpful.
As far as i can see, the REST calls are only direct HTTP queries from browser to target server.
But sometimes the target server might not be reachable from browser, but only from Grafana server.
Unfortunately this is the case for my scenario (grafana server is dual homed).
However queries to the datasources can already be "proxied" via Grafana server (at least InfluxDB).
I would find such a option for your plugin very useful and appreciate such a feature.
I think this could be useful for others too.
Using:
cloudspout-button-panel 7.0.23
Grafana v7.3.4
hello,
The DELETE ( we have just GET/POST) can be added ?
Thanks
Hello, i installed multiple times the button to do post request, but today i installed it, and there is no option for the rest integration, the button shows in the dashboard, but i dont have any options to edit it, i cant even change the text. is there a new update or im missing something?
Thanks !
This is not working for the Grafana above v8.x.x
Do you have any plan to update this plugin?
Add 'Basic ' in
requestHeaders.set('Authorization', 'Basic ' + btoa(options.username + ':' + options.password));
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Authorization
I've tried to implement a simple button with a GET request to a http-endpoint in NODERD (local network) and I alway get an error message fron the button panel (Failed to fetch network ressource), that the network ressource cannot be fetched. But this is wrong - in NODERED the request will received correctly. The http endpoint in NODERED simply reply a "http-200" (nothing else). Grafana runs in a container. A fundamental network problem can be excluded, due to the fact, that my other data sources cann be reached without any problems (e.g. a INFLUX DB in an neighbor container and plugin sources in internet)
Hi
Me again.
Would it be possible to add a way for the user to choose the icon that shows on the left of the button ?
Maybe using fontawesome could be enough, but it'd be nice to have the choice of custom icon as well.
Also, a customisation of the colors of the button would be nice.
Thank you again !
We use this plugin to call pipeline triggers on our GitLab instance, these use simple requests, with an api token as a query parameter. Since updating Grafana to latest version we had to also update this button plugin (we couldn't see/edit any of the
Rest Integration
settings of the panel).
After updating the plugin we get CORS errors when using our buttons:
Access to fetch at 'https://our-gitlab-server.com/api/v4/projects/###/trigger/pipeline?ref=master&token=######&variables' from origin 'https://our-cluster-domain.com' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
We checked the code and saw that it is defaulting to setting credentials: true
, even when not using any form of auth. I am not versed in typescript to make the necessary changes and am not familiar enough with CORS policies and such but I thought this might be a cause to our problem?
cloudspout-button-panel/src/ButtonPanel.tsx
Lines 105 to 113 in f5777a1
Grafana 7 comes with a signing feature for plugins.
There is no process for community plugins yet:
https://grafana.com/docs/grafana/latest/developers/plugins/sign-a-plugin/#:~:text=Signing%20a%20plugin%20allows%20Grafana,including%20Enterprise%20plugins%2C%20are%20signed.
The Grafana fails to load the panel configuration because the browsers want as a "Mixed Content" and prevent loading the configuration panel. This is because the default value in the URL is set to "http://api.example.com".
It appears that this issue presents the Grafana to load the configuration panel and display it to the user to configure the panel.
Screenshot of Chrome to show the issue is here:
Hi,
use grafana-button-panel Version 7.03.
No GET-Action is possible.
The Node-Red Setup is already done.
curl -u node_red_xxxxx:pw_node_red_xxxxx -i -s localhost:1880/btn01 - works fine
curl node_red_xxxxx:pw_node_red_xxxxx@localhost:1880/btn01?wert=44 - works fine
http://node_red_xxxxx:[email protected]:1880/btn01 - works fine from a remote Browser
cloudspout-button-panel does literally nothing...
use grafana 7.1.0
basic auth for Node-Red Access is required.
Any Idea to get running the Button?
Or: What is the clean path to uninstall the button-panel?
Kind regards
runout
Hi,
First: Thanks for developing this plugin. It would be perfect for my needs.
However, after I installed version 7.0.4 of the plugin for grafana 7.2.0 I noticed that the "Options" dialog is missing after selecting "Button Panel" as visualization. (Also see the screenshot below).
Without this, configuration is impossible.
Can you please have a look at this behaviour?
Please add a Data field for JSON data. Without it, POST does not work with most APIs because you can't add that data as headers.
We are calling REST API on button click. And we need to add confirmation box before it, which contains OK and Cancel button. When OK is clicked Call the REST API and on Cancel just cancel the request.
Use Case: Need to add confirmation Box when button is clicked instead of directly calling REST API.
Could you consider this as a feature request ?
I'd like to be able to push data to a node-red that's installed on the same machine but listens to another port.
Currently, I use a variable containing the IP address/host and use that in the REST URL, but I was wondering if it was possible to either
Thank you!
Please how to parametrize in Grafana plugin CloudSpout Button Panel
according following openhab2 rest api statement:
curl --header 'Content-Type: text/plain' --request POST --data 'ON' 'http://openhabIP:8080/rest/items/BasicSwitch4' or curl -X POST --header "Content-Type: text/plain" --header "Accept: application/json" -d "OFF" "http://openhabIP:8080/rest/items/BasicSwitch4".
Version numbers:
Grafana 8.2.5, CloudSpout LLC Button Panel, Raspbian buster,
Running on RPi4 4GB
Thanks.
Grafana, for some reason, fails to install the plugin using the zip url.
To reproduce:
$> docker run -it --entrypoint sh grafana/grafana:7.0.3
/usr/share/grafana # grafana-cli --pluginUrl https://github.com/cloudspout/cloudspout-button-panel/releases/download/1.0.3/cloudspout-button-panel.zip plugins install cloudspout-button-panel
installing cloudspout-button-panel @
from: https://github.com/cloudspout/cloudspout-button-panel/releases/download/1.0.3/cloudspout-button-panel.zip
into: /var/lib/grafana/plugins
Error: ✗ failed to extract plugin archive: failed to extract file: failed to open file: open /var/lib/grafana/plugins/cloudspout-button-panel/img/logo.svg: no such file or directory
I fixed the issue by creating a new zip under linux and publishing it somewhere else:
zip -r cloudspout-button-panel.zip cloudspout-button-panel
I found out that if I do the same operation on a mac, I have the same error as above. Only zip created under linux seems to work.
So far the button supports HTTP GET and POST, which is great - many thanks!
It would be even better to use it as a navigation button, where it navigates the browser to a specific URL (or dashboard-id).
Why? Because this button looks nicer than the integrated link buttons.
The easiest way might be just a link-field.
hello ,
when a variable that contains / ( slash) is used in the URL , it's not encoded
And so the final URL is not good
ENV
- Grafana version 7.3.4
- cloudspout-button-panel version 7.0.23
to reproduce just use a variable that contain / in the URL
can you please help resolving that ...
Thanks
The same behaviour as on the gif in Readme. No errors in the console, sending the request and showing a check mark instead of the loading animation.
JS throws an error "Cannot read property 'forEach' of undefined" after pressing the button with the same config as in the Readme file. The query is not sent and the button gets stuck with 'loading' animation
grafana:7.3.2
cloudspout-button-panel:7.0.7
chrome 86.0.4240.198 (mac)
Thank in advance.
Tony
The latest available release in the Grafana plugin overview is 7.0.23.
There are some critical bug fixes and improvements in 7.0.25, which can currently not be used
Hi! First thank you, this is a great plugin. I'm using grafana for some admin tasks and this is very useful.
For my needs I forked and modified your code.
In the editor I allow to add other kind of parameters: "variable parameters" that will be resolved before the request. Also I allow to use the variable notation in the label of the button. "This is the label for $variable"
In the panel I'm resolving the variables configured in the editor: first I look for ad hoc filters (I use them in elasticsearch) then for regular variables like text box variables.
The use case form me is the ability to invoke an endpoint with current dashboard filters and variables.
What do you think? would you be interested in a pull request?
Hi,
Thank you for this plugin.
Would it be hard to implement multiple buttons support in the same panel ?
Their ordering could be left-to-right or top-to-bottom and ideally they'd all have the same width/height in the same panel. Obviously, separate HTTP requests per button.
This would help getting rid of the panel title bar.
Thank you !
provide options to choose if the button is centered, right or left
hello ,
it's possible to have a pop up to confirm the command ?
Thanks
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.