关于Jsp页面上传图片和缩略图查看

最新推荐文章于 2020-11-19 10:49:59 发布

原创最新推荐文章于 2020-11-19 10:49:59 发布 · 5.7k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#jsp #图片处理

jsp 专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何在JSP页面实现图片上传及缩略图预览功能。包括前端验证、后端处理及利用FTP服务器存储图片，并通过JSP页面展示缩略图链接到原图。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

关于Jsp页面上传图片和缩略图查看

主要分为两部分：

第一，图片的上传，图片保存在ftp服务器里（也可以是对应的项目文件夹下需要相对应的修改）

第二，上传后，我们通过点击页面的缩略图查看原图

关于图片的上传操作：

1.在附件上传页面引入验证js：

然后在我们的form表单中修改属性，新增附近上传元素

<s:form name="form1" action="/instancyCase/caseInfo!saveCaseInfo.action" method="post" enctype="multipart/form-data">

      <tr>

            <td class="table_rleft">附件：</td>

           <td  colspan="3">

           <input type="file" name="fj" id="fj"/>

           <span style="font-size: 12px;color: red">

           <s:property value="error"/> </span>

        </td>

     </tr>

     <input type="submit" id="IsSubmit" class="button" name="update" value="  保存  " onmouseup="return UpCheck('fj')" />

</s:form>

以上代码可直接拷到jsp中使用，部分属性改一下就行了。

2、Action层：

附件涉及的变量：

private String error;                       //错误信息提示属性

private TblSpisCorpInstancyCaseFj ruleFj;   //自定义的附近pojo

private File fj;                               //附件对象

保存或者更新附件信息的方法体内填入以下代码：

if (fj != null){

    String check = CheckFile.getFileByFile(fj);                    //主要是验证附件的格式，比如：jpg .gif .png .bmp等格式

    if (check!=null&&!"".equals(check)) {

    	String tem_path = Util.FTP_FOLDER+File.separator+Util.WARD_PHOTO;

    	String xdpath = Util.FTP_FOLDER+File.separator+Util.WARD_PHOTO;



    	String file_Name = UploadFTP.copyFTP( this.getFj(),tem_path,"jpg",(sessionUser.getId()).toString());

    	ruleFj.setCorpInstancyCaseFjPath(xdpath + File.separator + (sessionUser.getId()).toString()+File.separator + file_Name );

    	ruleFj.setCorpInstancyCaseFjName(file_Name);

    	ruleFj.setCreateTime(new Timestamp(System.currentTimeMillis()));

    	ruleFj.setCorpInstancyCaseFjType("2");

   }else{

    	this.setCaseObj(caseObj);

    	error= "文件格式不对";

    	return addCaseInfo();

  }

}

缩略图查看原图
需要在Jsp查看附件页面新增：

<tr>

    <td class="table_rleft">附件：</td>

       <td  colspan="3">

            <s:if test=”ruleFj.corpInstancyCaseFjPath!=null”>

             <img src="<%=basePath%>/JpgShow.jsp?path=${ruleFj.corpInstancyCaseFjPath }" width="100" height="75"/>

            </s:if>

            <s:else>

               暂无附件信息

            </s:else>

        </td>

</tr>

下面是附件的相关描述

在页面对图片的后缀名做验证（具体方法实现内容见附件1 check.js）

//CheckFile.getFileByFile用于判定附件的内容是否符合规定的格式，如果不是，返回添加或更新jsp页面重新上传，具体方法实现内容见附件2 CheckFile.java

// UploadFTP.copyFTP用于生成在ftp服务器上该附件唯一的文件名，具体方法实现内容见附件3UploadFTP.java

//拼凑出附件在ftp服务器中的路径子串，设置到附件对象的path属性中，这个属性要在后边的jsp查看该附件时使用

JpgShow.jsp将ftp服务器上的图片处理成缩略图在img标签中显示，具体方法实现见附件4JpgShow.jsp