7---上传图片

7.1需求

在修改商品页面，添加上传商品图片功能。

7.2  配置虚拟目录

在tomcat上配置图片虚拟目录，在tomcat下conf/server.xml中添加：

<Context docBase="F:\develop\upload\temp" path="/pic" reloadable="false"/>

 访问http://localhost:8080/pic即可访问F:\develop\upload\temp下的图片。

 也可以通过eclipse配置：

7.3springmvc中对多部件类型解析

 在页面form中提交enctype="multipart/form-data"的数据时，需要springmvc对multipart类型的数据进行解析。

 在springmvc.xml中配置multipart类型解析器。

 

        <!-- 文件上传 -->
    <bean id="multipartResolver"
    class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <!-- 设置上传文件的最大尺寸为5MB -->
        <property name="maxUploadSize">
            <value>5242880</value>
        </property>
    </bean>

 

CommonsMultipartResolver解析器依赖commons-fileupload和commons-io，加入如下jar包：

7.4 图片上传

Controller中带参数    MultipartFile items_pic   （接收商品图片）

// 原始名称
String originalFilename = items_pic.getOriginalFilename();

// 上传图片
if (items_pic != null && originalFilename != null&& originalFilename.length() > 0) {

   // 存储图片的物理路径
   String pic_path = "F:\\upload\\temp\\";

   // 新的图片名称
   String newFileName = UUID.randomUUID()+ originalFilename.substring(originalFilename.lastIndexOf("."));
    
   // 新图片
   File newFile = new File(pic_path + newFileName);

   // 将内存中的数据写入磁盘
   items_pic.transferTo(newFile);

   // 将新图片名称写到itemsCustom中
   itemsCustom.setPic(newFileName);
    
}

// 调用service更新商品信息，页面需要将商品信息传到此方法
itemsService.updateItems(id, itemsCustom);

页面：

  form添加enctype="multipart/form-data"：

<form id="itemForm"  action="${pageContext.request.contextPath }/items/editItemsSubmit.action" method="post" 
　　enctype="multipart/form-data">

　　<input type="hidden" name="id" value="${items.id }"/>

修改商品信息：
<table width="100%" border=1>
...
<tr>
    <td>商品图片</td>
    <td>
        <c:if test="${items.pic !=null}">
            <img src="/pic/${items.pic}" width=100 height=100/>
            <br/>
        </c:if>
        <input type="file"  name="items_pic"/> //file的name与controller的形参一致
    </td>
</tr>
</table>
</form>