Viewing the Response of an HTTP Query

Hello,

I have an API. I can send a query and get a response with Postman. But I can’t view it in Grafana. An example query is in the image below. I tried Ajax, Data Manipulation plugins but I couldn’t. How can I do this? How can I view the response from the server?

Grafana version 8.5.13

Welcome

I would try the infinity plugin. Are you sending any authentication?
Also please post a sample data returned (obfuscated)?

Hello,
I do not need any authentication information.

For example;
I’m designing a button with the Data Manipulation plugin. If I write the name of the country, I want to show the page about that country.

If Barbados writes in the box:
https://api.covid19api.com/country/Barbados

If Madagascar writes in the box:
https://api.covid19api.com/country/Madagascar

show the contents of the addresses. I am aware that these links contain json content. However, there are only a few lines of sentences on my page.

1 Like

@omeravci You should be able to view the response in the Developer Console → Network.

You can do console.log(response) for the Data Manipulation plugin to display it in the Developer’s Console. Take a look at the README: GitHub - VolkovLabs/volkovlabs-form-panel: Data Manipulation Panel plugin for @grafana.

Let me know if you are able to see it.

Something like this?

I did a few tries. I sent a request to my own django application. I see HTTP 200 response on Django side. However, I want to see the text written on the page in Grafana, not in the Developer’s Console. For example, there is the text “test message” on the page. But I can’t view it in Grafana.

Actually the result might look like this but I will send the country name via a button. I will write the country name in a box. I will click the button and the button will add the country in the box to the link and send a query.

1 Like

@omeravci This is strange that response is undefined, when you can see HTTP 200 response.

Looking at your Custom Code, you supposed to see response in the Browser’s Console, do you see anything or it’s undefined as well?

Hi, I have a sample application with Django. When I click the button;
On the django side the result looks like this:
image

On the browser side it looks like this:

My plugin interface is like this:

Hello,

Anyone have any ideas?

@omeravci, What do you see in the “Preview” section of the request?

Also, I would recommend using the Custom Code (GitHub - VolkovLabs/volkovlabs-form-panel: Data Manipulation Panel for @grafana.), where you will have more control over the request to troubleshoot the issue and then switch to POST requests if it works.

I’m getting a “Request TypeError: Failed to fetch” error in the preview section. However, I found that I have a CORS problem.

Access to fetch at ‘http://192.xxx.xx.xx/’ from origin ‘http://192.xxx.xx.xx’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

I couldn’t do what I wanted. As I mentioned above; I am designing a textbox.
If I type Barbados and click the submit button,
I want it to send a GET query to the link https://api.covid19api.com/country/Barbados.

If I type Madagascar and click the submit button;
I want it to send a GET query to https://api.covid19api.com/country/Madagascar.

Finally, I want to view the response from this page. Are these impossible?

1 Like

@omeravci It’s possible. Here is an example of how to do it with custom code:

Regarding CORS, here is the article explaining multiple ways to use API from the browser:

Hi @omeravci,

Did you finally found the way to do what you want with Data Manipulation Plugin, or with any other plugin?

I’m trying to design a panel with something like this, that sounds similar in some way to your needs:
A button to do a GET API call to https://www.virustotal.com/api/v3/ip_addresses/{ip}, to get a security report of an IP address, to know if it is malicious or not.
I don’t want to use the Initial Request GET of Data Manipulation Plugin when I open the dashboard, and only want to actually do the API call to Virustotal only if the analyst that is reviewing the incident decide that wants more information about the public IP address and press the button, because I’m using the free option of Virustotal, with a fixed number of API calls by day.
After the user press the button, I need to get the JSON API Response that contain the information about that IP in some way to show it, maybe not all the fields, only some fields of interest.

I can for example design something “from outside”, using NodeRED, so when I press the button on Grafana, that button call a NodeRED workflow, the NodeRED workflow do “all the magic”, and insert the results about the IP in a database, like PostgreSQL or MySQL, and after that I can have a table on Grafana with a query to that DB (I need to know how to update that table automatically or after a few seconds after I press the button…), but the idea is to do all with Grafana, not using “outside” options.

Any piece of advice for me after your experience trying to design your use case?

Thanks in advance.
Regards,
Alejandro

Maybe thie thread might help

Then create a dashboard variable where user can enter ip address?

Hi @yosiasz, thanks for your answer!

The problem with your idea is that what I need is to show in a table of the dashboard the obtained information from the JSON http response, which is obtained in this case from the GET to API call that I do when I press the button.

Thanks.
Regards,
Alejandro

What I described above “should” do it. The button cals your api with ip address entered by user.

The presentation in table is even easier, just select the table visualization

Hi @yosiasz

Maybe I’m not being clear trying to share my idea, because english is not my native language, :frowning:

What is happening to my with my idea is the same that is happening to @ftasso here in this github post, from a button panel plugin:

At the end, what I need is to get the REST call result, and the available button plugins that I reviewed only “execute” the API call, with an HTTP answer (200, 404, etc.), but not get back to you with the “JSON answer”. I even don’t know how to, as an alternative, in Grafana, insert that answer in a MySQL/PostgreSQL DB for example (after that I can do what you are suggesting, show that information in a table). I can do something like that, but using NodeRED from “outside”, creating an automation workflow, but what I’m asking if it is possible to do it without any additional software (NodeRED, a DB), only pressing the button to call the API, and show the obtained information in some way, probable a table, maybe hiding some data returned that is not important.

Thanks again for your answer, and sorry for the long explanation.

Regards,
Alejandro

1 Like

Created a mock virusTotal node rest api locally (replace it to your specific virustotal api endpoint)

Returns

Setup in grafana to fetch from that local restt api (replace it to your specific virustotal api endpoint)

Hi @yosiasz,

I did the same as you, using Infinity Plugin too, but in my case I used Apache APISIX “in the middle”, an API Gateway, so I have API Cache to not do so many calls to the original Virustotal API if somebody already did the call before for the same IP.

The problem is that I cannot do that procedure from “pressing a button” in the dashboard, with the available plugins that we have (Button Panel plugin for Grafana | Grafana Labs and Button Panel plugin for Grafana | Grafana Labs), because both of them don’t “answer” you the JSON fields obtained in the HTTP response, only the HTTP code of the response (200, 404, etc.), and the only way to do it with a value that you provide, is the way that you are using, completing the IP in a box using a variable.

The main idea of my use case is use a button plugin or something really similar to do the API call and obtain the results.

Thanks again for all the time that you are using to help me with this.

Regards,
Alejandro