简体   繁体   English

AngularJS对PUT的无效CORS请求

[英]Invalid CORS request for PUT with AngularJS

I have a mapping in my Spring application that looks like this: 我的Spring应用程序中有一个映射如下:

@PutMapping(path="/test/{id}")
public @ResponseBody Shop putTest(@PathVariable("id") long id,
                                  @RequestBody User user {
....

When trying to call this endpoint with Angular by doing: 尝试通过Angular调用此终结点时:

$http({
   method: 'PUT',
   url: 'https://localhost:8000/api/test',
   data: senddata,
   params:{'id':id},
   headers: {
     "Content-Type": "application/json; charset=utf-8"
   }
})

在此处输入图片说明

Is there something wrong with my request, if so how can I fix it? 我的请求是否有问题,如果可以,该如何解决?

your backend have to know of where requests come. 您的后端必须知道请求来自何处。 just for you test that request, you can expecific where the request cane from, just add that anotation. 只是为了测试该请求,您可以指定请求的来源,只需添加该注释即可。

@CrossOrigin(origins = "http://localhost:9000")
@PutMapping(path="/test/{id}")
public @ResponseBody Shop putTest(@PathVariable("id") long id,
                                  @RequestBody User user {
....

i hope it useful 我希望它有用

Presumably, your Spring app is served on a different port to your angular app? 大概是,您的Spring应用程序在与您的角度应用程序不同的端口上提供服务? To the browser, this counts as a different origin and so requests will fail unless the server's responses contain an Access-Control-Allow-Origin header. 对于浏览器,这被视为不同的来源,因此请求将失败,除非服务器的响应包含Access-Control-Allow-Origin标头。 You will need to configure your spring app accordingly. 您将需要相应地配置spring应用。

This is the browser's Same Origin Policy, which protects users again cross-site request forgery. 这是浏览器的“相同来源策略”,可再次保护用户跨站点的请求伪造。 Eg Imagine an evil mastermind creates a seemingly innocent website called evil.com, which fires off a load of AJAX requests to various banking servers hoping you're logged into one of them (ie you have a non-expired cookie). 例如,想象一下,一个邪恶的策划者创建了一个看似无辜的网站,命名为evil.com,该网站将AJAX请求的负载释放到各种银行服务器,希望您登录其中一个(即,您有未过期的Cookie)。 Unless the banks' servers have their access control header set to allow requests from anywhere (they shouldn't), the requests should fail. 除非银行的服务器的访问控制标头设置为允许来自任何地方的请求(不应),否则请求将失败。 A GET request will actually succeed because the browser doesn't know it shouldn't have sent it until it gets the headers from the response, but the browser will stop the JS code reading the response, so it's OK. GET请求实际上将成功,因为浏览器直到从响应中获取标头才知道它不应该发送该请求,但是浏览器将停止JS代码读取响应,因此可以。 For 'unsafe' requests like POST and PUT, etc. the browser does a pre-flight request first (using the OPTIONS method) to get the headers. 对于POST和PUT等“不安全”请求,浏览器首先会执行飞行前请求(使用OPTIONS方法)以获取标头。 If the domain the page is loaded from isn't included in the list of allowed origins, the unsafe request isn't made. 如果加载页面的域未包含在允许的来源列表中,则不会发出不安全的请求。

This is normal behavior when Origin is not well defined. 当未正确定义Origin时,这是正常行为。

Look at the server side setup. 查看服务器端设置。 Browsers are sending OPTIONS request before your PUT request. 浏览器在您的PUT请求之前发送OPTIONS请求。

Read more about Access-Control-Request-* headers. 阅读有关Access-Control-Request-*标头的更多信息。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM