iis 为什么我会得到状态为0的未知错误- Angular Universal?

pnwntuvh  于 11个月前  发布在  Angular
关注(0)|答案(1)|浏览(160)

我在生产环境中的请求中有**10%**的错误。

"error": "[ProgressEvent]",
"headers": "[ti]",
"message": "Http failure response for https://api.xxxxxx:5000/api/public-web/files: 0 Unknown Error",
"name": "HttpErrorResponse",
"ok": false,
"status": 0,
"statusText": "Unknown Error",
"url": "https://api.xxxxxx:5000/api/public-web/files"

字符串
来自Sentry

堆栈:
*Angular 15 - Universal
*.Net Core 6

  • 服务器:IIS 10

首先,我认为问题与CORS有关,但尽管我已经在后端配置了CORS,但我还在web-config (IIS)中的服务器上的所有响应头中添加了以下内容:

access-control-allow-headers: *
access-control-allow-methods: GET,POST,PATCH,PUT,DELETE,OPTIONS
access-control-allow-origin: *


我在web.config中使用上述自定义头文件在IIS上介绍了CORS,而不是在应用程序端。
我也读到过,这可能与糟糕的互联网连接有关(根据Angular官方文档),但这不是问题(也许,但只是10%的情况下的1%)。
用户尝试将其网络连接从WIFI更改为移动的,但仍然出现相同的问题。

mwecs4sa

mwecs4sa1#

我也遇到过同样的情况。Angular + CORS正确配置+大量的Sentry问题与“HTTP 0未知错误”。
这是在某些用户的互联网/Wi-Fi连接不稳定/不好导致某些请求失败时发生的。
我通过实现一个重试拦截器来重试那些失败的请求,从而减少了这些错误,从而提高了UX:

import { HttpErrorResponse, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { retry, timer } from 'rxjs';

// These variables have to stay outside the class because of 'this' keyword binding issues
const maxRetries = 2;
const delayMs = 2000;

@Injectable()
export class RetryInterceptor implements HttpInterceptor {
  intercept(request: HttpRequest<unknown>, next: HttpHandler) {
    // Pass the request to the next request handler and retry HTTP 0 errors 2 times with a 2-second delay
    return next.handle(request).pipe(retry({ count: maxRetries, delay: this.delayNotifier }));
  }

  delayNotifier(error: any, retryCount: number) {
    if (error instanceof HttpErrorResponse && error.status === 0) {
      return timer(delayMs);
    }

    // re-throw other errors for anything else that might be catching them
    throw error;
  }
}

字符串
即使使用这个重试拦截器,你也总会遇到一些这样的错误,因为我们无法控制用户的互联网连接:)

相关问题