我无法向自己的 Spring 引导服务器发出 Angular Http 请求

Posted 2023-03-04

【中文标题】我无法向自己的 Spring 引导服务器发出 Angular Http 请求

【英文标题】：I am having trouble to make a Angular Http Request to my own Spring boot server

【发布时间】：2020-05-31 21:12:23

【问题描述】：

我现在正在学习使用 Angular 的前端和使用 Spring Boot 的后端，当我尝试从后端获取数据时遇到问题。

角度代码：

ngOnInit() 

    this.http.get('http://127.0.0.1:8081/products').toPromise().then((data) => 
      console.log(data);
    );
  

后端工作正常，因为我尝试使用Postman 获取数据，它工作正常。

还将 URL(http://127.0.0.1:8081/products) 直接复制到我的浏览器中，效果很好。

但是当我尝试从例如JSONPlaceholder 请求数据时，它可以很好地与 angular http get 函数配合使用。

ngOnInit() 

    this.http.get('http://jsonplaceholder.typicode.com/todos/1').toPromise().then((data) => 
      console.log(data);
    );
  

JSONPlaceholder 请求的结果：

  "userId": 1,
  "id": 1,
  "title": "delectus aut autem",
  "completed": false

我希望这些额外的信息可以帮助你帮助我。

最后但并非最不重要的错误消息：

【问题讨论】：

您听说过 CORS 吗？

简而言之，您的网站（客户端）正在处理某个来源（例如localhost:4200），并且它正在向不同的来源（例如localhost:8081）发出请求。默认情况下，大多数服务器不接受来自国外的请求。检查此以获取有关在 Spring 中启用 CORS 的更多信息：***.com/questions/51720552/…

Angular 在客户端运行，因此，您必须通过在服务器端启用 CORS 来为您的主机添加权限

这能回答你的问题吗？ Why doesn’t Postman get a "No 'Access-Control-Allow-Origin' header is present on the requested resource" error when my javascript code does?

【参考方案1】：

感谢所有帮助的人，我为所有遇到类似问题的人找到了答案。

所以基本上我忘了在后端的 rest 控制器中添加这个注解。

@CrossOrigin(origins = "*", maxAge = 3600)