XSS when using dataFormat function

michaelrodov commented 5 years ago

Hi When using dataFormat function and not converting the value to react component output is not sanitised. Therefore you can easily run XSS through it.

const Demo = props => {
  let data = [
    {key: "1", value: "test"},
    {key: "2", value: '/1337"><noscript><p title="</noscript><img src=x onerror=alert`openbugbounty`>">'}
  ]
  return (
      <BootstrapTable data={data}>
        <TableHeaderColumn dataField="key" isKey />
        <TableHeaderColumn dataField="value" dataFormat={v => v} />
      </BootstrapTable>
  );
};

Example: https://codesandbox.io/s/q7oj2v6xo9?fontsize=14

oeph commented 3 years ago

It is caused by https://github.com/AllenFang/react-bootstrap-table/blob/26d07defab759e4f9bce22d1d568690830b8d9d7/src/TableBody.js#L114-L118

If you return a invalid react element, it will use dangerouslySetInnerHTML. Your fix could be to use the following dataFormat: dataFormat={v => (<span>{v}</span>)}

eborden commented 2 years ago

There is now a CVE pointing at this issue. Are there plans to fix this XSS exploit?

https://github.com/advisories/GHSA-2589-w6xf-983r

AllenFang / react-bootstrap-table

XSS when using dataFormat function #2071