Angular 5 HttpClient.put执行两个请求

Question

我正在使用Angular 5构建PWA。并且在重复执行PUT请求时遇到问题。我也在运行POST和GET请求，但只有PUT才会出现此错误。

这是方法

put(url: string, data: string): Observable<any> {
  console.log('put');
  const options = {
    headers: new HttpHeaders({
      'Content-Type': 'text/xml'
    })
  };
  return this.http
    .put(url, data, options).map(resp => {
      console.log('put_output');
      return resp;
    });
}

当此方法仅运行一次时，它会发出两个请求。

网络标签截图：

控制台输出截图：

我试图运行简单的XMLHttpRequest，它很完美：一个请求，一个响应。

Answer 1

第一个请求是Preflighted Request，这种行为没问题，有些开发人员称之为“与服务器握手”。

来自DOCS：

  

“预检”请求首先通过OPTIONS发送HTTP请求   方法到其他域上的资源，以便确定   实际请求是否可以安全发送。跨站点请求   这样预检，因为它们可能会对用户数据产生影响。

您还可以查看问题here。