断开连接时可以用 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);*/
在下一个代码中,我想从 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);*/