使用Meteor和React进行注册确认之前的电子邮件验证

Question

只需按照本教程学习Meteor和Reactjs，就可以很好地使用它。 这是一个注册页面，默认情况下，注册完成前不会通过电子邮件进行验证。 在现实生活中，我想让用户在注册完成之前验证他们的电子邮件，作为新手，我准备好了方法，请提供帮助。

Signupform = React.createClass({
    mixins: [ReactMeteorData],
    getMeteorData(){
        let data = {};
        data.currentUser = Meteor.user();
        return data;
    },
    getInitialState(){
        return {
            message: '',
            messageClass: 'hidden'
        }
    },
    displayError(message){
        this.setState({message: message, messageClass: 'alert alert-danger registerError'});
    },
    handleSubmit(e){
        e.preventDefault();
        this.setState({message: '', messageClass: 'hidden'});
        var that = this;
        var first_name = ReactDOM.findDOMNode(this.refs.first_name).value.trim();
        var last_name = ReactDOM.findDOMNode(this.refs.last_name).value.trim();
        var email = ReactDOM.findDOMNode(this.refs.email).value.trim();
        var password = ReactDOM.findDOMNode(this.refs.password).value.trim();
        var user = {
            email: email,
            password: password,
            profile: {
                fullname: (first_name + last_name).toLowerCase(),
                firstname: first_name,
                lastname: last_name,
                avatar: 'http://placehold.it/150x150',
                friends: []
            }
        };
        Accounts.createUser(user, function (e) {

            if (e) {
                that.displayError(e.reason);
            } else {
                FlowRouter.go('/dashboard');
            }
        })


    },
    render(){
        return (
            <div className="row">
                <div className="signup">
                    <h1>Sign Up</h1>
                    <p className="text-muted">It's free and always will be.</p>
                </div>
                <form onSubmit={this.handleSubmit}>
                    <div className="col-sm-9">
                        <div className="row">
                            <div className="col-sm-6 form-group">
                                <input ref="first_name" type="text" placeholder="First name"
                                       className="form-control"/>
                            </div>
                            <div className="col-sm-6 form-group">
                                <input ref="last_name" type="text" placeholder="Last name"
                                       className="form-control"/>
                            </div>
                        </div>


                        <div className="form-group">
                            <input type="text" placeholder="Email or mobile number" ref="email"
                                   className="form-control"/>
                        </div>
                        <div className="form-group">
                            <input type="password" placeholder="New password" ref="password"
                                   className="form-control"/>
                        </div>
                        <button type="submit" className="btn btn-md btn-success">Sign Up</button>
                        <span className={this.state.messageClass}>{this.state.message}</span>

                    </div>
                </form>
            </div>
        )
    }
});

Answer 1

流星帐户程序包具有旨在验证电子邮件地址的功能，但这是在用户创建帐户之后发生的。 Accounts.sendVerificationEmail

这是它的文档的链接。

或者，您可以使用另一个称为Accounts.sendEnrollmentEmail Accounts函数，该函数通过电子邮件向用户发送链接，然后将其重定向回应用程序以设置其密码并访问该应用程序。

这样一来，您就可以知道他们在使用有效电子邮件之前可以使用您的应用程序。

这是指向该文档的链接。

Answer 2

我不确定在注册之前验证电子邮件的意思。 如果您要验证电子邮件的存在，请执行以下步骤。

用户提交注册表格后，您需要使用一种一次性密码（OTP）将随机的4或6位数字发送到该电子邮件地址。 然后在用户界面上，要求用户输入他们在电子邮件中收到的OTP。 如果与您发送的邮件匹配，则可以注册用户，如果没有出现错误，请他们重新确认电子邮件并重新开始循环。

注意：这与反应或流星没有任何关系。 这是一个逻辑问题。