1

I have an angular 5 application where I do check if the user is authenticated or not. For that I'am using the AuthGuard feature. It works fine.

My issue is that the server some times doesn't send any clear status back to the client. In other words, there is no server error such 403 or 401 etc.

The only thing I can see on Chrome developer tool in Network is the status: pending which is not an error for my script... therefore the page which is a kind of admin-page, is not being loaded and I get a blank page.

I have been searching but unfortunately the only topics I found regarding pending status issues is e.g. these ones which couldn't really be a help... and the last one is nearly 5 years old question.

Android InApp Purchase - How to handle Pending Status?

jQuery ajax callback in pending status

How to fix the “pending” status in Chrome Developer Window?

Before trying to find out what could be the exact reason for that (as I still have no real idea about that), I first would like to catch this case and redirect the user to the home or register page for example.

Here is the code where I send the request to check user authentication:

Would .finally( () => { .... }) be an option and does it make sense in this case based on the following proposed solution?

service:

...
public getData() {

    if (this.isAuthenticated === true) {
        return Observable.of(true);
    } else {
        return this._http.get(url, {withCredentials: true, observe: 'response'})
          .map((res) => {
            if ( res.status === 200) {
                this.isAuthenticated = true;
                 return true;
            } else {
                return false;
            }
        }, (err) => {
            return false;
        });
    }

}

guard:

....
constructor() {private bckendData: Myservice, ...}
....
canActivate( route: ActivatedRouteSnapshot, ... ): Observable<boolean> | Promise<boolean> | boolean {
        return this.bckendData.getData()
        .map( (res) => {
            if ( res === true) {
                return true;
            } else {
                doSomething....
                return false;
            }
        })
        .catch(err => {
            doSomething....
            return Observable.of(false);
        });
    }
k.vincent
  • 3,743
  • 8
  • 37
  • 74
  • Some times I just wonder if the down vote feature makes any sense? Posting the needed code, explaining the issue, have been searching and adding the reference(s) to other questions!! My question is clear and could be helpful if there is any answer or a fix for that. At least the one who is down voting should add his comment and provide the reason for that!! – k.vincent Mar 28 '18 at 14:16
  • You can't catch an error with `finally` or otherwise if there's no error. See https://stackoverflow.com/questions/45938931/angular-httpclient-default-and-specific-request-timeout – Estus Flask Mar 28 '18 at 14:35
  • @estus: Sure, you're right... agree. Let's say this would be an option to avoid having a blank page when status is `pending`. Option 1 response success and returns 200, second would be the error and at the end if none of them is the case, then goes to finally... – k.vincent Mar 28 '18 at 14:48
  • This isn't how `finally` works (whatever `finally` is; in the answer you've linked it refers to $q finally). – Estus Flask Mar 28 '18 at 14:52
  • Ok, true... Any hint regarding what could be the cause for status `pending`? I assume at the moment that the cause is in the BackEnd. So, is it possible to catch this case or let's say to have a sort of workaround for that if it happens once again - as it does 't occurs always? – k.vincent Mar 28 '18 at 15:19
  • 1
    This totally depends on back end and should be debugged there. The workaround is to provide a timeout for all requests, as described in the link above. – Estus Flask Mar 28 '18 at 15:25
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/167746/discussion-between-k-vincent-and-estus). – k.vincent Mar 28 '18 at 15:29

0 Answers0