Rails 5 API + Vue.js 프론트 엔드 : devise_invitable로 사용자를 초대하기위한 양식

Question

Vue.js로 초대 양식을 작성 중입니다. 초대장은 Rails 5 API에 POST되어야합니다. 초대 논리 및 이메일 발송을 위해 devise_invitable을 사용하고 있습니다. 그러나 여러 사용자에게 초대장을 보내므로 create 메서드를 차단하는 데 문제가 있으므로 params의 각 사용자에 대해 User.invite!을 수행하려고합니다.

내 게시 할 양식이 포함 파일, invite.vue :

<template> 
    <b-row> 
    <b-col> 
     Invite {{form.length}} members 

     <b-form @submit.prevent="submitStaffInvite" id='staffInvite'> 
     <div v-for="(row, idx) in form"> 
      <b-row> 
      <b-col cols="3"> 
       <b-form-group id="firstNameGroup" label="First name"> 
       <b-form-input id="firstNameInput" name="user[first_name][]" type="text" v-model="row.firstName" autofocus></b-form-input> 
       </b-form-group> 
      </b-col> 
      <b-col cols="3"> 
       <b-form-group id="lastNameGroup" label="Last name"> 
       <b-form-input id="lastNameInput" name="user[last_name][]" type="text" v-model="row.lastName"></b-form-input> 
       </b-form-group> 
      </b-col> 
      <b-col cols="3"> 
       <b-form-group id="emailGroup" label="Staff email"> 
       <b-form-input id="emailInput" name="user[email][]" type="text" v-model="row.email"></b-form-input> 
       </b-form-group> 
      </b-col> 
      <b-col cols="3"> 
       <b-button @click='removeRow(idx)'>Remove invitation</b-button> 
      </b-col> 
      </b-row> 
     </div> 
     <br /> 
     <b-button-group> 
      <b-button @click.prevent='addRow'>Add invitation</b-button> 
     </b-button-group> 
     <br /> 
     <b-button-group> 
      <b-button type="submit" variant="primary">Submit</b-button> 
     </b-button-group> 

     </b-form> 
    </b-col> 
    </b-row> 
</template> 

<script> 
    export default { 
    data:() => { 
     return { 
     form: [ 
      { 
      email: '', 
      firstName: '', 
      lastName: '' 
      } 
     ] 
     } 
    }, 
    methods: { 
     addRow: function() { 
     this.form.push({ 
      email: '', 
      firstName: '', 
      lastName: '' 
     }) 
     }, 
     removeRow: function (idx) { 
     this.form.splice(idx, 1) 
     }, 
     submitStaffInvite: function() { 
     this.$axios.post('http://localhost:3001/auth/invitation', this.form) 
      .then((res) => { 
      if (res.status === 200) { 
       this.$notify({ 
       text: res.data.message, 
       group: 'alerts', 
       type: 'success' 
       }) 
      } 
      }) 
      .catch(function (error) { 
      error.response.data.errors.forEach((err) => { 
       this.$notify({ 
       text: err, 
       group: 'alerts', 
       type: 'warning' 
       }) 
      }) 
      }) 
     } 
    } 
    } 
</script> 

내 사용자/invitations_controller.rb

class Users::InvitationsController < Devise::InvitationsController 
    before_action :configure_permitted_parameters 

    def create 
    # TODO 
    # Send email to each user in the form. 
    end 

    def edit 
    sign_out send("current_#{resource_name}") if send("#{resource_name}_signed_in?") 
    set_minimum_password_length 
    resource.invitation_token = params[:invitation_token] 
    redirect_to "http://localhost:3001/auth/invitation/accept?invitation_token=#{params[:invitation_token]}" 
    end 

    def update 
    super do |resource| 
     if resource.errors.empty? 
     render json: { status: "Invitation Accepted!" }, status: 200 
     else 
     render json: resource.errors, status: 401 
     end 
    end 
    end 

    protected 

    def configure_permitted_parameters 
    devise_parameter_sanitizer.permit(:accept_invitation, keys: [:first_name, :last_name]) 
    end 
end 

내 routes.rb

Rails.application.routes.draw do 
    # Using devise_token_auth for the API 
    mount_devise_token_auth_for 'User', at: 'auth', 
             defaults: { format: :json }, 
             controllers: { 
             invitations: 'users/invitations' 
             } 
    ... 
end 

,451,515,

나는 다음과 같은 경로가 존재하는 것을 볼 수 있습니다

PUT  /auth/invitation(.:format)   devise/invitations#update 
POST  /auth/invitation(.:format)   devise/invitations#create 

내가 여기에 볼 수있는 문제를 내가 같이하는 경로를 기대할 수 있다는 것입니다 비록 :

이

PUT  /auth/invitation(.:format)   users/invitations#update 
POST  /auth/invitation(.:format)   users/invitations#create 

가이 동작이 발생할 수 있습니다 에 의해 devise_token_auth 보석, 나는 잘 모르겠습니다.

다시이 양식을 제출하면 create 메서드를 가로 채기 위해 양식에 나열된 모든 사용자에 대해 User.invite!을 호출 할 수 있기를 기대합니다. create 메서드 안에 byebug 또는 binding.pry을 추가하려고 시도했지만 코드가 실행되지 않는 것으로 표시됩니다. 즉, 코드가 무시됩니다.

내가 볼 수있는 오류 메시지는 다음과 같습니다

Processing by Devise::InvitationsController#create as HTML 
    Parameters: {"_json"=>[{"email"=>"asd@ad.com", "firstName"=>"Test", "lastName"=>"Last"}], "invitation"=>{"_json"=>[{"email"=>"asd@ad.com", "firstName"=>"Test", "lastName"=>"Last"}]}} 
Completed 500 Internal Server Error in 0ms (ActiveRecord: 0.0ms) 



ArgumentError (wrong number of arguments (given 1, expected 0)): 

나는의 메소드를 만들 devise_invitable '에 양식 데이터를 전달 안되는 건가요? 어떤 도움이라도 대단히 감사합니다.

미리 감사드립니다.

Answer 1

당신이 this article