web-dev-qa-db-ja.com

Axios POSTリクエストがエラーステータスコード500で失敗する：内部サーバーエラー

Axiosを介して本文にユーザー名とパスワードを指定してPOSTリクエストをローカルに送信しようとしています。

Flaskアプリを http://127.0.0.1:5000/login にデプロイしています。これは/ loginルートを処理します。 POSTリクエストは次のエラーで失敗します

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)

私は少し調べて、それがCORSに問題があるのではないかと考えましたが、Axios GETリクエストを試し、それが正常に機能した（応答が適切にログに記録された）ため、これはそうではないようです。これが私のコードの一部です

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);
      })

Chrome DevToolsを見ると、POSTリクエストのペイロードが適切に入力されていることがわかります。次に、次のコードを使用してFlaskアプリでサーバー側のキーを出力してみましたが、何も表示されず、空でした。 （POSTリクエストが失敗したため、これは予期されていました）

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

ただし、対応するキーと値でPostmanを使用すると正しく機能し、応答を返し、キーを出力します（上記を参照）。失敗の原因はどこですか？ GETが正常に機能しているように見えるのに、なぜPOSTリクエストが失敗するのですか？

javascriptpostflaskaxiosinternal-server-error
10
M Xiao

どうやらAxiosは生のJSONオブジェクトを親切にしませんでした

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

しかし、データをFormDataオブジェクトに渡しても問題なく動作するようです。

4
M Xiao

だから私も同じ問題に行き詰まり、私が見つけた解決策は次のようなものでした：

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

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

この解決策は私にとってうまくいきました。

1
Aman Singh