用rails后端，react + redux前端实现设计用户角色

Question

我正在构建一个应用程序，其中有两种类型的用户，member和business_event。我正在努力实现这一点。我有一个用户注册表单，他们可以从下拉菜单中选择他们是否是"会员"。或者"生意"或"事件"。当我尝试注册一个特定的角色时，我的rails控制台总是显示"role"是"member"(我分配的默认值)。

在我的rails后端，我添加了这个gem和这个迁移:

class AddRoleToUsers < ActiveRecord::Migration[6.1]
def change
add_column :users, :role, :integer
end
end

然后将User模型更改为以下内容:

class User < ApplicationRecord
has_secure_password
enum role: [:member, :business_event]
after_initialize :set_default_role, :if => :new_record?
def set_default_role
self.role ||= :member
end
end

在我的react前端，这是我想用来注册用户的表单:

import React from 'react'
import { connect } from 'react-redux'
import { updateSignupForm } from "../../actions/signupForm.js"
import { signup } from "../../actions/currentUser.js"
const Signup = ({ signupFormData, updateSignupForm, signup }) => {
const handleUserInfoInputChange = event => {
const { name, value } = event.target
const updatedFormInfo = {
...signupFormData,
[name]: value
}
updateSignupForm(updatedFormInfo)
}



const handleSubmit = event => {
event.preventDefault()

signup(signupFormData)
}

return (
<div>
<h1>Sign Up </h1>
<form onSubmit={handleSubmit}>
<div className="ui input">
<select>
<option value={signupFormData.role}>Member</option>
<option value={signupFormData.role}>Business or Event</option>
</select>
<input placeholder="username" value={signupFormData.username} name="username" type="text" onChange={handleUserInfoInputChange} /> 
<input placeholder="password" value={signupFormData.password} name="password" type="text" onChange={handleUserInfoInputChange} /> 
<input placeholder="email" value={signupFormData.email} name="email" type="text" onChange={handleUserInfoInputChange}/><br/><br/>
<button className="button button-signup" type="submit" value="Sign Up" > Sign up</button>
</div>
</form>
</div>

)
}

const mapStateToProps = state => {
return {
signupFormData: state.signupForm
}
}

export default connect(mapStateToProps, { updateSignupForm, signup } )(Signup)

在我的signupForm减速器中，我决定设置"role"的初始值。"0";因为它在后端是一个整数。我不确定这是不是我错的地方:

const initialState = {
username: "",
password: "",
email: "",
role: 0
}

export default (state=initialState, action) => {
switch (action.type) {
case "UPDATE_SIGNUP_FORM":
return action.formData
case "RESET_SIGNUP_FORM":
return initialState
default:
return state
}
}

我不知道为什么用户总是恢复到"成员"的默认角色。如有任何帮助，不胜感激。

Answer 1

在添加其他功能之前，您实际上应该专注于正确安装设计并为基本身份验证系统添加测试。把你的工作藏起来，往回走。

首先运行生成器生成配置文件:

rails g devise:install

然后设置你的模型:

rails g devise user

添加以下内容:

class User < ApplicationRecord
devise :database_authenticatable, :registerable,
:recoverable, :rememberable, :validatable
end

你不希望has_secure_password是Rails自己的密码加密宏来构建你自己的身份验证系统。您已经了解了设计database_authenticatable模块。现在编写集成测试，在不涉及react的情况下涵盖注册和登录。当涉及到保持你的理智时，这将会得到回报。

现在你可以从角色特性开始了。

在数据库级别添加带有默认值的enum列:

class AddRoleToUsers < ActiveRecord::Migration[6.1]
def change
add_column :users, :role, :integer, default: 0
end
end

使用回调设置属性默认值是一种过时的、令人讨厌的方法，有许多已知的缺陷。使用数据库默认值，除非你真的需要在应用程序级别评估默认值——在这种情况下，你希望通过attributes api来完成。

将枚举宏添加到模型中:

class User < ApplicationRecord
devise :database_authenticatable, :registerable,
:recoverable, :rememberable, :validatable
enum role: [:member, :business_event]
end

如果您真的希望能够在注册用户时通过参数设置角色，则需要在设计:

中将参数列入白名单。

class ApplicationController < ActionController::Base
before_action :configure_permitted_parameters, if: :devise_controller?
protected
def configure_permitted_parameters
devise_parameter_sanitizer.permit(:sign_up, keys: [:role])
end
end

但是您需要仔细考虑这样做的安全含义，因为它可能允许恶意用户通过cURL发送请求或操纵输入来授予自己更高的特权。这可能现在不相关，但请记住，如果你添加一个管理员角色，例如。

角色的整数值也是只有模型才知道的实现细节。你的前端和其他所有东西，比如控制器，应该只知道键:

const initialState = {
username: "",
password: "",
email: "",
role: "member"
}