Cuando ejecuté los siguientes códigos para recuperar datos (formato .json) almacenados en mi depósito público de GCS, algo salió mal.

async function getData() {
  const carsDataReq = await fetch(...);
  const carsData = await carsDataReq.json();  
  const cleaned = carsData.map(car => ({
    mpg: car.Miles_per_Gallon,
    horsepower: car.Horsepower,
  }))
  .filter(car => (car.mpg != null && car.horsepower != null));
  console.log(cleaned);
  return cleaned;
}

El mensaje de error tiene el siguiente aspecto:

Access to fetch at '...' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Intenté configurar CORS del depósito mediante el siguiente archivo .json:

[                                                                                                                     
    {
      "origin": ["*"],
      "responseHeader": ["Content-Type"],
      "method": ["GET", "HEAD", "DELETE"],
      "maxAgeSeconds": 86400
    }
 ]

Pero el error siguió apareciendo. ¿Como arreglarlo?

2
jabberwoo 16 oct. 2019 a las 17:33

1 respuesta

La mejor respuesta

Publicar mi comentario como respuesta para dar visibilidad a otros usuarios.

ERROR

El acceso para buscar en '...' desde el origen 'nulo' ha sido bloqueado por la política de CORS: No hay un encabezado 'Access-Control-Allow-Origin' presente en el recurso solicitado. Si una respuesta opaca satisface sus necesidades, configure el modo de la solicitud en 'no-cors' para obtener el recurso con CORS deshabilitado.

Esto significa que el servidor que aloja el recurso debe tener CORS habilitado. Lo que puede hacer en el lado del cliente es establecer el modo de recuperación en CORS.

fetch(request, {mode: 'cors'});

Créditos a esta publicación por toda la información proporcionada. Compruébelo para obtener más detalles.

2
tzovourn 18 oct. 2019 a las 09:39