web-dev-qa-db-fra.com

Axios POST échoue avec le code d'état d'erreur 500: erreur de serveur interne

J'essaie d'envoyer une demande POST localement avec un nom d'utilisateur et un mot de passe dans le corps via Axios.

Je déploie une application Flask sur http://127.0.0.1:5000/login , qui gère la route/login. Le POST échoue avec l'erreur suivante

POST http://127.0.0.1:5000/login 500 (INTERNAL SERVER ERROR)
Error: Request failed with status code 500
    at createError (createError.js:16)
    at settle (settle.js:18)
    at XMLHttpRequest.handleLoad (xhr.js:77)

J'ai fait des recherches un peu et j'ai pensé que cela pourrait être un problème avec CORS, mais cela ne semble pas être le cas parce que j'ai essayé une requête Axios GET et cela a bien fonctionné (réponse correctement enregistrée). Voici une partie de mon code

axios.get("http://127.0.0.1:5000").then(function(response) {
        console.log(response);
      }).catch(function(error) {
        console.log(error);
      })
axios.post("http://127.0.0.1:5000/login", {
        username: this.state.username,
        password: this.state.password
      }).then(function(response) {
        console.log(response);
      }).catch(function(error) {
        console.log(error);
      })

En regardant Chrome DevTools, je peux voir que la charge utile de la demande POST est correctement remplie. J'ai ensuite essayé d'imprimer les clés côté serveur dans le Flask app utilisant le code suivant, mais je n'ai rien, vide. (Ce qui était attendu depuis la POST)

dict = request.form
    for key in dict:
        print('form key '+dict[key])

TOUTEFOIS, l'utilisation de Postman avec les clés et valeurs correspondantes fonctionne correctement et renvoie une réponse et imprime les clés (voir ci-dessus). D'où vient l'échec? Pourquoi la demande POST échouerait-elle lorsqu'un GET semble fonctionner correctement?

javascriptpostflaskaxiosinternal-server-error
10
M Xiao

Apparemment, Axios n'a pas pris gentiment l'objet JSON brut

{username: this.state.username, password: password}

mais passer les données dans un objet FormData semblait fonctionner très bien!

4
M Xiao

J'ai donc été coincé dans le même problème et la solution que j'ai trouvée était quelque chose comme ceci:

let data = JSON.stringify({
  username: this.state.username,
  password: password
});

const response = axios.post(url,data,{headers:{"Content-Type" : "application/json"}});

Cette solution a fonctionné pour moi.

1
Aman Singh