Angular GET http://localhost/ 401（未经授权）错误

Question

我在将用户数据加载到页面时遇到问题。我收到此错误：GET http://localhost/ 401（未经授权）。

在 Laravel 中，我将其放入我的控制器以获取所有用户数据：

public function index()
{
 $user = User::all(); return response()->json($user,201);
}

在 Angular 中，我使用以下代码创建了一个 data.service 文件：

@Injectable({
    providedIn: 'root'
})

export class DataService {
  constructor(private http: HttpClient) { }
  findAll(): Observable<User[]>{return this.http.get<User[]>('http://localhost');}
}

并且在app.component.ts文件中，我使用了这个方法来获取数据：

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent implements OnInit{
  users$: User[];
  constructor(private dataService: DataService){}
  ngOnInit(){return this.dataService.findAll().subscribe(data => this.users$ = data);}
}

在 app.component.html 文件中，我循环了数据：

<div *ngFor='let user of users$'>{{user.name}}</div>

Answer 1

这是 angular 或 laravel 返回的错误吗？另请注意以下事项：

您没有在本地主机上指定端口
您将 user$ 定义为数组而不是可观察对象，因此异步管道将不起作用，相反您可以将 user$ 声明为可观察对象或删除异步管道。

这是更好的解决方案：

export class AppComponent implements OnInit{
  users$: Observable<User[]>;
  constructor(private dataService: DataService){}
  ngOnInit(){
    this.user$ = this.dataService.findAll()
  }
}

并在 HTML 中保持当前代码不变：

<div *ngFor='let user of users$'>{{user.name}}</div>

Angular GET http://localhost/ 401（未经授权）错误

Angular GET http://localhost/ 401 (Unauthorized) error

http

http-status-code-401

laravel

angular