Backend-plugin resource handler strips out connection headers

vaduga · January 13, 2024, 3:29am

Following this showcase How to add a resource handler for your data source - #3 by mefraimsson and App with backend plugin example grafana-plugin-examples/examples/app-with-backend at main · grafana/grafana-plugin-examples · GitHub
I encountered a problem with CallResource function receiving request object with stripped out Connection: ‘upgrade’ headers. And if I add these headers manually in the handler function it throws error that theres no http.hijacker.

I want to run my own simple webrtc signaling websocket server at one of the resource handlers urls, for example at /api/plugins/my-app/resources/ws .
I do succeed running separate goroutine with http.ListenAndServe at custom port with my websocket handler, but I guess it would better to use api resource handler for my app plugin.

Could someone please point me to a Grafana sourcecode where and why it strips connection headers for resource handlers and advice if it is technically possible to open custom websocket connections (other than grafana live) for my app plugin resource handlers?

mefraimsson · January 17, 2024, 1:27pm

I’m not sure you can use call resource to proxy a websocket connection/not supported due to not supported here grafana/pkg/plugins/manager/client/client.go at a103be2285710f8c1c2dac470595336f816da9ff · grafana/grafana · GitHub. Not sure we want to support it either given that there are multiple alternatives.

What you can do if you don’t want to use Grafana live streaming, is to use the datasource proxy. Then you’ll need to convert proxy url to ws:// scheme, examples

github.com

grafana/grafana/blob/a103be2285710f8c1c2dac470595336f816da9ff/public/app/plugins/datasource/loki/datasource.ts#L400


      
           * Used within the `runLiveQuery` to create a live target for a Loki query.
           * @returns A LokiLiveTarget object containing the necessary information for a live query.
           */
          private createLiveTarget(target: LokiQuery, maxDataPoints: number): LokiLiveTarget {
            const query = target.expr;
            const baseUrl = this.instanceSettings.url;
            const params = urlUtil.serializeParams({ query });
          
            return {
              query,
              url: convertToWebSocketUrl(`${baseUrl}/loki/api/v1/tail?${params}`),
              refId: target.refId,
              size: maxDataPoints,
            };
          }
          
          /**
           * Runs live queries, which involves creating a WebSocket connection to listen for new logs.
           * It returns a slightly different DataQueryResponse compared to runQueries. It provides a single DataFrame
           * even if there are multiple Loki streams. Common labels are set on dataFrame.labels, and unique labels per row are
           * available in dataFrame.fields.labels.

github.com

grafana/grafana/blob/a103be2285710f8c1c2dac470595336f816da9ff/public/app/plugins/datasource/loki/streaming.ts#L90


      
                      return {
                        data: frame ? [frame] : [],
                        state: LoadingState.Streaming,
                      };
                    })
                  );
              })
            );
          }
          
          export const convertToWebSocketUrl = (url: string) => {
            const protocol = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
            let backend = `${protocol}${window.location.host}${config.appSubUrl}`;
            if (backend.endsWith('/')) {
              backend = backend.slice(0, -1);
            }
            return `${backend}${url}`;
          };

Then you can use that url to connect to websocket over Grafana’s datasource proxy.

We’re planning to improve documentation around this Docs: Document how to connect over websocket thru datasource proxy · Issue #46798 · grafana/grafana · GitHub

vaduga · January 17, 2024, 1:41pm

Thanks a lot! Was hoping for your response on that

system · January 16, 2025, 1:42pm

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.

Topic		Replies	Views
How to add a resource handler for your data source Share & showcase	7	4070	August 14, 2022
Backend resource plugin - debugging for callResourceHandler "Plugin not registered" Grafana Plugin Development plugins	1	1490	October 15, 2020
Grafana backend server proxy Grafana Plugin Development	5	2380	March 13, 2023
How to use Data Proxy for custom datasource locally Grafana Plugin Development	1	1980	January 12, 2021
Grafana custom datasource - CORS and proxy Grafana Plugin Development	10	3953	March 23, 2023

Backend-plugin resource handler strips out connection headers

Related topics