Using Cross-Origin-Embedder-Policy: require-corp to Load Images from Firebase Storage

Question

To use SharedArrayBuffer on Chrome, Firefox, and other browsers, I've followed the instructions in this Mozilla document, it mentions that setting require-corp on the Cross-Origin-Embedder-Policy header is necessary because credentialless doesn't work for Firefox.

But after using require-corp, I was not able to load any image from Firebase Storage because of this error:

net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200

I'm working with Vue.js and have attempted to configure CORS using the following settings:

[
    {
      "origin": ["*"],
      "method": ["GET"],
      "maxAgeSeconds": 3600
    }
  ]

I'm looking for a way to make it work with both SharedArrayBuffer and allow images to be loaded from Firebase Storage without having to add crossorigin="anonymous" to any <img> tag.

Here is an example image

Here is my headers:

'Cross-Origin-Embedder-Policy': 'require-corp',
'Cross-Origin-Resource-Policy': 'cross-origin'