简单的ajax上传商品功能使用SevletFileUpload和FormData
目錄
- 1、先上圖
- 2、使用ServletFileUpload讀取前端發(fā)送過(guò)來(lái)的請(qǐng)求
- 2.1、maven依賴
- 2.2、SevletFileUpload的一些基本操作
- 3、前端代碼
- 4、 Servlet
- 4.1、后端返回商品列表
- 4.2、添加商品
- 4.3、商品DAO層
- 4.3.1、 ProductDao
- 4.3.2、ProductDaoimpl
1、先上圖
2、使用ServletFileUpload讀取前端發(fā)送過(guò)來(lái)的請(qǐng)求
2.1、maven依賴
maven依賴
<dependency><groupId>commons-fileupload</groupId><artifactId>commons-fileupload</artifactId><version>1.3.1</version></dependency>2.2、SevletFileUpload的一些基本操作
SevletFileUpload的一些基本操作
1.form表單的method必須是post
2.form表單的enctype必須是multipart/form-data 以二進(jìn)制字節(jié)流
進(jìn)行提交 傳統(tǒng)接收參數(shù)的方式無(wú)效
DiskFileItemFactory:
void setSizeThreshold(int sizeThreshold) 設(shè)置緩沖區(qū)大小，默認(rèn)10KB 超出將使用臨時(shí)文件上傳
void setRepository(File repository) 設(shè)置臨時(shí)文件路徑
ServletFileUpload：核心操作類
public void setSizeMax(long sizeMax)設(shè)置總文件的大小
public void setFileSizeMax(long fileSizeMax)：設(shè)置單個(gè)文件的大小
public List<FileItem> parseRequest(javax.servlet.http.HttpServletRequest req) 解析請(qǐng)求正文內(nèi)容
public static boolean isMultipartContent(HttpServletRequest req)//判斷enctype
setProgressListener(new ProgressListener(function(三參數(shù)))) 具體內(nèi)容往下看
FileItem:輸入類:
void write(File file): write方法將FileItem對(duì)象中的內(nèi)容保存到某個(gè)指定的文件中。如果FileItem對(duì)象中的內(nèi)容是保存在某個(gè)臨時(shí)文件中，該方法完成后，臨時(shí)文件可以會(huì)被刪除。該方法也可以將普通表單字段保存在一個(gè)文件中，但最主要的用途是把上傳的文件內(nèi)容保存在本地文件系統(tǒng)中。
boolean isFormField()：判斷是否是普通字段
普通字段：
String getFieldName（）：獲取普通字段的字段名
String getString（）：獲取普通字段的值
文件字段:
String getContentType() 獲得文件類型
String getName（）：獲取上傳文件名
InputStream getInputStream()以流的形式返回上傳文件的主體內(nèi)容
void delete（）刪除臨時(shí)文件
字段亂碼的問(wèn)題
普通字段可以使用item.getString(“GBK”)或者 new String(item.getString().getBytes(“iso-8859-1”),“utf-8”)
如果是文件名亂碼的話，就是設(shè)置request編碼 request.setCharacterEncoding(“utf-8”);
文件名重復(fù)問(wèn)題
一般采用UUID的randomUUID()來(lái)代替文件名防止亂碼
上傳進(jìn)度檢查
upload.setProgressListener(new ProgressListener(){
參數(shù)一：已上傳的字節(jié)數(shù)
參數(shù)二：總字節(jié)數(shù)
參數(shù)三:第幾項(xiàng)
@Override
public void update(long arg0, long arg1, int arg2) {
// TODO Auto-generated method stub
System.out.println(arg0+" "+arg1+" "+arg2);
}
});
3、前端代碼
form表單僅僅只是為了解決JavaScript設(shè)置請(qǐng)求頭multipart/form-data的邊界問(wèn)題，而不是為了用form表單來(lái)提交數(shù)據(jù)。所以我們需要將form表單的提交事件刪除。我們只需要設(shè)置onsubmit="return false;"這樣就可以使form表單的提交事件不起作用。我們使用FormData這個(gè)類來(lái)封裝表單中的數(shù)據(jù)，這個(gè)數(shù)據(jù)可以同時(shí)封裝文件和普通表單字段，以key,value的形式表示，其中key為表單中設(shè)置的name屬性。
FormData的使用方法
在表單中key 就是屬性name 的值
new FormData(表單對(duì)象) 直接封裝表單對(duì)象中的數(shù)據(jù)
append(String key,String value) 添加屬性
set(String key,String value)修改屬性
delete(String key) 刪除屬性
4、 Servlet
4.1、后端返回商品列表
package com.Servlet;import com.DAO.Impl.ProductDaoimpl; import com.DAO.ProductDao; import com.domain.product; import com.google.gson.Gson; import com.google.gson.GsonBuilder;import javax.servlet.ServletException; import javax.servlet.ServletRequest; import javax.servlet.ServletResponse; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.io.PrintWriter; import java.util.List;/*** 查詢所有商品* 返回給主頁(yè)用于渲染商品*/ @WebServlet("/productPageServlet") public class productPageServlet extends HttpServlet {@Overridepublic void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {ProductDao productDao=new ProductDaoimpl();final List<product> products = productDao.selAll();GsonBuilder builder=new GsonBuilder();final Gson gson = builder.create();final String json= gson.toJson(products); // System.out.println(json);response.setCharacterEncoding("utf-8");response.setContentType("text/html;charset=utf-8");PrintWriter out=response.getWriter();out.write(json);out.close();} }4.2、添加商品
package com.Servlet;import com.DAO.Impl.ProductDaoimpl; import com.DAO.ProductDao; import com.domain.product; import org.apache.commons.fileupload.FileItem; import org.apache.commons.fileupload.ProgressListener; import org.apache.commons.fileupload.disk.DiskFileItemFactory; import org.apache.commons.fileupload.servlet.ServletFileUpload;import javax.servlet.ServletException; import javax.servlet.ServletRequest; import javax.servlet.ServletResponse; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.PrintWriter; import java.util.HashMap; import java.util.List; import java.util.Map; import java.util.UUID;/*** 前臺(tái)上傳商品信息和商品圖片* 解析信息與圖片*/ @WebServlet("/insertProductServlet") public class insertProductServlet extends HttpServlet {@Overridepublic void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {ProductDao productDao=new ProductDaoimpl();request.setCharacterEncoding("utf-8");response.setContentType("text/html;charset=utf-8");response.setCharacterEncoding("utf-8");final PrintWriter out = response.getWriter();final DiskFileItemFactory factory = new DiskFileItemFactory();ServletFileUpload fileUpload=new ServletFileUpload(factory);fileUpload.setHeaderEncoding("utf-8");Map<String,String> map=new HashMap<>();final boolean flag = fileUpload.isMultipartContent(request);//判斷是否encType="multipart/form-data"System.out.println(flag);try{final List<FileItem> fileItems = fileUpload.parseRequest(request);System.out.println(fileItems);for(FileItem item:fileItems){if(item.isFormField()){//不是文件上傳map.put(item.getFieldName(),new String(item.getString().getBytes("iso-8859-1"),"utf-8"));}else{final InputStream inputStream = item.getInputStream();final String contentType = item.getContentType();System.out.println(contentType);String wjj=request.getServletContext().getRealPath("res/productimg");//文件夾路徑String filename= item.getName();String name= UUID.randomUUID()+filename.substring(filename.indexOf("."),filename.length());String url=wjj+"/"+name;url=url.substring(url.indexOf("res"),url.length());map.put("imgurl",url);System.out.println(name);final FileOutputStream fileOutputStream = new FileOutputStream(wjj+"/"+name);byte[] bytes=new byte[1024];int len=0;while((len=inputStream.read(bytes))!=-1){fileOutputStream.write(bytes,0,len);}}}}catch (Exception e){e.printStackTrace();}System.out.println(map);final product product = new product(map.get("product_name"),map.get("price"),map.get("imgurl"));if(productDao.insert(product)==1){out.write("true");}else{out.write("false");}} }4.3、商品DAO層
4.3.1、 ProductDao
package com.DAO;import com.domain.product;import java.util.List;public interface ProductDao {List<product> selAll();int insert(product p);int delOne(String id);}4.3.2、ProductDaoimpl
package com.DAO.Impl;import com.DAO.ProductDao; import com.domain.product; import com.jdbc.jdbcUtil;import java.sql.Connection; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.util.ArrayList; import java.util.List;public class ProductDaoimpl implements ProductDao {static private Connection conn = jdbcUtil.conn;static private PreparedStatement pst = null;@Overridepublic List<product> selAll() {List<product> list=new ArrayList<>();try{pst=conn.prepareStatement("select *from product");final ResultSet resultSet = pst.executeQuery();while(resultSet.next()){list.add(new product(resultSet.getString(1),resultSet.getString(2),resultSet.getString(3),resultSet.getString(4)));}}catch (Exception e){e.printStackTrace();}return list;}@Overridepublic int insert(product p) {try{pst=conn.prepareStatement("insert into product values(null,?,?,?)");pst.setString(1,p.getProduct_name());pst.setString(2,p.getPrice());pst.setString(3,p.getImgurl());final int i = pst.executeUpdate();return i;}catch ( Exception e){e.printStackTrace();}return 0;}@Overridepublic int delOne(String id) {return 0;}public static void main(String[] args) { // final List<product> products = new ProductDaoimpl().selAll(); // System.out.println(products);} }總結(jié)
以上是生活随笔為你收集整理的简单的ajax上传商品功能使用SevletFileUpload和FormData的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： php 获取 table,php – 获
- 下一篇： 配置babel_Babel 7 下配置