Vue.js/ReactでFormDataのデータをAxiosでPOSTする方法

FormDataをAxiosで送信する方法は、

よくやるけれど、

毎回、なんだっけとなるので、

メモとして残しておく。

FormDataでのパラメータデータの設定

FormDataを使って、

appendでファイルオブジェクトを設定

let formData = new FormData();
formData.append("file", 【ファイルオブジェクト】);

AxiosでのPOST

Axiosを使ってPOSTとして、

設定したFormDataを送る。

axios.post(baseUrl, formData, {
  headers: {
    "Content-Type": "multipart/form-data",
  },
})
.then(res => {
  console.log(res);
})}

まとめ

コードをまとめると、このようになる

let formData = new FormData();
formData.append("file", 【ファイルオブジェクト】);
axios.post(baseUrl, formData, {
  headers: {
    "Content-Type": "multipart/form-data",
  },
})
.then(res => {
  console.log(res);
})}

就職/転職に向けてスキルを高めるために

プログラミングのスキルを高めるために、

以下のサイトを参考にしてみてください。

元Yahooエンジニアの超実践型プログラミングスクール「PRUMエンジニア留学」
Freeks(フリークス)｜サブスク型プログラミングスクールの申込
未経験からITエンジニアを目指すサポートに特化した「ウズキャリIT」

おすすめ書籍

コメント一覧

コメントはまだありません。

コメント送信

コメントを残す

関連記事

広告

おすすめ記事