java圖片和文字同時提交到表單的例項程式碼

阿新 • • 發佈：2020-02-04

首先來看如下效果圖片：

表單程式碼：

<form action="/addPro" method="post" enctype="multipart/form-data">

 <a>寵物（或產品）型別：</a><select id="categoryID" name="cid"></select><br/><br/>

 <a>寵物（或產品）名字：</a><input type="text" name="cname"><br/><br/>

 <a>一句話介紹：</a><input type="text" name="introduction"><br/><br/>

 <a>題目：</a><input type="text" name="title"><br/><br/>

 <a>價錢：</a><input type="text" name="price"><br/><br/>

 <a>庫存：</a><input type="text" name="stock"><br/><br/>

 <a>狀態：</a><select name="status">

  <option value="1">在售</option>

  <option value="2">下架</option>

  <option value="3">刪除</option>

 </select><br/><br/>

 <a>頭像設定:</a><input type="file" οnchange="previewFile()" name="fileName">

 <br/>

 <img src="${data.image}" alt="Image preview"/><br/>

 <a>詳細描述(編輯完需要在文字框右上角點儲存)：</a><br/>

 <div id="editor">

  <p>商品詳細描述</p>

  <p>編輯完需要在文字框右上角點儲存</p>

 </div><input type="hidden" name="details" id="detail"><br/><br/>

 <input type="submit" value="新增商品">

</form>

提交表單是採用二進位制方式提交，所以一般用來上傳圖片操作，當在這個表單下同時上傳文字，就會報錯。但是業務需要上傳商品是文字和圖片同時上傳的，所以這裡要用到commons的四個包，使用Maven匯入，如下：

<!-- https://mvnrepository.com/artifact/commons-io/commons-io有關圖片文字同時上傳 -->

 <dependency>

  <groupId>commons-io</groupId>

  <artifactId>commons-io</artifactId>

  <version>2.4</version>

 </dependency>

 <!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload -->

 <dependency>

  <groupId>commons-fileupload</groupId>

  <artifactId>commons-fileupload</artifactId>

  <version>1.3.3</version>

 </dependency>

 <!-- https://mvnrepository.com/artifact/commons-collections/commons-collections -->

 <dependency>

  <groupId>commons-collections</groupId>

  <artifactId>commons-collections</artifactId>

  <version>3.1</version>

 </dependency>

 <!-- https://mvnrepository.com/artifact/commons-beanutils/commons-beanutils -->

 <dependency>

  <groupId>commons-beanutils</groupId>

  <artifactId>commons-beanutils</artifactId>

  <version>1.9.2</version>

 </dependency>

Java程式碼如下：

主要判斷每一個引數的屬性，圖片的則進行圖片處理，文字則進行文字處理。

//新增產品

 @RequestMapping("/addPro")

 public void addPro(HttpServletRequest request,HttpServletResponse response) throws IOException {

  //編碼規範

  response.setContentType("text/html");

//  response.setCharacterEncoding("utf-8");

  Product product = new Product();

 

  //這種方法主要通過if (item.isFormField())這個條件判別檔案還是非檔案

  DiskFileItemFactory factory = new DiskFileItemFactory();

  ServletFileUpload upload = new ServletFileUpload(factory);

  List items = null;

  try {

   items = upload.parseRequest(request);

  } catch (FileUploadException e) {

   e.printStackTrace();

  } // 解析request請求

  Iterator iter = items.iterator();// 遍歷表單中提交過來的內容

  while (iter.hasNext()) {

   FileItem item = (FileItem) iter.next();

   if (item.isFormField()) { // 如果是表單域 ，就是非檔案上傳元素

    String value = item.getString("UTF-8"); // 獲取value屬性的值，這裡需要指明UTF-8格式，否則出現中文亂碼問題

    if (item.getFieldName().equals("cid")) {// 對應form中屬性的名字

     int categoryId = Integer.parseInt(value);

     product.setCategory_id(categoryId);

    } else if (item.getFieldName().equals("cname")) {

     product.setName(value);

    }else if (item.getFieldName().equals("introduction")) {

     product.setIntroduction(value);

    }else if (item.getFieldName().equals("title")) {

     product.setTitle(value);

    }else if (item.getFieldName().equals("price")) {

     BigDecimal price=new BigDecimal(value);

     product.setPrice(price);

    }else if (item.getFieldName().equals("stock")) {

     product.setStock(Integer.parseInt(value));

    }else if (item.getFieldName().equals("status")) {

     product.setStatus(Integer.parseInt(value));

    }else if (item.getFieldName().equals("details")) {

     product.setDetail(value);

    }

   }else {

    String filename = item.getName(); // 檔案的名字

 

    String imgname = filename.substring(0,filename.indexOf(".")); //減去“.”後面的字元

 

    //tomcat啟動位置

//    String t1 = System.getProperty("user.dir").substring(0,//      System.getProperty("user.dir").length() - 4);

 

    String path = request.getServletContext().getRealPath("img"); //target找到img位置

    Long time = Calendar.getInstance().getTimeInMillis(); //時間戳，保證檔案命名不重複

    String imgurl = "./img/"+imgname+time+".jpg";

    product.setImage(imgurl);

    System.out.println(imgurl);

    File saveFile = new File(path+"/" + imgname+time+".jpg"); // 定義一個file指向一個具體的檔案

    try {

     item.write(saveFile);// 把上傳的內容寫到一個檔案中

     System.out.println("上傳到"+path+"成功");

    } catch (Exception e) {

     /* e.printStackTrace(); */

     System.out.println("檔案"+path+"為空");

    }

   }

  }

 

  if(productDaoService.addProduct(product)){

   PrintWriter out = response.getWriter();

   out.print("<script language=\"javascript\">alert('ADD SUCCESS');window.location.href='/admin/administrator'</script>");

  }else {

   PrintWriter out = response.getWriter();

   out.print("<script language=\"javascript\">alert('增加失敗');window.location.href='/admin/addProduct'</script>");

  }

 }

以上就是java實現圖片和文字同時提交到表單的詳細內容，感謝大家的學習和對我們的支援。