Skip to content

GraphQL: Reset user password with emailed token #7033

Closed

Description

@MichaelJCole

New Issue Checklist

Issue Description

Hi, please correct me if I'm misunderstanding, but it looks like the GraphQL API cannot complete a "lost/reset password" UX for the user.

GraphQL API has a resetPassword mutation which sends an email with a link. Implemented here.

That link uses "customPages" to 302 to a FE web app location. My FE is responsible for helping the user complete their request.

Three functions complete this user interaction:

  1. request the email
  2. requestResetPassword to verify the email link is valid and forward to front-end application
  3. resetPassword to change the password.

The issue is I don't see how to complete that password reset with the GraphQL API.

I see two changes:

  1. Rename GraphQL mutation 'resetPassword' to 'requestResetPassword' to match the PublicAPIRouter.
  2. Implement GraphQL a new 'resetPassword' mutation that calls the PublicAPIRouter.

The workaround seems to be to use the REST API to send the users new password and complete the request.

Steps to reproduce

Build a password reset feature using Parse GraphQL API

Actual Outcome

Have web FE use Parse REST API to complete forgotPassword. I think this makes the GraphQL API incomplete.

Expected Outcome

Awesome form!

Environment

Server

  • Parse Server version: 4.4
  • Operating system: Ubuntu 20.04
  • Local or remote host (AWS, Azure, Google Cloud, Heroku, Digital Ocean, etc): localhost

Database

  • System (MongoDB or Postgres): MongoDB
  • Database version: FILL_THIS_OUT
  • Local or remote host (MongoDB Atlas, mLab, AWS, Azure, Google Cloud, etc): Local

Client

  • SDK (iOS, Android, JavaScript, PHP, Unity, etc): FILL_THIS_OUT
  • SDK version: FILL_THIS_OUT

Logs

Activity

  1. mtrezza commented on Dec 2, 2020

    @mtrezza
    Member

    Thank you for reporting.

    @Moumouls Do you have any suggestion for this GraphQL related issue?

  2. MichaelJCole commented on Dec 2, 2020

    @MichaelJCole
    Author

    Hi @Moumouls and @mtrezza, thank you for looking at this. Here's a recap of the flow (to organize my thoughts)

    1. Make GraphQL request to send email
    2. user clicks email link, and is redirected to a "choosePassword" custom page in my app. This "hop" validates the token and redirects to different custom pages. Still no new password yet.
    3. My custom choosePassword page gathers users input and requests a new password. It would make sense for me to use GraphQL for this, but with REST, it's the same code in the end.

    I think this test case is an example

    It looks like that REST route has two purposes depending on GET or POST:

      this.route(
          'POST',
          '/apps/:appId/request_password_reset',
          req => {
            this.setConfig(req);
          },
          req => {
            return this.resetPassword(req);
          }
        );
    
        this.route(
          'GET',
          '/apps/:appId/request_password_reset',
          req => {
            this.setConfig(req);
          },
          req => {
            return this.requestResetPassword(req);
          }
        );
    
  3. Moumouls commented on Dec 2, 2020

    @Moumouls
    Member

    @MichaelJCole if i understand you try to set up custom account workflow via GraphQL without using the Parse Server pages (resetPassword page, verify email page).

    Currently the GraphQL API do not support this kind of mutation since many developers use auto managed Parse Server pages.

    But it looks like a good addition, we have many example into the GraphQL folder under userMutation file.
    I think the implementation could be easy !

    Would you like to start a quick PR ? (with the endpoint suggested into you other issue ? 😃 )

  4. changed the title [-]GraphQL API cannot reset users password.[/-] [+]GraphQL: Reset user password with emailed token[/+] on Dec 2, 2020
  5. MichaelJCole commented on Dec 2, 2020

    @MichaelJCole
    Author

    Hi @Moumouls, thanks for the invite, I appreciate what you guys have done.

    My concerns with making a PR are:

    1. I just started using GraphQL and Parse a couple weeks ago
    2. Auth code needs to be tested, and I'm not familiar with the dev and test environments
    3. I'm on a small project and need to get some features done ASAP

    I got this to work using the existing API's, so I'll spend some time to make a documentation PR for the GraphQL and REST guides.

    For reference, here is how to complete the password reset with the REST API from the client:

        await axiosClient.post(
          `/parse/apps/${process.env.PARSE_SERVER_APPLICATION_ID}/request_password_reset`,
          `username=${encodeURIComponent(email)}&new_password=${encodeURIComponent(password)}&token=${encodeURIComponent(token)}`,
          {
            headers: {
              'X-Requested-With': 'XMLHttpRequest',
              'content-type': 'application/x-www-form-urlencoded',
            }
          }
        )
    
  6. added a commit that references this issue on Dec 2, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    type:featureNew feature or improvement of existing feature

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions