Javascript 正确处理嵌套承诺拒绝

我试图做的是，首先从输入中获取文件，然后使用文件读取器读取文件，然后获取图像高度和宽度（如果它是有效的图像文件）

从

imageProcess

中，它通过拒绝无效文件类型的承诺来显示错误。我担心的是，当

imageProcess

被拒绝时，我也想从

readerProcess

中拒绝。在这里，我无法拒绝来自

readerProcess

，因为我正在捕获

imageProcess

以解析

readerProcess

  const target = e.target.name;


  readerProcess(file)
    .then(res => {console.log('reader resuld', res)},
      err => {console.log('error')}
    )

const readerProcess = (file) => {
  return new Promise((resolve, reject) => {
    let reader = new FileReader();
    if(file) reader.readAsDataURL(file);
    reader.onload = () => resolve(imageProcess(reader)
      .then(image => {
          return {
            data: reader.result,
            width: image.width,
            height: image.height
          }
        },
        err => reject //i want to reject from here too but catching it from resolve, so it is not rejecting
      ))

  })
}

const imageProcess = (reader) => {
  return new Promise((resolve, reject) => {
    let img = new Image()
    img.onload = () => resolve(img)
    img.onerror = reject // first reject from here
    img.src = reader.result
  })
}```

---

我想通过使用一个函数来简化一下，该函数的唯一任务是在

readFileAsDataURL

周围放置一个承诺包装器：

// Promise wrapper for FileReader.prototype.readFileAsDataURL
const readFileAsDataURL(file) {
  return new Promise((resolve, reject) => {
    if (!file) {
      throw new Error("No file given");
    }
    const reader = new FileReader();
    reader.onload = () => resolve(reader.result);
    reader.onerror = reject;
    reader.readAsDataURL(file); // Note: Do this after attaching the handlers, not before
  });
};

我还要修改

imageProcess

以接受

src

，而不是

文件阅读器

：

const imageProcess = (src) => {
  return new Promise((resolve, reject) => {
    const img = new Image();
    img.onload = () => resolve(img);
    img.onerror = reject;
    img.src = src;
  });
};

然后，您的

readerProcess

函数将承诺链接在一起：

const readerProcess = (file) => {
  return readFileAsDataURL(file)
  .then(imageProcess);
};

用法如您所示：

readerProcess(file).then(
  res => {console.log('reader resuld', res)},
  err => {console.log('error')}
);

---

const readerProcess=（file）=>{return readFileAsDataURL（file）.then（imageProcess）；}图像处理src是如何得到的？我是不是应该明确地提供它或者它是自动获取的？@Md.JahidulIslam-之所以发生，是因为
。然后（imageProcess）
将
imageProcess
传递到
中，然后将其设置为履行处理程序。当承诺实现时，将使用一个参数调用实现处理程序：实现值。在这种情况下，
readFileAsDataURL
的履行值是数据URL（即
src
），履行处理程序是
imageProcess
.then（imageProcess）
基本上是
.then（url=>imageProcess（url））
但没有不必要的（在本例中）包装函数。