断开连接时可以用 http.get 替换 URL - HttpClient - Angular

It's possible to replace an URL when disconnected with http.get - HttpClient - Angular

在下一个代码中,我想从 API 获取数据。每隔 5 秒,数据就会以 CSV 文件的形式接收,我利用该值在网站上显示。

问题是,当我断开以太网端口时,连接丢失,这是逻辑。问题是我的脚本工厂,唯一的解决办法是重新加载页面。

事实上,当 URL 断开连接时,我想用我资产中的另一个 url 替换它,例如“assets/donnee_error.csv”。有可能吗?

提前致谢!

拔掉以太网端口时的错误:

GET https://192.168.0.2/DataLogs?Path=/DataLogs/MyDataLog10.csv&Action=DOWNLOAD&E=1 net::ERR_NETWORK_CHANGED

HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: "https://192.168.0.2/DataLogs?Path=/DataLogs/MyDataLog10.csv&Action=DOWNLOAD&E=1", ok: false, …}
error: ProgressEvent {isTrusted: true, lengthComputable: false, loaded: 0, total: 0, type: "error", …}
headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, headers: Map(0)}
message: "Http failure response for https://192.168.0.2/DataLogs?Path=/DataLogs/MyDataLog10.csv&Action=DOWNLOAD&E=1: 0 Unknown Error"
name: "HttpErrorResponse"
ok: false
status: 0
statusText: "Unknown Error"
url: "https://192.168.0.2/DataLogs?Path=/DataLogs/MyDataLog10.csv&Action=DOWNLOAD&E=1"
__proto__: HttpResponseBase

我的代码:

@Injectable()
export class LineService{

  constructor(private http: HttpClient) {
    this.getData();
  }
  lineSubject = new BehaviorSubject<RcvData[]>([]);

  async getData(): Promise<void> {

    const listForTest: string[] = [
      'assets/donnee-l1.csv',
      'assets/donnee-l1.csv',
      'assets/donnee-l3.csv',
      'assets/donnee-l4.csv',
      'assets/donnee-l5.csv',
      'https://192.168.0.2/DataLogs?Path=/DataLogs/MyDataLog10.csv&Action=DOWNLOAD&E=1'
    ];

    let reqs$ = lists.map(list => this.http.get(list, {responseType: 'text'}));

    timer(0, 5000).pipe(
      switchMap(_ => forkJoin(reqs$))
    ).subscribe(listResults => {
      const parsedListResults = listResults.map(data => {
        const csvToRowArray = data.split('\n');
        const lastRow = csvToRowArray[csvToRowArray.length - 2];
        const row = lastRow.split(',');
        return new RcvData(
          parseInt(row[0], 10),
          row[1], row[2], 
        ...
          parseInt(row[17], 10)
        );
      });

      this.lineSubject.next(parsedListResults);
    });
  }
}

class RcvData{
  seqNo: number;
  ...
  status: number;

  constructor(
    seqNo: number,
    ...
    status: number)
  {
    this.seqNo = seqNo;
    ...
    this.status = status;
  }
}

我找到了通过不同验证绕过错误的解决方案:

    const listForTest: string[] = [
      'assets/donnee-l1.csv',
      'assets/donnee-l1.csv',
      'assets/donnee-l3.csv',
      'assets/donnee-l4.csv',
      'assets/donnee-l5.csv',
      //'https://192.168.0.2/DataLogs?Path=/DataLogs/MyDataLog10.csv&Action=DOWNLOAD&E=1',
      'assets/donnee-l6.csv'
    ];
    const lists: string[] = [
      'assets/donnee-l1_error.csv',
      'assets/donnee-l2_error.csv',
      'assets/donnee-l3_error.csv',
      'assets/donnee-l4_error.csv',
      'assets/donnee-l5_error.csv',
      'assets/donnee-l6_error.csv'];


///////////////////////////////////////////////CHANGER LISTFORTEST
    let reqs$ = listForTest.map(list => this.http.get(list, {responseType: 'text'}));

    /*setInterval(async () => {
      for (const urlPos in listForTest) {
        const existe = await urlExist(listForTest[urlPos]);
        if (existe) {
          lists[urlPos] = listForTest[urlPos];
        } else {
          const numLigne: number = parseInt(urlPos, 10) + 1;
          lists[urlPos] = 'assets/donnee-l' + numLigne + '_error.csv';
        }
      }
      reqs$ = lists.map(list => this.http.get(list, {responseType: 'text'}));
    }, 5000);*/