【发布时间】:2018-08-27 21:34:21
【问题描述】:
前端:Angular5
后端:Java(在 Wildfly 8.x 服务器上运行)
在从我的 Angular 应用程序向服务器发出带有 content-type: 'application/json' 的 HTTP POST 请求时,我收到以下错误:
无法加载http://localhost:8080/myk/api/v1/events/addevent: 对预检请求的响应未通过访问控制检查:否 请求中存在“Access-Control-Allow-Origin”标头 资源。因此不允许使用原点“http://localhost:4200” 使用权。响应的 HTTP 状态代码为 403。
这是请求的代码:
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json'
})
};
this.http.post("http://localhost:8080/myk/api/v1/events/addevent",
jsonPayload,
httpOptions).subscribe();
在检查时,我发现不是POST 请求,而是一个OPTIONS 请求(根据this MDN article on CORS and preflighted requests)。
但是,当我使用 Postman 尝试相同的请求时,它工作得非常好。
当我不在服务器上处理 OPTIONS 请求时,Postman 如何不会遇到 OPTIONS 请求的问题?
另外,我能做些什么(同时保持相同的content-type 并且无需修改服务器端代码)来解决这个问题?
注意 1: 尽管this question 解决了相同的问题,但建议的解决方案需要更改内容类型。
注意 2: 当我运行另一个尝试使用 ajax 调用发出 POST 请求的应用程序(不是由我在 Angularjs 中设计的)时,它工作正常。 (我不明白为什么会这样,此外,如果能提供与 angular5 相关的答案,我将不胜感激。我附上了这个注释,以防它有助于找出 Angular5 应用程序的问题)
编辑:这可能有点挑剔,但我特别希望尝试通过修改客户端代码而不是使用扩展或与浏览器相关的任何修改来解决上述问题。但是,如果这些都不可能,我愿意更改服务器端代码。
【问题讨论】:
-
如果您不传递标头,您将不会收到 OPTIONS 调用
-
在这种情况下,我如何指定要发送的数据是 JSON?此外,在 Postman 中,我包含了一个标头,指示内容类型为 application/json(同时选择原始数据作为正文类型),它仍然有效
-
无论如何,您最好接受后端代码中的标头,这只是一行代码。不照顾 CORE 就无法逃脱
-
@RequestMapping(value="/addevent",method=RequestMethod.POST,produces=org.springframework.http.MediaType.APPLICATION_JSON_VALUE) public ResponseEntity<?> addNewEvent( @RequestBody EventDTO event,HttpServletRequest request)这是我当前服务器端代码的方法签名。 Postman 如何仍然能够成功访问它并将 JSON 数据传递到服务器? -
“但是,如果这一切都不可能,我愿意更改服务器端代码。” — 您需要修改服务器端代码。如果您的客户端可以禁用旨在阻止您的客户端代码访问其他网站的安全功能,那将是愚蠢的。
标签: angular cors http-post postman