Axios: En algún momento, response.data es una cadena en lugar de un objeto

Creado en 13 ago. 2018  ·  43Comentarios  ·  Fuente: axios/axios

No sé por qué, pero con la misma api, en algún momento la respuesta de axios.data es una cadena en lugar de un objeto. Vea la siguiente figura.

image

Contexto

  • versión de axios: 0.18.0
  • Entorno: React Native Expo SDK 29, ventana 10

Comentario más útil

Descubrí que esto sucede cuando la respuesta json del servidor no es válida, use un validador json como https://jsonlint.com/ para asegurarse de que su json esté formateado correctamente

Todos 43 comentarios

@ huy-lv,

¿El content-type el mismo para ambas respuestas?

@robmcguinness Sí, es aplicación / json

Veo el mismo comportamiento. Descubrí que, en mi caso, la respuesta de la API a veces contenía datos JSON no válidos, es decir, JSON.parse arrojaría. Por alguna razón, Axios parece tragarse este error y termina configurando la cadena JSON no válida en la propiedad data .

Yo también tengo este problema. Cuando verifico response.data del caso problemático, se agregaron datos JSON no válidos como " a la respuesta, lo que hace que JSON.parse tenga un error y devuelva una cadena.

Lo he comprobado con Axios, XMLHttpRequest, fetch
1. / Axios y XMLHttpRequest tienen el mismo problema
2. / buscar funciona perfectamente

Sé que hay algunos caracteres que pueden provocar ese problema, solo necesito estar seguro.
¿Podría capturar la respuesta y adjuntarla como archivo?

@OpenGG lo siento por la respuesta tardía, lo que necesita aquí: D
https://1drv.ms/t/s!AnakDtCf8CG5hIgn2Hemy6zanFi50Q

@ huy-lv No es lo que esperaba. Guarde la respuesta con curl, luego adjunte el archivo guardado colocándolo en el área de respuesta de este problema.

@ huy-lv

No importa, lo encontré.
Lo pegué en la esencia e intenté cargar con axios, no puedo ver ningún error.

archivo: https://gist.github.com/OpenGG/ac72e79f9ef088e993213473116c0cd0
demostración: https://codepen.io/OpenGG/pen/bxEqKL

Lo sé, este problema no ocurre todo el tiempo, es aproximadamente 1-2 veces cada 10 solicitudes (la misma API, la misma respuesta)

@OpenGG sucede en React-Native. La aplicación web funciona perfectamente.

@ nighttiger1990

¿Podrías hacer una demostración en línea sobre la expo y compartirla? Esta demostración debe realizar la misma solicitud con Axios y XMLHttpRequest, para determinar si Axios o RN causan este problema.

@OpenGG ¿puedes darme tu correo? Te enviaré una API, no puedo
https://github.com/nighttiger1990/axiosBug.git

¿Tuviste suerte con este problema? Yo también lo estoy enfrentando

@Druthi ahora estoy usando 'buscar' en lugar de 'axios'

¿cualquier actualización?

Puede que este no sea tu caso, pero en mi caso:
Mi cadena de respuesta de API no es JSON válido, por lo que axios no puede analizar a JSON, luego devuelve una cadena sin procesar.

He migrado mi aplicación (redux-saga, axios) a webpack4 y ahora response.data es una cadena en lugar de un objeto. Los cambios de migración que hice son mínimos para compilar con éxito
package.json
"paquete web": "^ 4.29.6",
"webpack-cli": "^ 3.3.0",
"webpack-dev-middleware": "^ 3.6.1",
"webpack-dev-server": "^ 3.2.1"
"file-loader": "^ 3.0.1",

webpack-config.js
modo agregado: 'desarrollo', a module.exports
colores comentados: verdadero, en devServer
comentó json-loader

Ejecuté JSON.parse (response.data) y el JSON está dañado. (Token inesperado: en JSON en la posición 8181)

            "municipality": "ddrNote": ""      should be

            "municipality": "",
            "addrNote": ""

Comparé con mi código webpack3 previo a la migración donde el JSON en response.data está bien (objeto). Entonces, el código migrado está logrando corromper el JSON en response.data y es por eso que aparece como una cadena. Entonces ahora la pregunta es por qué el JSON está dañado

Resolví el problema degradando a "webpack-dev-server": "3.1.10"

Tengo un proxy devServer que supongo que es la causa de la corrupción de respuesta para versiones superiores a 3.1.10

@petercutting también es un problema en el entorno de producción, ¿no lo has observado?

@nyilmaz, mi problema resultó ser causado por webpack-dev-server. webpack-dev-server no se utilizaría en un entorno de producción

@petercutting, ¿

@goodmorninggoaway No lo recuerdo. Probablemente no

Independientemente de los problemas de webpack-dev-server, Axios no debería tragarse silenciosamente las excepciones JSON.parse , ¿verdad?

Solo estaba probando la solidez de una aplicación enviando JSON con formato incorrecto desde el backend. La solicitud de Axios falla silenciosamente al decodificar el JSON. El encabezado content-type todavía dice "application/json" , pero response.data es la cadena sin analizar y mi aplicación se bloquea inesperadamente como seguimiento.

Es bastante loco que una biblioteca con 60k estrellas tenga un error tan básico durante medio año: confuso:

Independientemente de los problemas de webpack-dev-server, Axios no debería tragarse silenciosamente las excepciones JSON.parse, ¿verdad?

Parfectamente válido

¿Alguna actualización sobre este error para reaccionar nativo?

Descubrí que esto sucede cuando la respuesta json del servidor no es válida, use un validador json como https://jsonlint.com/ para asegurarse de que su json esté formateado correctamente

Se está rastreando el problema de deglución de errores, cerraré este problema ya que es esencialmente un duplicado.

Comuníquese con nosotros si tiene alguna pregunta.

@ fed135, por favor vincule el problema relevante si lo hay, gracias.

¿Alguien resolvió esto todavía? Estoy usando laravel como mi API, así que registré mi respuesta antes de enviarla a mi aplicación. La respuesta registrada es un JSON válido, pero a la respuesta recibida le falta la última llave "}" al final, lo que la convierte en una respuesta no válida. No sé por qué esto se está comportando así en mi aplicación móvil, porque para la aplicación de interfaz que usa axios también funciona bien, también lo probé en cartero, funciona bien. ¿Alguna idea o solución por favor?

Sucede cuando los datos se vuelven demasiado grandes :( ¡No tuve ningún problema ya que la matriz de datos era pequeña!

@matinzd Paginé mis datos y solo devuelvo 20

@matinzd y también, mi aplicación fronend usa el mismo punto final, y no experimenta eso, solo la aplicación móvil con react native lo hace a veces

@ fed135 ¿Es este el tema correcto para realizar un seguimiento como seguimiento? # 61

por favor, mi api de laravel sale como una cadena junto a

Finalmente encontré una solución para la mía.
Los datos que estaba obteniendo eran ===

Yo tengo el mismo error
:(

Tengo el mismo problema, después de verificar en jsonlint.com, tengo los datos con NaN que json no puede analizar como se muestra a continuación. Por lo tanto, debemos asegurarnos de que nuestro backend envió los datos JSON válidos.

Error: Parse error on line 186:
...,    "position_name": NaN,   "group_name": 
----------------------^
Expecting 'STRING', 'NUMBER', 'NULL', 'TRUE', 'FALSE', '{', '[', got 'undefined'

Mismo error, quién puede solucionarlo: |

☝️ Hice un PR rápido para abordar este problema. Ojalá te ayude

Obtener este problema en react-native con axios 0.19.2
¿Alguna novedad en este asunto?

Tengo este mismo problema, resolví este problema.Hice un cambio en el método de axios, si tenía el método 'GET', no puede enviar el cuerpo porque puede obtener este problema, para resolverlo, debe cambiar a 'POST' y lo hará estar trabajando

¿Fue útil esta página
0 / 5 - 0 calificaciones