Я пытаюсь обрабатывать ошибки с аутентификацией пользователя, и когда пользователь регистрирует новую учетную запись, но имя пользователя уже существует, он должен выдать ошибку 400 Bad request.

Итак, это мой метод регистрации в AuthController.cs:

public async Task<IActionResult>Register(UserForRegisterDto 
                                                   userForRegisterDto)
    {
    userForRegisterDto.username = userForRegisterDto.username.ToLower();

        if(await _repo.UserExists(userForRegisterDto.username)) 
        {
            return BadRequest("Username already exists !");
        }

        var userToCreate = new User
        {
            Username = userForRegisterDto.username
        };

     var createdUser = await _repo.Register(userToCreate, 
                                            userForRegisterDto.password);

        return StatusCode(201);
    }

В register.component.ts:

export class RegisterComponent implements OnInit {
@Output() cancelRegister = new EventEmitter();
model: any = {};
constructor(private authService: AuthService) { }
ngOnInit() {}

register() {
    this.authService.register(this.model).subscribe(() => {
  console.log('create successed');
}, error => {  
  console.log(error);
});
}

cancel() {
   this.cancelRegister.emit(false);
    console.log('canceled');
 }
}

В register.component.html:

<form #registerForm="ngForm" (ngSubmit)="register()">
<h2 class="text-center text-primary">Sign Up</h2>
<hr>

<div class="form-group">
    <input type="text" class="form-control" required name="username" 
    [(ngModel)]="model.username" placeholder="Username">
</div>

<div class="form-group">
    <input type="password" class="form-control" required name="password" 
[(ngModel)]="model.password" placeholder="Password">
</div>

<div class="form-group text-center">
    <button class="btn btn-success" type="submit">Register</button>
    <button class="btn btn-default" type="button" 
    (click)="cancel()">Cancel</button>
</div>
</form>

Чтобы отправить ошибку из внешнего интерфейса, я создал Exceptions.cs, который будет содержать ошибку в заголовке API выборки:

 public static class Exceptions
{
    public static void AddApplicationError(this HttpResponse response, 
                                            string message)
    {
        response.Headers.Add("Application-Error", message);

        response.Headers.Add("Access-Control-Expose-Headers", 
                                         "Application-Error");

        response.Headers.Add("Access-Control-Allow-Origin", "*");
    }
}

Чтобы отловить ошибки, я создал error.interceptor.ts, который будет обрабатывать ошибки, отправленные из бэкэнда:

@Injectable()
export class ErrorInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): 
  Observable<HttpEvent<any>> {
    return next.handle(req).pipe(
        catchError(error => {
    if (error instanceof HttpErrorResponse) {

        const applicationError = error.headers.get('Application-Error');
                if (applicationError) {
                    console.error(applicationError);
                    return throwError(applicationError);
                }
     const serverError = error.error.errors; 

                let modalStateErrors = '';
                if (serverError && typeof serverError === 'object' ) {
                    for (const key in serverError) {
                        if (serverError[key]) {
                            modalStateErrors += serverError[key] + `\n`;
                        }
                    }
                }

    return throwError(modalStateErrors || serverError || 'Server Error');
            }
        })
    );
    }
}
//add this method to provider in app.module.ts to get everything work 
export const ErrorProvider = { 
    provide: HTTP_INTERCEPTORS,
    useClass: ErrorInterceptor,
    multi: true
};

serverError будет содержать все исключения, а метод регистрации в компоненте регистра будет отображать ошибки на консоли, все работает так, как я ожидал, за исключением запроса 400 Bad, определенного в методе регистрации в AuthController. Теперь он возвращает "Ошибка сервера", но я ожидал, что "Имя пользователя уже существует!"

Я использую .net-core 2.2 и совершенно новичок в angular. Буду признателен за любую идею, которая поможет мне решить эту проблему :-)

0
TamTam 22 Окт 2019 в 17:51

1 ответ

Лучший ответ

После доработки кода

Проблема была в interceptor из-за оператора return, и она была решена с помощью:

@Injectable()
export class ErrorInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): 
  Observable<HttpEvent<any>> {
    return next.handle(req).pipe(
        catchError(error => {
    if (error instanceof HttpErrorResponse) {

        const applicationError = error.headers.get('Application-Error');
                if (applicationError) {
                    console.error(applicationError);
                    return throwError(applicationError);
                }
     const serverError = error.error.errors; 

                let modalStateErrors = '';
                if (serverError && typeof serverError === 'object' ) {
                    for (const key in serverError) {
                        if (serverError[key]) {
                            modalStateErrors += serverError[key] + `\n`;
                        }
                    }
                }

    return throwError(modalStateErrors || serverError || error.error ); 
            }
        })
    );
    }
}
1
Youssef Tounoussi 22 Окт 2019 в 15:26