google model viewer CORS error while applying textures from url

Question

i am working with google model vieweer in react, i have a model where i want to apply textures to the materials from a image url which is stored on AWS S3 bucket. model with textures to apply

const material = modelViewerTexture1?.model?.materials[0]

const createAndApplyTexture = async (channel) => {
        
const texture = await modelViewerTexture1?.createTexture(jacket)
                    
    if (channel.includes('base') || channel.includes('metallic')) {                                  
         material?.pbrMetallicRoughness[channel].setTexture(texture)
    } else {        
             material[channel].setTexture(texture)
    }
}

createAndApplyTexture('baseColorTexture')

the variable jacket contains the url string.

cors setting are also set to public on AWS

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET",
            "HEAD"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [],
        "MaxAgeSeconds": 3000
    }
]

still geting CORS error cors error