JS code into Panel

I am interested in creating a panel that will allow me to write js code in it.
I tried to use Data Manipulation and dynamic text but it is not possible to add an import there.
Is there another plugin that can help me?

Which library are you trying to import.
Also what are you trying to solve

I would like to create a server request within my existing panel.
I am interested in grafana server requests to fish a request that will update me other existing panel.
I imported import axios from "axios"
And I got the error:
Uncaught (in promise) SyntaxError: Cannot use import statement outside a module
Is there another way to do this?

I succeeded

const axiosScript = document.createElement('script');
axiosScript.src = 'https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js';

and now I creating a example API request :

axiosScript.onload = function () {
  axios.interceptors.request.use(config => {
    config.auth = {
      username: 'user-name',
      password: 'password'
    return config;
    .then(response => {
    .catch(error => {

but I get error:

Access to XMLHttpRequest at 'http://user-name:pasword@host.docker.internal:3000/api/folders' 
from origin 'http://localhost:3000'  has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: 
No 'Access-Control-Allow-Origin' 
header is present on the requested resource.

someone can help me?


what do you get when you run

http://user-name:password@host.docker.internal:3000/api/folders using curl

how can I using with curl into pannel ?
what did you mean?
Thank you for responding.

I understood what Curl is, should I make a curl request instead of a url?
is there a way to make a curl request from panel? in JS? how?
what between Curl and url?
Thank you

What do you get when you run this?
curl http://user-name:password@host.docker.internal:3000/api/folders

@gitigershtenkoren Direct imports are not supported in the Dynamic Text panel. You can use external scripts instead as described in the documentation:

You can also use fetch instead of axios, which supported out of the box.

I believe you are confusing server and client side. host.docker.internal won’t work, because panel’s JS run on the client side, it’s not on the server side.

1 Like