Chrome插件无法禁用CORS限制,或者我的请求有问题

时间:2019-10-22 19:16:13

标签: angular api cors preflight

我正在尝试构建一个使用Jira服务器API的应用程序。我来自本地主机的请求被CORS策略阻止。

Access to XMLHttpRequest at 'https://jira.company.com/rest/api/2/user?username=myname@company.com' from origin 'http://localhost:4200' has been blocked by CORS policy: Request header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response.

我读到,Chrome extension可以通过调整请求标头来规避CORS限制。但是我似乎没有使其工作。

enter image description here

在图像中,您可以看到我已将扩展名设置为“开”,但是在预检OPTIONS请求上该请求仍然失败。
关于此请求的事情还在于,我在标头中将Access-Control-Allow-Credentials设置为true,但是此预检请求说它已设置为false。那让我觉得我的代码有问题,因为我对发出API请求,设置标头和所有内容也很缺乏经验。

logIn( email: string, password: string ): Observable<any> {
  const authKey = btoa( `${email}:${password}` );
  const headers = new HttpHeaders( {
    Authorization: `basic ${authKey}`,
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Credentials': 'true'
  } );
  const params  = new HttpParams().set( 'username', email );
  return this.http.get( 'https://jira.company.com/rest/api/2/user', { headers, params } ).pipe( map( ( user: any ) => {
    if ( user ) {
      localStorage.setItem( 'currentUser', JSON.stringify( { user: { authKey } } ) );
    }
  } ) );
}

注意:我正在构建Angular应用

谁能告诉我是什么阻止了我发出请求?

1 个答案:

答案 0 :(得分:1)

不允许您使用javascript设置CORS标头。而且cors标头必须是响应而非请求标头。考虑使用api代理。 Here是本地开发的一个例子。