Antecedente
Deseo evaluar la disponibilidad de algunos recursos como imágenes y vídeos a través de peticiones fetch usando el verbo HEAD de la siguiente forma:
const sources = [
'https://imagen1.jpg',
'https://imagen2.jpg',
'https://imagen3.jpg',
]
const checkAvailability = async (url) => {
try {
console.log(url)
const res = await fetch(url, { method: 'HEAD', mode: 'no-cors' })
// { Validar estado de respuesta }
return true
} catch (err) {
return false
}
}
const checkUrls = (urls) => {
const promises = urls.map(async (url) => {
return await checkAvailability(url)
})
return promises
}
const checkSources = async (sources) => {
for await (available of checkUrls(sources)) {
console.log(available)
}
}
checkUrls(sources)
Problemática
En caso tal de que el recurso no este disponible, obtendré una respuesta con un status 404, el cual no es bien manejado por mi bloque try catch, entiendo bien que fetch solo rechaza la petición interna que realiza en caso de un error de red, sin embargo no logro manejar correctamente la respuesta obtenida, esto debido a que muchos de los recursos se encuentran alojados en servidores que no tienen habilitado CORS, y por eso lo máximo que obtengo es una respuesta opaca.
Agradezco de antemano si alguien me pudiera ofrecer una solución.
fetch
falla únicamente cuando hay un error de red, en cambio, los errores como404, 500
y otros, son considerados exitosos desde el punto de vista defetch. Se puede evaluar por tanto
status` con algo así:if (response.status !== 200) { //hacer que la promesa sea rechzada
haciendo que la promesa sea rechazada. Puedes ver también este hilo de github con varias propuestas de manejadores de error completos.console.log(res);
no encuentras allí elementos que informen sobre el tipo de error que vino del servidor? ¿El código de servidor es responsabilidad tuya? De ser así, podrías también trabajar del lado del servidor, para determinar el tipo de respuesta y devolverlo a la petición que haces confetch
opaque
se deben a que estás usando elmode: 'no-cors'
, por tanto, a no ser que cambies amode: 'cors'
o que no pongas nada (valor por defecto), no podrás obtener datos de la respuesta. La especificación dice que las respuestas opacas no traen datos, son severamente restrictivas. Si estás obligado a usarno-cors
, entonces no te quedará otra que trabajar el código del servidor, verificar lo que ocurre en él y devolver un contenido adecuado.