Error CORS en Google Cloud Storage

Cómo solventar el error de CORS en Google Cloud Storage.

Permisos del bucket y objetos

Antes de nada revisa que el bucket y el/los fichero/s que quieres acceder son públicos. Para ello en el bucket y objetos tienes que indicar el permiso de “allUsers” y darle permisos de lectura.

Te tendrá que aparecer en el Google Cloud storage algo como lo siguiente:

Ejecutar gsutil para establecer permisos de CORS

Después tienes que ejecutar un comando de gsutil al que le tendrás que pasar un fichero de configuración. Lo primero crea el fichero y guarda la configuración que necesites.

Crea el fichero:
[code]
vim cors-json-file.json
[/code]

Establece la configuración:
Nota: reemplaza el dominio por el que necesites en tu caso.
[code]
[
{
"origin": [
"https://*.pedroventura.com"
],
"responseHeader": [
"Content-Type"
],
"method": [
"GET"
],
"maxAgeSeconds": 3600
}
]
[/code]

Por último ejecuta el siguiente comando para setear la configuración de CORS sobre tu bucket.
NOTA: cambia “blogpv” por el nombre de tu bucket:

[code]
gsutil cors set cors-json-file.json gs://blogpv
[/code]

Te tendrá que aparecer un mensaje por consola

Puedes ejecutar la siguiente función JS desde la consola de Chrome para validar que recibes bien el objeto desde Google Cloud Storage y que te funciona finalmente ya no tienes errores por las CORS.
[code]
fetch(‘https://storage.googleapis.com/blogpv/sample.json’)
.then(response => response.json())
.then(json => console.log(json))
[/code]

Puedes revisar la documentación de Google Cloud Storage y CORS en el siguiente enlace: https://cloud.google.com/storage/docs/configuring-cors#configure-cors-gsutil