angular – 使用HttpClient点击发布请求时触发两个调用

参见英文答案 > duplicate ajax calls in angularjs2个
在代码中添加标题后,重复调用正在发生.找到图像以查看两次发生的呼叫.

AUTH-interceptor.ts

导出类AuthInterceptor实现HttpInterceptor {

intercept(req: HttpRequest<any>,next: HttpHandler): Observable<HttpEvent<any>> {

    const clonedRequest = req.clone({
        headers: req.headers.set('X-CustomAuthHeader','some-auth-token')
    });

    console.log("new headers",clonedRequest.headers.keys());

    return next.handle(clonedRequest);
}

}

Please fine calls log image here..

call log 1

call log 2

这种类型的请求称为预检请求,它对应于调用者和基于HTTP头的Web应用程序之间的协商.

它包括两个阶段：

>浏览器使用与目标请求相同的URL执行OPTIONS请求,以检查它是否有权执行请求.此OPTIONS请求返回标识可以对URL执行的操作的标头.
>如果权限匹配,浏览器将执行请求.

Reference here.