Ошибка 422 Необработанный объект - Rails API VueJS From

Question

Я пытаюсь создать новый user через форму vuejs.Я использую Rails API для бэкэнда.

Я использую gem knock и gem bcrypt для авторизации JWT.

Когда я отправляю форму, я получаю ошибку 422в терминале.Что-то, что я заметил, это то, что похоже, что он пытается обработать это как HTML, а не как json.

Started POST "/api/v1/users" for 127.0.0.1 at 2019-02-17 21:18:05 +0000
Processing by Api::V1::UsersController#create as HTML
  Parameters: {"email"=>"ui@gmail.com", "password"=>"[FILTERED]", "user"=>{"email"=>"ui@gmail.com"}}
Completed 422 Unprocessable Entity in 10ms (Views: 0.9ms | ActiveRecord: 0.0ms | Allocations: 576)

При использовании Insomnia я в состоянии создать совершенно нового пользователя, который ведет менячтобы сосредоточиться на внешнем интерфейсе, являющемся проблемой.

Далее, когда я удаляю has_secure_password из модели user, форма отправляется с успешными 200, хотя и без пароля.

Так почему здесь воспроизводится пароль?

createuser.vue

<template>
  <div class="card-container">
    <div class="signup">
      <form @submit.stop.prevent="newUser">
        <input id="email" v-model="email" type ="text" name="email" class="input">
        <input id="password" v-model="password" type="password" name="password" class="input">
        <input type="submit" value="Submit" class="btn-update">
      </form>
    </div>
  </div>
</template>
<script>
import axios from 'axios'
export default {
  data() {
      return {
          email: '',
          password: '',
          errors: []
      }
  },

  methods: {

  newUser() {
    axios.post('http://localhost:3001/api/v1/users', {
        email: this.email,
        password: this.password
      })
      .then(res => (this.user = res.data))
      .catch((error) => {
        console.log(error)
      });
  },
  }
};

</script>
<style>

</style>

rout.rb

Rails.application.routes.draw do

  namespace :api do
    namespace :v1 do
      post 'user_token' => 'user_token#create'
      resources :users
      resources :posts
      #post   '/users/create'   => 'users#create' not making a difference
      #get    '/users/current'  => 'users#current'
    end
   end
end

users_controller.rb

class Api::V1::UsersController < ApplicationController
    before_action :authenticate_user,  only: [:index, :current, :update]

    def index 
        render json: User.all, status: 200
    end

    # Call this method to check if the user is logged-in.
    # If the user is logged-in we will return the user's information.
    def current
        current_user.update!(last_login: Time.now)
        render json: current_user
    end

    #def show
    #   @user = User.find(params[:id])
    #
    #    render json: User.find(params[:id]), status: 200
    #end

    def create
        user = User.new(user_params)

        if user.save
            render json: user, status: :created, location: user
        else
            render json: user.errors, status: :unprocessable_entity
        end
    end

    def update
        if @user.update(user_params)
          render :show, status: :ok, location: @user
        else
          render json: @user.errors, status: :unprocessable_entity
        end
    end

    def destroy
        @user.destroy
    end

private
    def set_user
        @user = User.find(params[:id])
    end

    def user_params
        params.require(:user).permit(:email, :password, :avatar)
    end
end

ОБНОВЛЕНИЕ

Я добавил параметр по умолчанию в пространство имен API.namespace :api, defaults: {format: :json}

Это "исправило" обработку как JSON:

Processing by Api::V1::UsersController#create as JSON

Но я все еще получаю 422 кода.

Answer 1

Вам нужно обернуть данные поста в user объект

{
  "user":
  {
    "email": "user@example.com",
    "password": "password"
  }
}

Вы можете изменить свой запрос

axios.post('http://localhost:3001/api/v1/users', {
    user: {
      email: this.email,
      password: this.password
    }
  })
  .then(res => (this.user = res.data))
  .catch((error) => {
    console.log(error)
  });