0
338
Vistasresponse.json () arroja "Error de tipo: no se pudo obtener"
Uso buscar para obtener algunos recursos del servidor. Puedo ver en los registros que, de vez en cuando, la conversión a JSON falla en "TypeError: Failed to fetch" , lo cual es muy interesante porque este tipo de error solo debería ocurrir cuando falla la solicitud.
El código simplificado que uso:
const response = await fetch('https://something.com/api') try { await response.json() // -> throws TypeError: Failed to fetch in chrome/safari and throws AbortError in Firefox } catch(error) { console.log('error happened', error); } Realmente no puedo encontrar el caso cuando podría suceder. Probé casos posibles y todos fallaron en la primera línea de código, es decir, fetch('https:/something.com/api') . No tengo idea de cuándo podría suceder esto. También debo mencionar que sucede en navegadores modernos como Chrome 99. Por lo tanto, definitivamente no es algo como Internet Explorer.
Encontré este ejemplo útil y muestra que las solicitudes se cancelan cuando descarga el documento. Obviamente, la cancelación ocurre en la línea de fetch , pero decidí dejar de registrar estos errores cuando el documento se descarga/oculta. Incluso cuando estos casos no están registrados, puedo ver que también sucede en documentos visibles.
https://github.com/shuding/request-cancellation-test
Casos probados:
- Error de red: usuario desconectado de Internet
- CORS: encabezados CORS faltantes
Obviamente, esto no prueba nada, pero las personas en los comentarios piensan que hice algo mal en la implementación y no confían en mí cuando digo que sí sucede al convertir a json. Esta es la información que puedo registrar cuando detecto el error. La mayoría de las propiedades son del objeto Response .
Este es el registro capturado del visitante usando Chrome 100. Firefox no lanza TypeError sino que lanza AbortError pero también sucede cuando se convierte a json. 
2 Respuestas
Responde la pregunta0
Esto parece un error de red que ocurrió después de que ya se recibieron los encabezados HTTP de respuesta. En tal situación, el método de fetch devuelve el éxito, pero los intentos posteriores de acceder al cuerpo de la respuesta pueden fallar.
Me las arreglé para activar este tipo de error con este servidor simple:
#!/usr/bin/env python3 import http.server import time class Handler(http.server.BaseHTTPRequestHandler): def do_GET(self): if self.path == '/': self.wfile.write(b'HTTP/1.0 200 OK\r\n') self.wfile.write(b'Content-type: text/html\r\n') self.wfile.write(b'\r\n') self.wfile.write(b"""\ <script type="module"> const f = await fetch("/j"); try { await f.json(); } catch (e) { alert(e); } </script> """) return self.wfile.write(b'HTTP/1.0 200 OK\r\n') self.wfile.write(b'Content-encoding: gzip\r\n') # bogus self.wfile.write(b'Content-type: application/json\r\n') self.wfile.write(b'\r\n') self.wfile.write(b'[]') server = http.server.HTTPServer(('127.0.0.1', 31337), Handler) server.serve_forever() Introduce un error de trama deliberado al servir la respuesta JSON; los encabezados indican que se emplea compresión gzip, pero en realidad no se usa compresión. Cuando abro http://127.0.0.1:31337/ en Chromium 100.0.4896.127, muestra la siguiente alerta:
TypeError: no se pudo obtener
Firefox ESR 91.8.0 muestra un poco más útil:
TypeError: la decodificación falló.
El error de encuadre particular demostrado anteriormente es bastante artificial, y dudo que sea exactamente el tipo que experimentó el autor de la pregunta. Pero el hecho de que apareciera en medio del cuerpo de respuesta probablemente sea el núcleo del problema descrito.
El par específico de tipos de error de la pregunta se puede activar modificando el servidor de la siguiente manera:
self.wfile.write(b'HTTP/1.1 200 OK\r\n') self.wfile.write(b'Content-type: application/json\r\n') # sic: larger than the actual body length self.wfile.write(b'Content-length: 2\r\n') self.wfile.write(b'\r\n') self.wfile.write(b'[')Esto muestra la misma alerta:
TypeError: no se pudo obtener
en Chromium (misma versión), y
AbortError: La operación fue abortada.
en Firefox (también lo mismo).
Como tal, una causa probable sería una conexión escamosa caída en medio de la recepción del cuerpo. Los errores de los navegadores no se detallan particularmente aquí (ya veces son francamente engañosos), por lo que nos resignamos a especular, pero esta parece ser la mejor suposición.
0
Su error de esta línea:
const response = await fetch('https://something.com/api') Eliminé await response.json() para probar, el error aún existe.
Mire la pestaña de la consola en DevTool, asegúrese de usar esta configuración 
Estos son 2 errores de ejemplo Failed to fetch :
(async () => { try { const response = await fetch('http://my-api.com/example') await response.json() } catch (e) { console.log('e') console.log(e) } })() 
