基于springMvc的文件（图片）上传

刺骨的言语ヽ痛彻心扉 2022-05-22 03:29 241阅读 0赞

一、首先 先导入上传所需要的两个基础包

![70][]

二、在前段jsp的表单中设置如下

enctype="multipart/form-data"    该属性是关键（必须要写）

另外表单内还要设置  
           该input中的type属性必须是file  并且要写name   该name是后台传过去的name  
                    <input type="file"  name="pictureFile"/>

前台页面已经搞完。。。。。。。。。。。。。

\----------------------------------------我是一条华丽的分割线 -------------------------------------------------------------

后台操作

在所需要方法设置形参 形参名字必须是上面input中的name的值

必须是public String EditItems(MultipartFile pictureFile)

public String EditItems(MultipartFile pictureFile,Items items) throws Exception {
    
            // 图片上传
            // 设置图片名称，不能重复，可以使用uuid
            String picName = UUID.randomUUID().toString();
    
            // 获取文件名
            String oriName = pictureFile.getOriginalFilename();
            // 获取图片后缀
            String extName = oriName.substring(oriName.lastIndexOf("."));
    
            // 开始上传
            pictureFile.transferTo(new File("F:/upload/" + picName + extName));
    
            // 设置图片名到商品中
            items.setPic(picName + extName);
    
    
    
            //然后把数据存到数据库中去   数据库中的是该图片的名称  通过该名称 就可以找到本地的图片
            //更新修改商品列表
            itemsService.updateitem(items);
    
    
            return "forward:/itemEdit.action"; 
    
    }

关键地方 就是在springMvc中配置

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    		
    		<property name="maxUploadSize" value="5000000" />
    	</bean>

基本步骤已经完成。

开始测试

上传一张图片

![70 1][] 上传成功 页面显示![70 2][]

本地仓库和数据库

![70 3][]

数据库中

![70 4][]

与本地仓库的图片id是一致的。

[70]: /images/20220522/d7b33b46b2084a4a984340b3175ac1d1.png
[70 1]: https://img-blog.csdn.net/20180614094913128?watermark/2/text/aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4ODkwMTM3/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70
[70 2]: /images/20220522/52259c8707bc4e8e9850ab179b060952.png
[70 3]: /images/20220522/fe355fe2580d4072b2b953826bd07487.png
[70 4]: /images/20220522/605d2f6fa2e640b8a0ecd5154d7c26f6.png