Can’t extract images from epub file by using Epubjs

I build some kind of eBook website with next js and nodejs, I decided that user can upload an epub file and will be able to read it. I exported all texts and imgs with its styles, with text 0 problem. but with images…..

I can even get whole src and info about each image but it’s not being displayed on a website! Shows only its alt and small square(that indicates that by src no img found), my src usually looks like my domain(now it’s http://localhost:3000/Image/(any image name).(image format). but its not being displayed even though those srcs are generated automatically, I tried a lot of stuff, like tried to delete localhost part or maybe change the format etc, nothing worked…

here is my code to extract data from epub:

``
``import ePub from "epubjs";

export default async function getChaptersFromEpub(epub) {
  const book = ePub(epub);
  await book.ready;

  const sectionPromises = [];

  book.spine.each((section) => {
    const sectionPromise = (async () => {
      try {
        const chapter = await book.load(section.href);
        if (!(chapter instanceof Document)) {
          console.error(`Failed to load chapter: ${section.href}`);
          return null;
        }

        // Extract the title dynamically from headings (like h1, h2, etc.)
        let titleElement = chapter.querySelector("h1, h2, h3, h4, h5, h6");
        let title = titleElement?.textContent.trim();
        if (!title) {
          title = section.idref || `Unknown Title`;
        }     
        
        const images = chapter.querySelectorAll("img");
        images.forEach((img) => {
          img.remove()
        }); 

        return {
          title: title,
          html: chapter.body.innerHTML
        };

      } catch (error) {
        console.error(`Error processing chapter: ${section.href}`, error);
        return null;
      }
    })();

    sectionPromises.push(sectionPromise);
  });

  const chapters = await Promise.all(sectionPromises);
  return chapters.filter(chapter => chapter && chapter.html);
}``
``

and display it like that:

{chapters.length > 0 && (
                            <div
                                className={`chapter-content pb-14 flex flex-col md:gap-3 h-full md:text-[17px] text-[1.3vw] lg:overflow-scroll overflow-auto`}
                                ref={contentRef}
                                dangerouslySetInnerHTML={{ __html: chapters[currentChapterIndex].html }}
                            />
                        )}

I would be more than happy if you show me what I can do be able to display those images! you can check by console log how src looks like by yourself but I mentioned above that.