Страница входа в систему не работает в браузере возвращая ошибку 401 но метод работает с почтальоном

---

У меня есть проблема в моем угловом проекте с компонентом login, так как он не загружает страницу входа, а вместо этого показывает следующее:HTTP ERROR 401

Когда я пытаюсь войти в систему с помощью Postman, он работает отлично, поэтому я не понимаю, почему у него такое поведение, так как я не получаю никаких ошибок в консоли или браузере. логин.компонент.ТС:

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { LoginService } from '../services/login.service';
import { first } from 'rxjs/operators';
import {ToastrManager} from 'ng6-toastr-notifications';
@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
loginForm: FormGroup;
loading = false;
submitted = false;
  constructor(private formBuilder: FormBuilder,
    private route: ActivatedRoute,
    private router: Router,
    private loginService: LoginService,
    public toast: ToastrManager, ) { }

  ngOnInit() {
    this.loginForm = this.formBuilder.group({
email: ['', Validators.required],
password: ['', Validators.required]
    });
  }
get loginFormControl() {return this.loginForm.controls; }
onSubmit() {
  this.submitted = true;

  // stop here if form is invalid
  if (this.loginForm.invalid) {
  return;
  }
  this.loading = true;
  this.loginService.login(this.loginFormControl.email.value, this.loginFormControl.password.value)
      .pipe(first())
      .subscribe(
        () => {
          this.toast.successToastr('Login succesfully');
          this.router.navigate(['/']);
        },
        () => {
          this.loading = false;
          this.toast.errorToastr('Something went wrong');
          this.loginForm.reset();
          this.loginForm.setErrors({
            invalidLogin: true
          });
        });

 }
}

логин.обслуживание.ТС:

import { Injectable } from '@angular/core';
import {Register} from '../Models/register';
import { HttpClient, HttpHeaders, HttpErrorResponse} from '@angular/common/http';
import { BehaviorSubject, Observable, throwError } from 'rxjs';
import { map, catchError } from 'rxjs/operators';
import { Router } from '@angular/router';
@Injectable({
  providedIn: 'root'
})
export class LoginService {
   httpOptions = { headers: new HttpHeaders(
    { 'Content-Type': 'application/json',
    'Accept': 'application/json',
    'Authorization': 'Bearer',
    })
};
  userData = new BehaviorSubject<Register>(new Register());
ApiUrl = 'https://localhost:5001';
    constructor(private http: HttpClient, public router: Router) {
    }
    login(email, password) {
      return this.http.post<any>(this.ApiUrl + '/login/login', { email, password}, this.httpOptions
     )
      .pipe(map(response => {
        localStorage.setItem('authToken', response.token);
        this.setUserDetails();
        return response;
      }));
    }
    GetById(id) {
      return this.http.post(this.ApiUrl + '/register/' + id , this.httpOptions);
    }
    doLogout() {
      const removeToken = localStorage.removeItem('access_token');
      if (removeToken == null) {
        this.router.navigate(['/login']);
      }
    }

    // User profile
    setUserDetails() {
      if (localStorage.getItem('authToken')) {
        const userDetails = new Register();
        const decodeUserDetails = JSON.parse(window.atob(localStorage.getItem('authToken').split('.')[1]));
        userDetails.email = decodeUserDetails.sub;
        userDetails.name = decodeUserDetails.name;
        userDetails.isLoggedIn = true;
        userDetails.role = decodeUserDetails.role;
        this.userData.next(userDetails);
      }
    }

    handleError(error: HttpErrorResponse) {
      let msg = '';
      if (error.error instanceof ErrorEvent) {
        // client-side error
        msg = error.error.message;
      } else {
        // server-side error
        msg = `Error Code: ${error.status}\nMessage: ${error.message}`;
      }
      return throwError(msg);
    }
}

login.component.html:

<div class="col-md-6 offset-md-3 mt-5">    
    <div *ngIf="loginForm.errors?.invalidLogin" class="alert alert-danger mt-3 mb-0">    
      Email or Password is incorrect.    
    </div>    
    <div class="card">  
      <div class="card-body">    
        <form [formGroup]="loginForm" (ngSubmit)="onSubmit()">    
          <div class="form-group">    
            <label for="email">Email</label>    
            <input type="text" formControlName="email" class="form-control" autofocus    
              [ngClass]="{ 'is-invalid': submitted && loginFormControl.email.errors }" />    
            <div *ngIf="submitted && loginFormControl.email.errors" class="invalid-feedback">    
              <div *ngIf="loginFormControl.email.errors.required">Email is required</div>    
            </div>    
          </div>    
          <div class="form-group">    
            <label for="password">Password</label>    
            <input type="password" formControlName="password" class="form-control"   
              [ngClass]="{ 'is-invalid': submitted && loginFormControl.password.errors }" />    
            <div *ngIf="submitted && loginFormControl.password.errors" class="invalid-feedback">    
              <div *ngIf="loginFormControl.password.errors.required">Password is required</div>    
            </div>    
          </div>    
          <button [disabled]="loading" class="btn btn-primary">    
            <span *ngIf="loading" class="spinner-border spinner-border-sm mr-1"></span>    
            Login    
          </button>    
        </form>    
      </div>    
    </div>    
  </div>    

LoginController.в CS:

using System;
using System.Collections.Generic;
using System.IdentityModel.Tokens.Jwt;
using System.Linq;
using System.Security.Claims;
using System.Text;
using AnotherAP.Helpers;
using AnotherAP.Models;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Cors;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Extensions.Configuration;
using Microsoft.IdentityModel.Tokens;

// For more information on enabling Web API for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860

namespace AnotherAP.Controllers
{
    [EnableCors("CorsPolicy")]
    [Authorize]
    [ApiController]
    [Produces("application/json")]
    [Route("[controller]")]
    public class LoginController : ControllerBase
    {
        private readonly IConfiguration _config;
        private readonly DataContext _context;
        public LoginController(IConfiguration config,DataContext context)
        {
            _context = context;
            _config = config;
        }
      

        [AllowAnonymous]
        [HttpPost]
        [Route("login")]
        public IActionResult Login([FromBody] Register model)
        {
            IActionResult response = Unauthorized();
            Register user = AuthenticateUser(model.Email,model.Password);
            if (user != null)
            {
                var tokenString = GenerateJWT(user);
                response = Ok(new
                {
                    token = tokenString,
                    userDetails = user,
                });
            }
            return response;
        }

       string GenerateJWT(Register user)
        {
            var securityKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(_config["Jwt:SecretKey"]));
            var credentials = new SigningCredentials(securityKey, SecurityAlgorithms.HmacSha256);

            var claims = new[]
            {
                new Claim(JwtRegisteredClaimNames.Sub, user.Email),
                new Claim("Name", user.Name.ToString()),
                new Claim("role",user.Role),
                new Claim(JwtRegisteredClaimNames.Jti, Guid.NewGuid().ToString()),
            };

            var token = new JwtSecurityToken(
                issuer: _config["Jwt:Issuer"],
                audience: _config["Jwt:Audience"],
                claims: claims,
                expires: DateTime.Now.AddMinutes(30),
                signingCredentials: credentials
            );
            return new JwtSecurityTokenHandler().WriteToken(token);
        }

      public  Register AuthenticateUser(string email,string password)
        {
            if (string.IsNullOrEmpty(email) || string.IsNullOrEmpty(password))
                return null;

            var user = _context.register.FirstOrDefault(x => x.Email == email && x.Password==password);
           
            // check if username exists
            if (user == null)
                return null;
            return user;

        }
       
    }
}

Это поведение начало происходить после того, как я изменил код в контроллере для AutheticateUser (), используя контекст данных вместо объявления списка. До этого он не распознал бы учетные данные, но страница была правильно отображена, вместо этого он не работал бы с почтальоном.Теперь он возвращает 200 Ok с почтальоном, но страница не загружается.Кто-нибудь сталкивался с подобной проблемой и мог знать ее причину?Любая помощь будет оценена по достоинству!С наилучшими пожеланиями!

Что я уже пробовал:

Я попытался установить заголовки локально в login.service.ts в методе login() и объявить значения email и password в виде строк.Я также изменил на одно значение с именем user, но без какой-либо удачи, так как ничего не изменилось.

---