来自后端 url 的 react-pdf 渲染图像不加载图像

Question

我正在尝试使用react-pdf呈现 pdf我面临的问题是我正在使用 URL 显示来自后端服务器的图像。但它在pdf中显示为空白。当我进一步调试时才知道，当我在突出显示的行上放置断点时，图像就会显示出来。从远程 URL 加载图像可能没有时间？

        <Page size="A4" style={styles.page}>
                            {this.state.productsToBeExported.map((product) => {
                                const img = this.getImageSource(product); 
                              //if breakpoint is added here then the images are displayed
                                return (
                                    <View
                                        key={product.productId}
                                        style={styles.section}
                                    >
                                        <Image
                                            style={{
                                                width: imgWidth + "px",
                                                border: "2pt solid #999898",
                                            }}
                                            src={img}
                                        ></Image>
        </View>)
    });
    </Page>


//remote Image Url (Node server)
getImageSource(product) {
     return `${URL}/${this.props.timestamp}/${product.productId}.jpg`;           
}
            

PDF输出

任何帮助将非常感激。

注意：这些图像是在后端即时生成的。所以我不能导入它们。

Answer 1

我遇到了同样的问题，这似乎是react-pdf的问题。.jpeg它似乎只显示带有扩展名的文件