请求http.GET时发送的Angular2选项方法

请求http.GET时发送的Angular2选项方法,http,cors,angular,Http,Cors,Angular,我正在尝试添加到我的angular2应用程序 public login() { // Set basic auth headers this.defaultHeaders.set('Authorization', 'Basic ' + btoa(this.username + ':' + this.password)); console.log('username', this.username) console.log('password', this.pas

我正在尝试添加到我的angular2应用程序

public login() {
    // Set basic auth headers
    this.defaultHeaders.set('Authorization', 'Basic ' + btoa(this.username + ':' + this.password));

    console.log('username', this.username)
    console.log('password', this.password)
    console.log(this.defaultHeaders)

    // rest is copy paste from monbanquetapiservice
    const path = this.basePath + '/api/v1/development/order';        

    let req = this.http.get(path, { headers: this.defaultHeaders });
    req.subscribe(
        _ => { },
        err => this.onError(err)
    );
}
我希望看到的是一个GET请求,它带有我放入的
授权

但我首先看到的是一个带有以下标题的选项:

OPTIONS /api/v1/development/order HTTP/1.1
Host: localhost:8080
Connection: keep-alive
Access-Control-Request-Method: GET
Origin: http://localhost:3000
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.110 Safari/537.36
Access-Control-Request-Headers: authorization, content-type
Accept: */*
Referer: http://localhost:3000/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-GB,en-US;q=0.8,en;q=0.6,fr;q=0.4
由于我的服务器不允许在此url上使用选项,因此我得到一个错误

我知道有些方法,比如PUT或POST,首先发送一个OPTIONS方法来预处理请求,但是GET没有

为什么angular2的http首先发送选项

谢谢。

这是由浏览器本身生成的CORS飞行前请求

另见
-

服务器需要配置为支持CORS请求,只有在
OPTIONS
请求之后,浏览器才会发送实际的
GET
请求

另见
- -

访问控制允许凭据

指示当凭据标志为true时是否可以公开对请求的响应。当作为飞行前请求响应的一部分使用时,这表示是否可以使用凭据发出实际请求。请注意,简单的GET请求不是预引导的,因此,如果对具有凭据的资源发出请求,如果此标头未随资源一起返回,则浏览器将忽略响应,而不会返回到web内容


这就是CORS的工作方式(使用跨域请求时)。使用CORS,远程Web应用程序(这里是带有域mydomain.org的应用程序)选择是否可以通过一组特定的头来满足请求

CORS规范区分了两种不同的用例:

  • 简单请求。如果我们使用HTTPGET、HEAD和POST方法,则此用例适用。对于POST方法,仅支持具有以下值的内容类型:text/plain、application/x-www-form-urlencoded和multipart/form data
  • 预引导请求。当“简单请求”用例不适用时,会发出第一个请求(使用HTTP选项方法)来检查在跨域请求的上下文中可以做什么
发送选项请求的不是Angular2,而是浏览器本身。这与角度无关

有关更多详细信息,请参阅本文:


看起来这个dup非常相似,足以确保有一个尾随斜杠,正如我在这里发送的
GET
请求中所述,但我仍然有这个飞行前准备。我知道PUT的飞行前方法,有时还有POST方法,但GET不应该有这样的方法。这就是为什么我认为是一些角度的东西在飞行前添加了这个选项,我认为这是因为
授权
标题。。。正因为如此,您遇到的是飞行前请求,而不是简单的请求。事实上,当您有一个自定义标题(不是浏览器在引擎盖下发送的内容)时就是这种情况。如果您有一个不在上面列表中的内容类型,例如application/json,GET请求也会使用飞行前请求。我通过使用text/plain成功地避免了选项请求,即使是JSON源代码。@ThierryTemplier在这里的回答本身就是一个答案。删除默认情况下添加到拦截器中的额外头是罪魁祸首。答案不错,但奇怪的是,当我向GitHub.com API发出HTTP请求时,没有飞行前请求,但当我使用自己的服务API执行此操作时,所有请求都有飞行前请求!你知道原因是什么吗?GitHub可能在响应中提供了预期的头,而你的服务API没有。是的,这是可能的。但是Chrome怎么知道呢?它至少应该发出第一个飞行前请求,以考虑是否根据某些标准发出飞行前请求。参见Thierry关于简单和飞行前请求的回答。