400不正な要求axiosとVUEのJSONデータ伝送ソリューション

免責事項：この記事はブロガーオリジナル記事です、続くBY-SAのCC 4.0を著作権契約、複製、元のソースのリンクと、この文を添付してください。

このリンク： https://blog.csdn.net/Wu_Kunbo/article/details/102777838

問題の説明

ただ、分離vue.js開発+の終了前後にSpringBootモードを学ぶために始めて。

彼は、後端受信== @ RequestBody ==アノテーションで、リアにデモ、遠位JSON形式のパラメータデータを書きました。次のようにVUEのコードがあります

postJsonRequest = (config) => {
    return axios({
      method:'post',
      url:config.url,
      headers:{'Content-Type':'application/json;charset=UTF-8'},
      params:JSON.stringify(config.params)
    });
  }

F12は、==のContent-Typeは==成功が設定されていない要求を表示するには、そのJSONデータの後端までのスプレッドはないエラーにつながります。

ソリューション

オンラインで見つける情報の収集後。元データが空であるため、コンテンツの長さは、コンテンツ・タイプが（おそらく考慮に最適化問題を取って）有効になりません、0です。

したがって、この方法は、それにaxiosデータをパラメータ、次のようにコードの変更が完了：

postJsonRequest = (config) => {
    return axios({
      method:'post',
      url:config.url,
      headers:{'Content-Type':'application/json;charset=UTF-8'},
      data:JSON.stringify(config.params)
    });
  }

成功したコール・インタフェースを再訪。

これは、JSONリクエスト形式のパラメータを見て、そしてまた、設定を有効に事前にContent-Typeのメッセージを要求することができます。