CSP blocks blob: in frame-src

Solved
Highlighted
Shopify Partner
31 1 11

Our app uses an EASDK title bar button/action to export a CSV file. This works in Chromium (somehow), but under Firefox it's getting blocked by the CSP because frame-src does not list blob:*. I have not tested in other browsers.

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1041 140 170

Hey @kelseyjudson,

 

Are you able to share app information via reply or DM?

Notice; Out of office, replies will be delayed until my return. Thanks!
0 Likes
Highlighted
Shopify Partner
31 1 11
Hey @SBD_. Certainly, what information did you need? The app is Redirectify.
0 Likes
Highlighted
Shopify Partner
31 1 11

@SBD_ Any update on this?

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1041 140 170

Thanks @kelseyjudson, I'm able to replicate. Not sure there's much we can do on the EASDK side of things - are you able to generate the file on the server side (instead of a blob client-side)?

Notice; Out of office, replies will be delayed until my return. Thanks!
0 Likes
Highlighted
Shopify Partner
31 1 11

@SBD_, It's certainly possible, but the file is based on the data in the currently filtered list on the client, so either I'd have to send the current list state (filters, etc.) to the server for it all to be reproduced just to be downloaded, or worse send the whole list to the server to then send back to the client. It's not possible at all just to change the CSP header to include blob?

0 Likes
Highlighted
Shopify Staff
Shopify Staff
1041 140 170

This is an accepted solution.

@kelseyjudson relaxing the CSP was discussed recently, and decided against. More info in this thread.

Notice; Out of office, replies will be delayed until my return. Thanks!
0 Likes
Highlighted
Shopify Partner
31 1 11

Thanks @SBD_. That's a shame, but I'll see if the iframe workaround Alex mentioned in that thread helps.

0 Likes
Highlighted
Shopify Partner
31 1 11

Just confirming that this works. In case it helps anyone in the future, you need to append the iframe to the document in order for it to load, and then place the code you'd otherwise use outside the iframe within an event listener for the iframe's 'load' event. Something like this:

let iframe = document.createElement('iframe');
document.body.append(iframe); // iframe won't load unless appended
iframe.style.display = 'none';
iframe.addEventListener('load', () => {
let link = iframe.contentDocument.createElement('a');
link.download = ...
link.href = ... link.click(); });
0 Likes
Highlighted
Shopify Staff
Shopify Staff
1041 140 170

Nice one. Thanks for the update!

Notice; Out of office, replies will be delayed until my return. Thanks!
0 Likes