axiosでPOSTしてもレスポンスが返ってこない。

Question

フロントがVue、 バックエンドがRailsで開発してます。
axiosを使い、Ajax通信で成功した場合のレスポンスを受け取りたいのですが、レスポンスのdataが空になります。

##エラー内容
返ってくるレスポンス↓
](cb64b734bea8603b5845c0a67f441d1b.png)

##コード

axios.post(`api/ideas`, params)
   .then(res => {
      console.log(res.data)
      // => ""
    })
   .catch(error => {
      console.log(error.response.data)
      // => ["xxx"が入力されてません"]
   }

def create
  @idea = current_user.ideas.new(idea_params)
  if @idea.save
    render formats: :json, handlers: :jbuilder
    head :created
  else
    render json: @idea.errors.full_messages, status: :bad_request
  end
end

json.title @idea.title
json.description @idea.description
json.userImage current_user.social_profiles.first&.image_url
json.userName current_user.name
json.likeCount 0
json.isLiked false
json.comments 0

エラーはしっかり返ってきます。(error.response.data)

##試したこと

###ヘッダーにCSRFトークンを含める

axios.defaults.headers['X-CSRF-TOKEN'] = $('meta[name=csrf-token]').

変化なし。

また、curlでPOSTしてみるのですが、レスポンスが何も返ってきません。。

curl -X POST -H "Content-Type: application/json" -d '{"idea": {"title":"test", "description":"100"} }' localhost:3000/api/ideas

よろしくお願いいたします。

Answer 1

head :createdは、そのヘッダだけ返すという意味になってしまうのではないかと思います。

レスポンスのステータスを切り替えたいなら、renderの引数でstatus: :createdとするほうが適当かと思います。

Comments

[reon.negi]

maisumakunさん、回答ありがとうございます！
headで指定するとボディを含めずにヘッダだけになってしまうんですね！
無事解決しました！