GetStream/stream-chat-react

Apply crossorigin to all CDN downloads

zachwhelchel opened this issue · 5 comments

The codebase I'm using requires the Cross-Origin-Embedder-Policy to be set to require-corp or credentialless in order to support SharedArrayBuffer for security reasons. Most of Stream Chat UI still works but all the image thumbnails fail to load. If I add my own img element I can set crossorigin=anonymous on it. That makes the images load. But I'm not sure how to do this inside all the components individually. The image preview, the full screen image gallery, the GIF preview, etc etc. Is there a way to turn this on for all img tags within Stream's Chat UI?

Hey @zachwhelchel have you tried to override the BaseImage component via the Channel props?

Hi @zachwhelchel, to add to the suggestion above, if you're fine with Cross-Origin-Embedder-Policy: credentialless, you shouldn't need any additional attributes on the images - so this might be an easier option.

@MartinCupela @myandrienko overriding the BaseImage hasn't worked for me. And Cross-Origin-Embedder-Policy: credentialless didn't change the need to have the anonymous tag for me. I ended up editing the source code to include crossorigin=anonymous and I have to remember to do that everytime before compiling to release a new version. Would love to have this as an option I can set so I don't have to edit the source code.

@zachwhelchel can you share the info how you have overridden the BaseImage? If BaseImage is rendered in all the places and you provide your own implementation, where you render img element to you liking, why did you need to change the source?