如何使用Firebase保存登录凭据

时间:2020-05-13 08:35:20

标签: firebase flutter dart

我有一个界面,我们应该通过提供电子邮件和密码来登录。 以下是我的登录页面。 界面是用带有飞镖的飞镖设计的。

我想要的是在用户(选中“记住我”复选框并登录)时保存电子邮件和密码。

当用户再次返回同一页面时,该页面应自动为用户填充用户名和密码。

enter image description here

目前,它将凭据保存在Firebase身份验证中。

下面是我的“记住我”复选框和登录代码。

Widget _RememberMeCheckbox() {
    return Container(
      height: 20.0,
      child: Row(
        children: <Widget>[
          Theme(
            data: ThemeData(unselectedWidgetColor: Colors.white),
            child: Checkbox(
              value: _rememberMe,
              checkColor: Colors.green,
              activeColor: Colors.white,
              onChanged: (value) {
                setState(() {
                  _rememberMe = value;
                });
              },
            ),
          ),
          Text(
            'Remember me',
            style: kLabelStyle,
          ),
        ],
      ),
    );
  }

  Widget _LoginBtn() {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 25.0),
      width: double.infinity,
      child: Form(
        child: RaisedButton(
          elevation: 5.0,
          onPressed: () async {
            final form = formKey.currentState;
            form.save();
            if (form.validate()) {
              try {
                FirebaseUser result =
                    await Provider.of<AuthService>(context, listen: false)
                        .loginUser(email: _email, password: _password);
                print(result);
                Navigator.of(context).pushNamed('/home');
              } on AuthException catch (ex) {
                return _showErrorDialog(context, ex.message);
              } on Exception catch (ex) {
                return _showErrorDialog(context, ex.toString());
              }
            }
          },
          padding: EdgeInsets.all(15.0),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(30.0),
          ),
          color: Colors.white,
          child: Text(
            'LOGIN',
            style: TextStyle(
              color: Color(0xFF527DAA),
              letterSpacing: 1.5,
              fontSize: 18.0,
              fontWeight: FontWeight.bold,
              fontFamily: 'OpenSans',
            ),
          ),
        ),
      ),
    );
  }

我需要使用Firebase做到这一点,有人可以帮助我吗?

String_email =“”;

String_password =“”;

Widget _EmailTextField() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Text(
          'Email',
          style: kLabelStyle,
        ),
        SizedBox(height: 10.0),
        Container(
          alignment: Alignment.centerLeft,
          decoration: kBoxDecorationStyle,
          height: 60.0,
          child: TextFormField(
            keyboardType: TextInputType.text,
            autovalidate: false,
            style: TextStyle(
              color: Colors.white,
              fontFamily: 'OpenSans',
            ),
            decoration: InputDecoration(
              border: InputBorder.none,
              contentPadding: EdgeInsets.only(top: 14.0),
              prefixIcon: Icon(
                Icons.email,
                color: Colors.white,
              ),
              hintText: 'Enter your Email Address',
              hintStyle: kHintTextStyle,
            ),
            validator: (String value) {
              if (value.isEmpty) {
                return 'Email is Required.';
              }
              Pattern pattern =
                  r'^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$';
              RegExp regex = new RegExp(pattern);
              if (!regex.hasMatch(value)) {
                return 'Enter valid Email Address';
              }
              return null;
            },
            onSaved: (String value) {
              return _email = value;
            },
          ),
        ),
      ],
    );
  }

  Widget _PasswordTextField() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Text(
          'Password',
          style: kLabelStyle,
        ),
        SizedBox(height: 10.0),
        Container(
          alignment: Alignment.centerLeft,
          decoration: kBoxDecorationStyle,
          height: 60.0,
          child: TextFormField(
            autovalidate: false,
            style: TextStyle(
              color: Colors.white,
              fontFamily: 'OpenSans',
            ),
            decoration: InputDecoration(
              border: InputBorder.none,
              contentPadding: EdgeInsets.only(top: 14.0),
              prefixIcon: Icon(
                Icons.lock,
                color: Colors.white,
              ),
              suffixIcon: IconButton(
                icon: Icon(
                  _passwordVisible ? Icons.visibility : Icons.visibility_off,
                  color: Colors.white,
                ),
                onPressed: _passwordVisibility,
              ),
              hintText: 'Enter your Password',
              hintStyle: kHintTextStyle,
            ),
            obscureText: !_passwordVisible,
            validator: (String value) {
              if (value.isEmpty) {
                return 'Password is Required.';
              }
              if (value.length < 6) {
                return 'Password too short.';
              }
              return null;
            },
            onSaved: (String value) {
              return _password = value;
            },
          ),
        ),
      ],
    );
  }

2 个答案:

答案 0 :(得分:0)

首先,如果您使用的是TextFormField,则需要使用controller

  TextEditingController emailController    = TextEditingController();
  TextEditingController passwordController = TextEditingController();

然后使用CheckBox小部件:

            child: Checkbox(
              value: _rememberMe,
              checkColor: Colors.green,
              activeColor: Colors.white,
              onChanged: (value) {
                setState(() {
                  if(value){
                    emailController.text = FirebaseAuth.instance.currentUser().email;
                  _rememberMe = value;
                });
              },
            ),
          ),

关于password,您无法从Firebase身份验证中检索它,如果要获取密码,必须使用shared_preferences插件

答案 1 :(得分:0)

有几种选择:

相关问题