Search code examples
reactjsformikremember-me

How to tell the browser to save password?


I have a login page, and I would like to set a "remember me" input.

If the input is checked, then I want the user's browser to ask the user if he wants to store his email and password.

Is it possible ?

If I am wrong, can you explain me how the remermber me works ?

I have a JWT working when the user logs in.

Here is my React component :

<Formik>

[...]

       <button type="submit" className="w-full mbi-green-btn">
          Log in
       </button>

       <div className="flex items-center">
         <Field type="checkbox" className="w-4 h-4" id="remember-me" name="rememberMe" />
         <label htmlFor="rememberMe" className="text-xs text-gray-500 ml-3">Remember me</label>
       </div>
  </Form>
  )}
</Formik>

Solution

  • If you have input type as username and password (or similar class) - most browsers self prompt to save the password. As far as I know, there isn't an explicit way from your app to control browser behavior.

    To implement the remember me functionality - you will have to handle it yourself. A simple solution would be be to include a remember: true in localStorage and then check for it in you app (handle refresh logic automatically if the field exists or is true, else log out (remove tokens from storage) and prompt user to log in