Java JSF2.2和PrimeFaces4.0：文件上传后刷新图像

在我的应用程序中，我使用JSF2.2和PrimeFaces4.0。我有一个上载新图像的功能，需要更新现有图像。有时在上载新图像后，旧图像可能仍会显示，这可能是因为缓存或重新渲染问题。我可以看到这种情况在像2500x1600这样的高分辨率图像中尤其常见。这可以在IE、Chrome和Firefox中复制。以下是我的Primefaces组件：

<h:panelGroup id="mr-img-panel">
    <h:outputLink id="mr-image-link" target="_blank" process="@this"
                  value="#{myBean.image}"
                  rendered="#{myBean.image ne null}">
        <p:graphicImage id="mr-image" value="#{myBean.image}"
                        cache="false"
                        title="Title" styleClass="image-preview" />
    </h:outputLink>
</h:panelGroup>

<h:panelGroup styleClass="upload-view">
    <p:fileUpload id="mr-upload"
                  fileUploadListener="#{myBean.handleFileUpload}"
                  mode="advanced"
                  auto="true"
                  label="Upload new image"
                  dragDropSupport="true"
                  invalidFileMessage="#{msg['msg.invalid.filetype']}"
                  messageTemplate=" "
                  invalidSizeMessage="#{msg['msg.invalid.filesize']}"
                  update="mr-upload-messages, mr-img-panel"
                  sizeLimit="2097152"
                  allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
                  styleClass="upload-view-button"
                  oncomplete="setTimeout(function() { $('[id$=mr-upload-messages]').hide(1000); }, 2000);">
        <f:attribute name="someId" value="#{some.id}" />
    </p:fileUpload>

    <p:messages id="mr-upload-messages" showDetail="true" showSummary="false" closable="true"/>

但那没用。我尝试了几种不同的技术，其中一些技术出现了问题，如中所述。正如本文所述，我编写了一个FileUploadRenderer：

public class CustomFileUploadRenderer extends FileUploadRenderer {

    @Override
    public void decode(final FacesContext context, final UIComponent component) {
        if (context.getExternalContext().getRequestContentType().toLowerCase().startsWith("multipart/")) {
            super.decode(context, component);
        }
    }
}

下面是我为这些类添加到faces-config.xml的内容：

<lifecycle>
    <phase-listener id="nocache">com.example.CacheControlPhaseListener</phase-listener>
</lifecycle>

<render-kit>
    <renderer>
        <component-family>org.primefaces.component</component-family>
        <renderer-type>org.primefaces.component.FileUploadRenderer</renderer-type>
        <renderer-class>com.example.CustomFileUploadRenderer</renderer-class>
    </renderer>
</render-kit>

com.example.CacheControlPhaseListener
org.primefaces.component
org.primefaces.component.FileUploadRenderer
com.example.CustomFileUploadRenderer

---

但问题依然存在。上传新图像后，旧图像不会被AJAX刷新，只有在刷新页面后才能看到。

如果有人需要，似乎更新到Primefaces 5.0已经为我解决了这个问题。

按照本教程更新

的

更新
属性以添加
@this
，
更新=“@this mr upload messages mr img panel”
。
<lifecycle>
    <phase-listener id="nocache">com.example.CacheControlPhaseListener</phase-listener>
</lifecycle>

<render-kit>
    <renderer>
        <component-family>org.primefaces.component</component-family>
        <renderer-type>org.primefaces.component.FileUploadRenderer</renderer-type>
        <renderer-class>com.example.CustomFileUploadRenderer</renderer-class>
    </renderer>
</render-kit>