[data grid] Excel export is broken due to `eval` with `self` `content-security-policy`

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!

https://mui.com/x/

4.38k stars 1.3k forks source link

[data grid] Excel export is broken due to `eval` with `self` `content-security-policy` #11153

Open OlgaKush512 opened 11 months ago

OlgaKush512 commented 11 months ago

Steps to reproduce

Link to live example: https://stackblitz.com/edit/react-wiwppv?file=index.html

Steps: 1.set content-security-policy header to include script-src: "'self'". Exemple:

try to download Excel

Current behavior

Message of error : Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' ".

Impossible to download.

Expected behavior

Downloading a file excel

Context

No response

Your environment

System: OS: macOS 13.3.1 Binaries: Node: 18.17.0 - ~/.nvm/versions/node/v18.17.0/bin/node Yarn: Not Found npm: 9.6.7 - ~/.nvm/versions/node/v18.17.0/bin/npm Browsers: Chrome: 119.0.6045.159 Edge: Not Found Safari: 16.4 npmPackages: typescript: 5.2.2 => 5.2.2

Search keywords: export excel datagrid csp

cherniavskii commented 11 months ago

@romgrk Can you take a look at this one?

romgrk commented 11 months ago

It might be a stackblitz specific error I think? The same code works fine on codesandbox, and our eval checks are wrapped in try.

@OlgaKush512 Can you confirm this is really related to excel export? I see the error in stackblitz right as the frame loads. Can you also confirm if you experience this error in any other situation, like a production build?

This might need to be reported to stackblitz.

OlgaKush512 commented 11 months ago

Hello! Thank you for responding so quickly.

This error originated on our platform, and it specifically occurs in the production environment. I wrote approximate code to reproduce this error. And yes, on our company's website, we use a datagrid for exporting to Excel. The error occurs in two places: 1) when we try to use the export button in the toolbar 2) when we separately use the exportDataAsExcel() function.

In other words, when I attempt to use the export feature on our website, an exception is thrown with this error, and we are unable to download the file.

romgrk commented 11 months ago

Can you clarify the reproduction steps? Can you also provide stacktraces for the error that you're getting in production?

I've inspected the origin of the error in stackblitz, it doesn't seem to be datagrid code:

OlgaKush512 commented 11 months ago

Hello! As mentioned earlier, this is an issue on our platform, not just on StackBlitz.

When exporting Excel, we use the function exportDataAsExcel(), and as a result, we encounter an error.

Capture d’écran 2023-11-27 à 11 53 34

OlgaKush512 commented 11 months ago

Also, in the place where we use export through the toolbar, we encounter the same error. Capture d’écran 2023-11-27 à 13 47 36

romgrk commented 11 months ago

So it seems like this is an eval inside ExcelJS: https://github.com/exceljs/exceljs/issues/713

@cherniavskii I haven't looked at the export code yet, do you think we could use the bare version of ExcelJS as suggested in the issue above?

cherniavskii commented 11 months ago

I've added a comment in the related exceljs issue https://github.com/exceljs/exceljs/issues/713#issuecomment-1828759610 If using the bare version of exceljs works as a workaround - great, but the ultimate fix should be done on the exceljs side. I'll try to open an issue in exceljs with a proposal for issue resolution later.