JSF 2.0文件上传

时间:2011-03-24 11:20:47

标签: jsf file-upload jsf-2

我正在浏览一些博客,试图找到如何使用JSF 2.0上传文件 但所有的解决方案都让我感到困惑。我想知道我需要什么才能成功上传文件(MP3,PDF,视频......什么类型)并将其作为@Lob存储在数据库中。 这是我到目前为止所做的:

  • 我创建了一个具有byte []类型属性的实体,并且还使用@Lob注释进行了注释。

  • 我创建了一个EJB,它将使用一个byte []作为参数的方法引入实体,并使用EntityManager类(persist方法)将其插入数据库。

  • 我创建了一个JSF页面,其输入标签类型为“file”,提交按钮

  • 我准备了一个托管bean,用JSF页面交换有关该文件的信息。

现在我被困住了,我有很多疑惑:

  • 如何将文件从JSF传递到托管bean,然后将其转换为byte [](能够将其处理到EJB)?

  • servlet如何帮助我?

  • 我需要一个servlet吗?

  • 另外我发现在一些博客中它提到了一些关于servlets 3.0的东西,但是我不知道我的工作环境是否正在使用它,如果我使用servlets 3.0(我使用的是JEE6)怎么办? / p>

之前我从未进行过文件上传,而且我对servlet也不是很熟悉。我很困惑,有人可以给我一些启动技巧吗?

8 个答案:

答案 0 :(得分:69)

首先,这个(旧)问题和答案假定为JSF 2.0 / 2.1。从JSF 2.2开始,有一个本地<h:inputFile>组件,而不需要第三方组件库。另请参阅How to upload file using JSF 2.2 <h:inputFile>? Where is the saved File?


最简单的方法是使用Tomahawk for JSF 2.0。它提供了<t:inputFileUpload>组件。

这是一个循序渐进的教程:

  • 为Servlet 3.0和JSF 2.0创建一个空白的动态Web项目。 web.xml必须符合Servlet 3.0规范,并且已经包含JSF servlet:

    <?xml version="1.0" encoding="UTF-8"?>
    <web-app 
        xmlns="http://java.sun.com/xml/ns/javaee"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
        id="YourProjectName" version="3.0">
    
        <display-name>Your Project Name</display-name>
    
        <servlet>
            <servlet-name>Faces Servlet</servlet-name>
            <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
            <load-on-startup>1</load-on-startup>
        </servlet>
        <servlet-mapping>
            <servlet-name>Faces Servlet</servlet-name>
            <url-pattern>*.xhtml</url-pattern>
        </servlet-mapping>
    
    </web-app>
    

    faces-config.xml必须遵守JSF 2.0规范:

    <?xml version="1.0" encoding="UTF-8"?>
    <faces-config
        xmlns="http://java.sun.com/xml/ns/javaee"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd"
        version="2.0">
    
    </faces-config>
    

  • 下载Tomahawk 1.1.10 for JSF 2.0。解压缩zip文件,转到/lib文件夹,将所有*.jar文件复制到/WEB-INF/lib

    这是18个文件,其中batik*.jarxml*.jar对于单独使用t:inputFileUpload组件是不必要的。你可以把它们留下来。


  • web.xml中配置Tomahawk扩展名过滤器。负责处理multipart/form-data请求的人员需要能够通过HTTP发送文件。

    <filter>
        <filter-name>MyFacesExtensionsFilter</filter-name>
        <filter-class>org.apache.myfaces.webapp.filter.ExtensionsFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>MyFacesExtensionsFilter</filter-name>
        <servlet-name>Faces Servlet</servlet-name>
    </filter-mapping>
    

    请注意,<servlet-name>必须与您在<servlet-name>中定义的FacesServlet的确切web.xml相匹配。


  • 创建一个简单的Facelet upload.xhtml

    <!DOCTYPE html>
    <html lang="en"
        xmlns="http://www.w3.org/1999/xhtml"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:t="http://myfaces.apache.org/tomahawk"
        xmlns:ui="http://java.sun.com/jsf/facelets">
        <h:head>
            <title>Tomahawk file upload demo</title>
        </h:head>
        <h:body>
            <h:form enctype="multipart/form-data">
                <t:inputFileUpload value="#{bean.uploadedFile}" />
                <h:commandButton value="submit" action="#{bean.submit}" />
                <h:messages />
            </h:form>
        </h:body> 
    </html>
    

    请注意enctype="multipart/form-data"上的<h:form>属性,这对于能够使用HTTP发送文件非常重要。


  • 创建一个简单的托管bean com.example.Bean

    package com.example;
    
    import java.io.IOException;
    
    import javax.faces.application.FacesMessage;
    import javax.faces.bean.ManagedBean;
    import javax.faces.bean.RequestScoped;
    import javax.faces.context.FacesContext;
    
    import org.apache.commons.io.FilenameUtils;
    import org.apache.myfaces.custom.fileupload.UploadedFile;
    
    @ManagedBean
    @RequestScoped
    public class Bean {
    
        private UploadedFile uploadedFile;
    
        public void submit() throws IOException {
            String fileName = FilenameUtils.getName(uploadedFile.getName());
            String contentType = uploadedFile.getContentType();
            byte[] bytes = uploadedFile.getBytes();
    
            // Now you can save bytes in DB (and also content type?)
    
            FacesContext.getCurrentInstance().addMessage(null, 
                new FacesMessage(String.format("File '%s' of type '%s' successfully uploaded!", fileName, contentType)));
        }
    
        public UploadedFile getUploadedFile() {
            return uploadedFile;
        }
    
        public void setUploadedFile(UploadedFile uploadedFile) {
            this.uploadedFile = uploadedFile;
        }
    
    }
    

那应该是它。按http://localhost:8080/projectname/upload.xhtml打开。

关于你的具体问题:

  

我该怎么做才能将文件从JSF传递给托管bean,然后将其转换为byte [](能够将其处理到EJB)?

上面已经回答了这个问题。

  

servlet如何帮助我?

它能够处理和控制HTTP请求/响应。在JSF环境中,FacesServlet已完成所有工作。

  

我需要一个servlet吗?

在JSF环境中,FacesServlet是必需的。但它已经由API提供,您不需要自己编写一个。但是,为了能够从数据库下载文件,另一个servlet绝对有用。您可以在此处找到一个基本示例:Servlet for serving static content

  

我也发现在一些博客中它提到了一些关于servlets 3.0的东西,但我不知道我的工作环境是否正在使用它,如果我正在使用servlet 3.0(我正在使用JEE6)怎么能?

如果您正在使用像Glassfish 3,JBoss AS 6,Tomcat 7等Servlet 3.0容器,并且web.xml被声明为Servlet 3.0,那么您肯定使用的是Servlet 3.0。 Servlet 3.0是Java EE 6的一部分。

答案 1 :(得分:8)

为了完整起见,我只想提供一个功能齐全的self contained示例,说明如何使用 JSF 2.2,非Ajax和Ajax请求。请记住,JSF 2.2使用不同的命名空间和need to be working with a Servlet 3.0 container(如Tomcat 7.0.x,JBoss AS 6.x和7.x以及GlassFish 3.x)。

<强> fileUpload.xhtml

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:f="http://xmlns.jcp.org/jsf/core">
<h:head />
<h:body>
    <h:form enctype="multipart/form-data">
        <h:inputFile value="#{uploadBean.file}" />
        <h:commandButton value="Post Upload" action="#{uploadBean.upload}" />
    </h:form>
    <h:form enctype="multipart/form-data">
        <h:inputFile value="#{uploadBean.file}" />
        <h:commandButton value="Ajax Upload">
            <f:ajax listener="#{uploadBean.upload}" execute="@form"
                render="countOutput" />
        </h:commandButton>
    <!-- Counts the uploaded items -->
    <h:outputText id="countOutput"
        value="Files uploaded #{uploadBean.filesUploaded}" />
    </h:form>
</h:body>
</html>

<强> UploadBean.java:

@ManagedBean
@ViewScoped
public class UploadBean {

    private int filesUploaded = 0;

    //javax.servlet.http.Part (Servlet 3.0 API)
    private Part file;
    private String fileContent;

    /**
     * Just prints out file content
     */
    public void upload() {
        try {
            fileContent = new Scanner(file.getInputStream())
                    .useDelimiter("\\A").next();
            System.out.println(fileContent + " uploaded");
            filesUploaded++;
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    public int getFilesUploaded() {
        return filesUploaded;
    }

    public Part getFile() {
        return file;
    }

    public void setFile(Part file) {
        this.file = file;
    }
}

另见:

答案 2 :(得分:3)

我建议使用Tomahawk's <t:inputFileUpload>PrimeFaces <p:fileUpload>等组件库。

BalusC也有关于Uploading files with JSF 2.0 and Servlet 3.0.

的好文章

答案 3 :(得分:2)

BalusC的博文:Uploading files with JSF 2.0 and Servlet 3.0是我救的,因为我在使用Spring WebFlow运行RichFaces 4 fileUpload标签时遇到了问题。

值得修改BalusC的代码以使用Spring的MultipartResolver - 您不需要another blog post中的MultipartMap

我是通过修改decode中的FileRenderer方法实现的,如下所示:

    UploadedFile ret = null;

    Object req = context.getExternalContext().getRequest();
    if (req instanceof MultipartHttpServletRequest) {
      MultipartFile file = ((MultipartHttpServletRequest)req).getFile(clientId);

      File temp = null;
      try {
        temp = File.createTempFile("_UPLOAD_", null);
        file.transferTo(temp);

        String name = new File(file.getOriginalFilename()).getName();
        ret = new UploadedFile(temp, name);

      } catch (IOException e) {
        throw new RuntimeException("Could not create temp file.", e);
      }
    } else {
      throw new IllegalStateException("Request is not multipart. Use spring's multipart resolver.");
    }
    // If no file is specified, set empty String to trigger validators.
    ((UIInput) component).setSubmittedValue( ret == null ? EMPTY_STRING : ret);

UploadedFile是一个简单的可序列化POJO,用于将结果返回给支持bean。

答案 4 :(得分:2)

在JSF 2.2中,您可以使用标签轻松上传文件,而无需使用commons-io或过滤器。此标记支持normal和ajax进程。

正常:

    <h:inputFile id="file"  value="#{fileUploadBean.uploadedFile}"/> 
    <h:commandButton id="button" action="#{fileUploadBean.sumbit()}" value="Upload"/>

<强>的Ajax:

    <h:inputFile id="file" value="#{fileUploadBean.uploadedFile}"/> 
    <h:commandButton id="button" value="submit">
      <f:ajax execute="@all" render="@all" onevent="statusUpdate"/>
    </h:commandButton>

按如下方式设计托管bean:

  @Named
  @RequestScoped
  public class FileUploadBean {

   private Part uploadedFile;

  }

答案 5 :(得分:0)

最简单的方法可能就是使用inputFileUpload标记 在MyFaces中找到:

http://myfaces.apache.org/

答案 6 :(得分:0)

IceFaces2.0有一个,http://wiki.icefaces.org/display/ICE/FileEntry尚未尝试实现它,但下载有示例应用程序,它可以在Tomcat 6下运行(servlet 2.5,所以不是JEE6)

答案 7 :(得分:0)

您必须在我们的项目构建路径

中添加commons-fileupload-1.2.1.jar

1.配置web.xml文件:

Web.xml

    <filter>
        <filter-name>PrimeFaces FileUpload Filter</filter-name>
        <filter-class>org.primefaces.webapp.filter.FileUploadFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>PrimeFaces FileUpload Filter</filter-name>
        <servlet-name>Faces Servlet</servlet-name>
    </filter-mapping>
    <mime-mapping>        
        <extension>png</extension>
        <mime-type>image/png</mime-type>
    </mime-mapping>

2。创建ManagedBean

   @ManagedBean
   @SessionScoped
public class FileUploadBean implements Serializable{
public FileUpload (){
}
  private StreamedContent file;
public void loadFile(FileUploadEvent event) throws IOException, InterruptedException {

        InputStream input = new ByteArrayInputStream(event.getFile().getContents());
        file= new DefaultStreamedContent(input, "image/jpg");
    }
}

3.jsf文件(xhtml)

   <h:form enctype="multipart/form-data"> 
         <p:fileUpload fileUploadListener="#{fileUploadBean.file}" sizeLimit="100000" allowTypes="/(\.|\/)(gif|jpe?g|png|bmp)$/"/>
        </h:form>