Apigee + Angular否请求资源上存在“Access-Control-Allow-Origin”标头

时间:2017-12-29 14:14:51

标签: angular cors apigee angular5

上午;

也许这个问题在100次之前被问过,但实际上我无法解决它。 我在Apigee中有这个配置来响应OPTIONS请求。

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<AssignMessage async="false" continueOnError="false" enabled="true" name="AM-AddCors">
    <DisplayName>AM-AddCors</DisplayName>
    <Properties/>
    <Add>
        <Headers>
            <Header name="Access-Control-Allow-Origin">*</Header>
            <Header name="Access-Control-Allow-Headers">Content-Length, Content-Disposition, Origin, x-requested-with, Accept, Content-Type, Authorization</Header>
            <Header name="Access-Control-Max-Age">3628800</Header>
            <Header name="Access-Control-Allow-Methods">GET, PUT, POST, DELETE</Header>
        </Headers>
    </Add>
    <IgnoreUnresolvedVariables>true</IgnoreUnresolvedVariables>
    <AssignTo createNew="false" transport="http" type="request"/>
</AssignMessage>

在客户端,我使用Angular(HttpClient)进行此调用

public downloadS2Report(url) {
    let headers = new HttpHeaders();
    let fullurl = environment.config.fundsApi.concat(url);
    headers = headers.set("Authorization", "Bearer *****");
    return this.http.get(fullurl, {headers: headers})
      .map((response:any) => {
        if (response.status == 200) {
          var contentType = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
          var blob = new Blob([(<any>response)._body], {type: contentType});
          return blob;
        }    
      });
  }

我可以在chrome的调试视图中看到结果但是我得到了Angular的着名错误“Access-Control-Allow-Origin”标题出现在请求的资源上“。我是否错过了Apigee配置中的一个参数?

enter image description here

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:2)

您需要回复所有回复的相关CORS标题,而不仅仅是OPTIONS转机前请求。因此,在您的GET回复中,您还需要:

<Headers>
        <Header name="Access-Control-Allow-Origin">*</Header>
        <Header name="Access-Control-Allow-Headers">Content-Length, Content-Disposition, Origin, x-requested-with, Accept, Content-Type, Authorization</Header>
        <Header name="Access-Control-Max-Age">3628800</Header>
        <Header name="Access-Control-Allow-Methods">GET, PUT, POST, DELETE</Header>
    </Headers>