GraphQL: Reset user password with emailed token

[MichaelJCole]

New Issue Checklist

• [ x] I am not disclosing a vulnerability.
• [x ] I am not just asking a question.
• [ x] I have searched through existing issues.
• [ x] I can reproduce the issue with the latest version of Parse Server.

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

[mtrezza]

Thank you for reporting.

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

[MichaelJCole]

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);
      }
    );

[Moumouls]

@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 ? 😃 )

[MichaelJCole]

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',
        }
      }
    )