Angular

Question

我正在为我的大学制作一个带有 java 后端的 angular 12 应用程序。我正在测试 angular 的 http 客户端，但我无法发出任何请求，因为它被 CORS 阻止了。首先，我尝试向我的后端服务器发出 POST 请求，但没有成功。 Angular代码：

const API_URL = 'http://localhost:9080'

@Injectable({
  providedIn: 'root'
})

export class AuthService {

  constructor(private http:HttpClient, private router:Router) { }

  login(user:User) { 
    this.http.post(`${API_URL}/login`, user, {observe:'response'}).subscribe(result => { 
      console.log(result)
    })
  }

The response was this.

所以，我搜索了一下，发现这大部分是服务端的，虽然我在Insomnia/Postman中可以正常发出请求，但我尝试在我的server.xml.[=14=上配置cors ]

但后来我有了尝试使用外部 API 的想法。我尝试向 Google 发出 GET 请求，只是为了取回：

Response from google

每个外部 API 都会出现这种情况，所以我认为问题不在服务器端，而是 Angular，但我找不到任何解决方案不能说是服务器端的问题，但也不能是因为我不能向任何网站发出任何请求，对吗？

Answer 1

虽然你的Backend和Frontend看似同源，其实不然

These are not same origin because they use different ports:
http://example.com:80
http://example.com:8080

Two URLs have the same origin if the protocol, port (if specified), and host are the same for both.

修复 CORS 总是在服务器端完成。基本上，出于安全原因，浏览器不允许您从与托管前端的位置不同的脚本发出请求。 Read in detail here

对于开发，您可以禁用浏览器 CORS 检查。您可以下载浏览器扩展来执行此操作或使用 chrome 标志。

"--user-data-dir=/tmp/chrome-sesh", "--disable-web-security"

Angular - 每个请求都被 CORS 阻止

Angular - Every request is being blocked by CORS

api

integration

cors