1

我正在用 Vue.js 编写邀请表。邀请应该 POST 到 Rails 5 API。我正在使用devise_invitable邀请逻辑和电子邮件发送。但是,我在拦截该create方法时遇到问题,因为我将向多个用户发送邀请,所以我想为User.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

我的路线.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

我可以看到存在以下路线:

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_authgem 引起的,我不确定如何纠正。

同样,当我提交此表单时,我希望能够拦截该create方法,然后调用User.invite!表单中列出的所有用户。我尝试在方法中添加byebugor ,但代码似乎没有执行,这意味着它被绕过了。binding.prycreate

我看到的错误信息是:

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_invitablecreate 方法吗?任何帮助深表感谢。

提前致谢!

4

1 回答 1

0

尝试将您的路线更改为

mount_devise_token_auth_for 'User', at: 'auth', skip: [:invitations]

devise_for :users, path: "auth", only: [:invitations],
controllers: { invitations: 'users/invitations' }

更多信息你可以参考这篇文章

于 2017-11-18T02:34:41.103 回答