Laravel/Angular “Password Expired” auth flow

I am using Laravel 7.* for my API and Angular 9 for my frontend. I am having trouble figuring out how to handle Password Expiration responses from my api.

My current auth workflow is this:

1. Angular POST /login request to API with an expired password
2. API receives POST request, authenticates the credentials.
3. If authenticated, API checks to see if the password has expired.
4. If password is expired, create a password reset token for the user.
5. API responds back with the reset token.

So, I dont know how to properly handle the response on my Angular app. My ultimate goal would be to send the user to a /reset-password page and pass along the reset token.

I have tried 301 redirecting to the /reset-password url from my server, but I am getting a CORS error. I could send back a 4** response, but how do I tell my app that it needs to redirect to the reset password page, and pass along the token? Has anyone had any success with this, and be willing to share their approach?

Answer

You can use your http post normally, and error handling, of course your backend is responsible for sending back either data if everything is ok or an error if something is not ok, so inside your ts file:

this.http.post('https://your-end-point-url')
    .pipe(
      tap(
        data => {
          // do something with data you receive
        },
        error => {
          this.router.navigate(['/reset-password', { token: token }])
        }
      )
    );

make sure your reset-password route can handle a token parameter