Axios: Às vezes response.data é string em vez de objeto

Criado em 13 ago. 2018  ·  43Comentários  ·  Fonte: axios/axios

Não sei por que, mas com a mesma API, às vezes o response.data de axios é string em vez de objeto. Veja a figura abaixo.

image

Contexto

  • versão axios: 0.18.0
  • Ambiente: React nativo Expo SDK 29, janela 10

Comentários muito úteis

Descobri que isso acontece quando a resposta json do servidor é inválida, use um validador json como https://jsonlint.com/ para ter certeza de que seu json está formatado corretamente

Todos 43 comentários

@ huy-lv,

content-type o mesmo para ambas as respostas?

@robmcguinness Sim, é application / json

Eu vejo o mesmo comportamento. Descobri que, no meu caso, a resposta da API às vezes contém dados JSON inválidos, ou seja, JSON.parse lançaria. Por algum motivo, o Axios parece engolir esse erro e acaba configurando a string JSON inválida na propriedade data .

Eu também tenho esse problema. Quando eu verifico response.data da pasta de problemas, alguma string JSON inválida como " dados adicionados à resposta, que fazem JSON.parse obter erro e retornar string.

Eu verifiquei com Axios, XMLHttpRequest, fetch
1. / Axios e XMLHttpRequest tiveram o mesmo problema
2. / fetch funciona perfeitamente

Eu sei que existem alguns chars que podem levar a esse problema, só preciso ter certeza.
Você poderia capturar a resposta e anexá-la como um arquivo?

@OpenGG desculpe pela resposta tardia, o que você precisa aqui: D
https://1drv.ms/t/s!AnakDtCf8CG5hIgn2Hemy6zanFi50Q

@ huy-lv Não é o que estou esperando. Salve a resposta com curl e anexe o arquivo salvo soltando-o na área de resposta deste problema.

@ huy-lv

Não importa, encontrei.
Eu colei no gist e tentei carregar com axios, não consigo ver nenhum erro.

arquivo: https://gist.github.com/OpenGG/ac72e79f9ef088e993213473116c0cd0
demonstração: https://codepen.io/OpenGG/pen/bxEqKL

eu sei, esse problema não acontece o tempo todo, é cerca de 1-2 vezes a cada 10 solicitações (a mesma API, mesma resposta)

@OpenGG aconteceu no React-Native. O Web App funciona perfeitamente.

@ nighttiger1990

Você poderia fazer uma demonstração online na Expo e compartilhá-la? Esta demonstração deve fazer a mesma solicitação com Axios e XMLHttpRequest, para determinar se Axios ou RN causam esse problema.

@OpenGG você pode me dar seu e-mail, eu enviarei uma api para você, não posso publicar isso
https://github.com/nighttiger1990/axiosBug.git

Teve sorte com esse problema? Eu estou enfrentando isso também

@Druthi agora estou usando 'fetch' em vez de 'axios'

Qualquer atualização?

Este pode não ser o seu caso, mas no meu caso:
Minha string de resposta da API não é um JSON válido, portanto, axios não podem analisar para JSON e, em vez disso, ele retorna a string bruta.

Migrei meu aplicativo (redux-saga, axios) para webpack4 e agora response.data é uma string em vez de um objeto. As alterações de migração que fiz são mínimas para compilar com sucesso
package.json
"webpack": "^ 4.29.6",
"webpack-cli": "^ 3.3.0",
"webpack-dev-middleware": "^ 3.6.1",
"webpack-dev-server": "^ 3.2.1"
"carregador de arquivos": "^ 3.0.1",

webpack-config.js
modo adicionado: 'desenvolvimento', para module.exports
cores comentadas: true, in devServer
comentou json-loader

Executei JSON.parse (response.data) e o JSON está corrompido. (Token inesperado: em JSON na posição 8181)

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

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

Eu comparei com meu código webpack3 pré-migração em que o JSON em response.data está OK (objeto). Portanto, o código migrado está conseguindo corromper o JSON em response.data e é por isso que está aparecendo como uma string. Então agora a questão é por que o JSON está corrompido

Resolvi o problema fazendo o downgrade para "webpack-dev-server": "3.1.10"

Eu tenho um proxy devServer que acho que é a causa da corrupção de resposta para versões posteriores a 3.1.10

@petercutting também é um problema no ambiente de produção, você não observou?

@nyilmaz meu problema acabou sendo causado por webpack-dev-server. webpack-dev-server não seria usado em um ambiente de produção

@petercutting você abriu um problema no webpack-dev-server? Não consegui encontrar.

@goodmorninggoaway eu não me lembro. provavelmente não

Independentemente dos problemas do webpack-dev-server, o Axios não deve engolir silenciosamente JSON.parse exceções, certo?

Eu estava apenas testando a robustez de um aplicativo, enviando um JSON malformado do back-end. A solicitação do Axios falha silenciosamente ao decodificar o JSON. O cabeçalho content-type ainda diz "application/json" , mas response.data é a string não analisada e meu aplicativo trava inesperadamente como acompanhamento.

É uma loucura que uma biblioteca com 60 mil estrelas tenha um bug tão básico por meio ano: confused:

Independentemente dos problemas do webpack-dev-server, o Axios não deve engolir silenciosamente as exceções JSON.parse, certo?

Perfeitamente válido

Alguma atualização neste bug para react native !?

Descobri que isso acontece quando a resposta json do servidor é inválida, use um validador json como https://jsonlint.com/ para ter certeza de que seu json está formatado corretamente

O problema de engolir o erro está sendo rastreado. Encerrarei esse problema, pois é essencialmente uma duplicata dele.

Entre em contato se tiver alguma dúvida.

@ fed135 vincule o problema relevante, se houver, obrigado.

Alguém já resolveu isso ?, Estou usando o laravel como minha API, então registrei minha resposta antes de enviá-la ao meu aplicativo. A resposta registrada é um JSON válido, mas a resposta recebida tem a última chave "}" ausente no final, tornando-a uma resposta inválida. Não sei por que isso está se comportando assim no meu aplicativo móvel, porque para o aplicativo de frontend que usa axios também funciona bem, tentei no carteiro também, funciona bem. quaisquer idéias ou soluções pls ??

Acontece quando os dados ficam muito grandes :( Não tive problemas porque a matriz de dados era pequena!

@matinzd eu

@matinzd e também, meu aplicativo front end usa o mesmo endpoint, e ele não experimenta isso, apenas o aplicativo móvel com react native às vezes

@ fed135 Este é o problema certo para acompanhar? # 61

por favor, minha API laravel está saindo como uma corda ao lado

Finalmente encontrei uma solução para a minha.
Os dados que eu estava obtendo eram ===

Eu tenho o mesmo erro
:(

Tenho o mesmo problema, depois de verificar em jsonlint.com tenho os dados com NaN que json não pode analisá-los como abaixo. Portanto, precisamos garantir que nosso back-end enviou os dados JSON válidos.

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

Mesmo erro, quem pode consertar: |

☝️ Fiz um RP rápido para resolver esse problema. Espero que ajude

Obtendo este problema em react-native com axios 0.19.2
Alguma atualização sobre o problema?

Eu tenho esse mesmo problema, resolvi esse problema faça a mudança no método dos axios, se você tivesse o método 'GET' você não pode enviar o corpo porque você pode pegar esse problema, para resolver isso você precisa mudar para 'POST' e vai estar trabalhando

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

Shu-Ji picture Shu-Ji  ·  3Comentários

helmus picture helmus  ·  3Comentários

ghost picture ghost  ·  3Comentários

shaosh picture shaosh  ·  3Comentários

Spartano picture Spartano  ·  3Comentários