Primefaces p:graphicImage 动态内容无法加载 404

Posted 2023-03-24

【中文标题】Primefaces p:graphicImage 动态内容无法加载 404

【英文标题】：Primefaces p:graphicImage dynamicContent failed to load 404

【发布时间】：2021-04-15 11:42:51

【问题描述】：

显示 p:graphicImage 动态内容让我已经忙了好几天了。谁能帮帮我，我将不胜感激。

我有一个直接的 p:graphicImage 方法，将 imgage.jpg 的 StreamedContent 加载到一个列表（TreeMap）中。

这是我的 xhtml sn-p:

            <p:dataView var="id"
                value="#fotoViewer.imagesViewTree.entrySet()"
                    gridIcon="pi pi-th-large" listIcon="pi pi-bars">

            <p:dataViewListItem>
                <h:panelGrid columns="2" style="width:100%" columnClasses="">

                    <p:graphicImage value="#id.value.streamedImage"
                        style="max-width: 30vw; max-height: 53vh;" cache="false"
                        stream="true" styleClass="w3-round-xlarge" />

                    <p:outputPanel>
                        <h:panelGrid columns="2" cellpadding="5">
                            <h:outputText value="Id:" />
                            <h:outputText value="#id.key" style="font-weight: bold" />

                            <h:outputText value="naam:" />
                            <h:outputText value="#id.value.naam" style="font-weight: bold" />

                        </h:panelGrid>
                    </p:outputPanel>

                </h:panelGrid>
            </p:dataViewListItem>
        </p:dataView>

我可以在我的浏览器中看到动态内容，就可以判断而言，它看起来不错，这里是：

(img id="cac010:j_id_11:0:j_id_14" src="/cJsfComponents1/faces/javax.faces.resource/dynamiccontent.properties?ln=primefaces&v=8.0&pfdrid=8ca67d0788631c82cdee936b119abf8e&pfdrt=2&pfdrid_c=dfed=false&uid=false&uid -4b5f-80b8-b7868dac9f10" class="w3-round-xlarge" style="max-width: 30vw; max-height: 53vh;")

我不明白为什么服务器不提供 contentStream。它以 http-status-code-404 响应。

提前感谢您的帮助！

【问题讨论】：

查看文档：primefaces.github.io/primefaces/10_0/#/core/…

【参考方案1】：

找到了 8 年前给出的解决方案，这正是我一直在寻找的地方。而且....效果很好！

如何在 ui:repeat 中将 与 DefaultStreamedContent 一起使用？

How to use <p:graphicImage> with DefaultStreamedContent in an ui:repeat?

由于我使用的是 PrimeFaces V8.0，因此对于如何获取图像的 StreamedContent 有一些不同的实现。这是我的 ImageStreamer 方法：

public StreamedContent getStreamedContentOfImage(ByteArrayInputStream bais) 
    StreamedContent graphicImage = null;
    graphicImage = DefaultStreamedContent.builder().contentType("image/png").stream(() -> 
        try 
            return bais;
         catch (Exception e) 
            e.printStackTrace();
            return null;
        
    ).build();

    return graphicImage;

也许它可以帮助将来的人！？

【参考方案2】：

@tandraschko：感谢您的快速回复。您包含的链接是几天前的，也是我的起点。我必须说helas，这是一个非常糟糕的例子！该代码不起作用并且不完整。链接How to use <p:graphicImage> with DefaultStreamedContent in an ui:repeat? 让我走上了正轨。我现在一切都很好，而且我对 PrimeFaces 越来越热情！遗憾的是，并非所有文档都是准确、实际和清晰的设置，并考虑到所有级别的用户！无论如何谢谢！

【讨论】：

我们已经在文档中付出了很多努力，但几乎不可能捕捉到每个组件的每个案例：P 请随时帮助我们改进文档，一切都在 GitHub 中！

现在稍微完善一下：primefaces.github.io/primefaces/10_0/#/components/graphicimage

好的@tandraschko。我很好奇你的抛光！但是您包含的链接在 (primefaces.github.io/primefaces/10_0/#/components/graphicimage) 处给了我“404 File not found”

链接已更改：primefaces.github.io/primefaces/10_0_0/#/components/…

@tandraschko，很好的抛光/增强！谢谢！