按顺序发出可观察量，直到第一次返回错误

Question

我有一个情况，有时返回未知数量的图像链接。 图片网址将始终以"p[页码].png"结尾，例如：p1.png、p2.png等。

我想做的是遍历 10 个最大项目并从服务器获取图像，直到返回第一个 404 - 然后我想存储"有问题"的项目。

最好的方法是什么？ 我想使用 forkJoin，但随后它会立即发出数组的所有成员，我没有"有问题"请求的痕迹。

谢谢！

Answer 1

我结束了从图像加载和错误事件中创建 2 个可观察的，合并它们并订阅。对于任何寻找类似解决方案的人，以下是代码：

updatePages(pdfPages: PdfImgPage[]){
if(this.utilService.pagesAmountUnknown){
let imgUrls = [];
pdfPages.forEach(page => { imgUrls.push(this.utilService.getImgUrl(page.imgSrc))});
let imgAmount = 0;
from(imgUrls)
.pipe(
concatMap(url => {
let img = new Image();
img.src = url;
const load = fromEvent(img, 'load').pipe();
const error = fromEvent(img, 'error').pipe(switchMap(errorEvent => throwError(errorEvent)));
return merge(load,error).pipe(take(1)); //to not wait for completion
})
)
.subscribe(
img => {
this.logger.debug(`IMAGE in CONCAT MAP`, img);
imgAmount++;
},
error => {
this.logger.debug(`ERROR in CONCAT MAP imgAmount=${imgAmount}`, error);
this.completeFunc(imgAmount);
},
() => {
this.logger.debug(`COMPLETE in CONCAT MAP`);
}
);
}