时间戳

首页 > 解决方案 > 如何在提交事件中用另一个字段的值替换？

reactjs - 如何在提交事件中用另一个字段的值替换？

问题描述

在 React-Admin 中，在我们的注册表单 ( SimpleForm ) 上，为了提高安全性和用户的信任度，我们不希望我们的服务器以明文形式接收用户密码（即使我们使用 HTTPS）。

我们想用相关的 sha256 散列替换值 on-the-fly（在服务器端，我们存储这个散列的 bcrypt 版本）

从用户的角度来看，有一种解决方案可以在不改变 SimpleForm 中的值的情况下做到这一点吗？因为，如果服务器 API 在表单中返回错误，用户将再次提交表单，我们仍然需要翻译原始密码值。

问候，

标签： reactjsreact-admin

解决方案

我还没有测试过，但你可能可以在输入组件上使用redux-formnormalize的prop 。就像是：

const encryptPassword = (value, previousValue, allValues, previousAllValues) => {
    // Encypt the password somehow
    const encyptedPassword = ...;
    return encyptedPassword
}

<TextInput type="password" normalize={encryptPassword} />

另一种选择是在将有效负载发送到您的dataProvider. 就像是：

// in src/dataProvider.js
import dataProvider from 'ra-data-simple-rest';

// defaultDataProvider is your original dataProvider which we decorate here
const addEncryption = defaultDataProvider => (fetchType, resource, params) => {
    let finalParams = params;

    if (resource === 'users' && fetchType === 'CREATE') {
        finalParams = {
            ...params,
            password: encryptPassword(params.password),
        };
    }

    return defaultDataProvider(fetchType, resource, finalParams);
}

export default addEncryption(dataProvider);

推荐阅读