Question

我正在进行JSONP调用，并且需要在授权标头中传递承载令牌。但是，尽管我的代码添加了标头，但是请求中没有添加授权标头（请在Fiddler中查看）。该代码利用了Angular 2和TypeScript。这是我的代码 -

    let headers = new Headers({ 'Authorization': 'Bearer ' + token  });
    let options = new RequestOptions({ headers: headers, withCredentials: true });
    this.url = "http://api.azurewebsites.net/api/search/" + params;

    return this.jsonp.request(this.url, options)  
        .map(this.extractData)
        .catch(this.handleErrorObservable);

我在这里缺少什么？。

Answer 1

如果您使用的是JSONP，则无法使用Authorization标头进行授权。相反，除非您配置其他一些授权方法，否则您从其返回JSONP的端点必须响应来自任何地方的请求，而不需要Authorization标头。

您无法在请求中添加Authorization标头的原因是，如果您使用的是JSONP，则无法将任何请求标头添加到请求中。这是因为JSONP的工作原理是在文档中添加script元素，然后将请求URL设置为该src元素的script属性的值。

因此，您无法将请求标头添加到浏览器用于获取该script元素的网址的请求中 - 只需为任何其他script元素添加请求标头。

如果您想要使用Authorization - 标头要求授权，则需要使用常规方法（如XHR或Fetch API）或Angular（正常$http.get(…)）来发出请求。

在这种情况下，需要启用API端点并提供完整的CORS支持，包括支持CORS preflight OPTIONS request由于Authorization请求标头的存在，浏览器将自动生成{{3}}在请求中。

授权标头未在Angular 2 JSONP请求中发送

1 个答案: