Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >专栏 >文件上传

文件上传

作者头像
微醺
发布于 2019-01-17 05:12:23
发布于 2019-01-17 05:12:23
3.6K00
代码可运行
举报
运行总次数:0
代码可运行

文件(图片)的上传方法

首先创建一个servlet用来获取从前端(form表单或者其它方法)传过来的数据,我这里用到人员信息的提交,使用的是form表单。 前端代码form

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
  <form method="post" class="form-x"  encType="multipart/form-data" action="people.do">    
      <div class="form-group">
        <div class="label">
          <label>姓名:</label>
        </div>
        <div class="field">
          <input type="text" class="input w50" name="name"  data-validate="required:请输入姓名" />
          <div class="tips"></div>
        </div>
      </div>
       <div class="form-group">
        <div class="label">
          <label>性别:</label>
        </div>
        <div class="field">
          <input type="text" class="input w50"  name="sex" data-validate="required:请输入性别" />
          <div class="tips"></div>
        </div>
      </div>
      <div class="form-group">
        <div class="label">
          <label>年龄:</label>
        </div>
        <div class="field">
          <input type="text" class="input w50" name="age" data-validate="required:请输入年龄" />
          <div class="tips"></div>
        </div>
      </div>
        <div class="form-group">
        <div class="label">
          <label>部门:</label>
        </div>
        <div class="field">
          <input type="text" class="input w50"  name="depart" data-validate="required:请输入部门" />
          <div class="tips"></div>
        </div>
      </div>
         <div class="form-group">
        <div class="label">
          <label>手机号码:</label>
        </div>
        <div class="field">
          <input type="text" class="input w50"  name="phone" data-validate="required:请输入手机号码" />
          <div class="tips"></div>
        </div>
      </div>
      <div class="form-group">
        <div class="label">
          <label>email:</label>
        </div>
        <div class="field">
          <input type="text" class="input w50"  name="email" data-validate="required:请输入email" />
          <div class="tips"></div>
        </div>
      </div>      
      <div class="form-group">
        <div class="label">
          <label>图片:</label>
        </div>
        <div class="field">
          <input type="file" id="url1" name="img" class="input tips button bg-blue margin-left" style="width:25%; float:left;" data-toggle="hover" data-place="right" data-image="" />
          <div class="tipss">图片尺寸:1920*500</div>
        </div>
      </div>
      
      <div class="form-group">
        <div class="label">
          <label></label>
        </div>
        <div class="field">
          <button class="button bg-main icon-check-square-o" type="submit"> 提交</button>
        </div>
      </div>
    </form>

servlet代码

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
  import java.io.IOException;   
    import javax.servlet.ServletException;
    import javax.servlet.annotation.MultipartConfig;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import javax.servlet.http.Part;
    import com.tf.management.dao.PeopleImp;
    import com.tf.management.entity.Person;
    import com.tf.management.util.UploadImg;
 
    @WebServlet("/people.do")
    @MultipartConfig//注解,这里必须用到多部分上传,因为文件太大,一次传递不完
    public class PeopleServlet extends HttpServlet {
    	private static final long serialVersionUID = 1L;        
    	protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    		//从前端获取数据
    		String name = req.getParameter("name");
    		String age = req.getParameter("age");
    		String sex = req.getParameter("sex");
    		String depart = req.getParameter("depart");
    		String phone = req.getParameter("phone");
    		String email = req.getParameter("email");
    		//获取图片
    		Part part = req.getPart("img");
    		String path = req.getServletContext().getRealPath("img");//获取图片的路径
    		String icon = new UploadImg().uploadImg(part, path);//调用上传图片的方法,返回一个相对路径
    		//处理数据 把数据封装成people对象
           Person person = new Person();
       	   person.setName(name);
	       person.setAge(Integer.valueOf(age));
	       person.setSex(sex);
	       person.setDepart(depart);
	       person.setEmail(email);
	       person.setPhone(phone);
	       person.setIcon(icon);
	      //插入到数据库中
	      new PeopleImp().update(person);
	     //跳转到adv.html页面
	     req.getRequestDispatcher("adv1.html").forward(req, resp);
    	}
 }

上传图片方法

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
import java.io.File;
import java.io.IOException;
import javax.servlet.http.Part;

public class UploadImg {
	//上传文件
	public String uploadImg(Part part,String path) {
	//2.3通过文件的content-type,判断文件的类型,不是图片类型不让上传
	String type=part.getContentType();
	if (!(type.contains("png")||type.contains("jpeg")||type.contains("gif"))) {
	//返回前端文件必须是指定格式	
	return null;
	}
	//2.4判断文件大小,可以限制图片的大小
	if (part.getSize()>256*768) {
	return null;//如果太小,上传不上去
	}
	//2.5将文件进行拼接写入到指定文件
	//处理字符串,获取上传的文件名
	String content=part.getHeader("content-disposition");//获取文件绝对路径
	String filename=content.substring(content.lastIndexOf("=\"")+2,content.lastIndexOf("\""));//截取文件名称	
	String newFile="img/"+filename;	
	File file=new File(path);
	if (!file.exists()) {//不存在当前文件,新建一个
	file.mkdir();
	}
	filename=path+File.separatorChar+filename;//File.separetorChar是反斜杠,这里在windows和苹果系统都适用
	//2.6将文件写到指定位置
	try {
	part.write(filename);
	} catch (IOException e) {
	// TODO Auto-generated catch block
	e.printStackTrace();
	}
	return newFile;//返回文件路径
	}
}

总结

文件上传的时候一定要记住使用注解,@MultipartConfig多部分上传一定不能少。文件存取到数据库中是相对路径,数据库会根据相对路径在把图片显示在前端。主要注意的是相对路径的拼接。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018年11月05日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
文件上传和下载
​ encType=multipart/form-data 表示提交的数据,以多段(每一个表单项一个数据段)的形式进行拼 接,然后以二进制流的形式发送给服务器。
上分如喝水
2021/08/16
1.2K0
文件上传和下载
基于Jsp和Servlet的简单项目
链接:https://pan.baidu.com/s/1ylOi3PXFy6nwoOyVGVrBeg 提取码:yvsn
时间静止不是简史
2020/07/26
6.7K0
Ckeditor一种很方便的文本编辑器
别先生
2018/01/02
1.3K0
Ckeditor一种很方便的文本编辑器
HttpServletRequest这篇文章就够了
HttpServletRequest对象代表客户端的请求,当客户端通过HTTP协议访问服务器时,HTTP请求头中的所有信息都封装在这个对象中,通过这个对象提供的方法,可以获得客户端请求的所有信息。
好好学java
2018/09/04
7.7K0
jsp+servlet实现文件的上传和下载
本文讲述通过JSP技术实现文件上传下载功能。首先介绍了JSP中的文件上传下载原理,然后通过实例演示了文件上传下载的具体实现过程,最后介绍了在Java Web项目中文件上传下载的应用。
别先生
2018/01/02
3.4K0
jsp+servlet实现文件的上传和下载
重温Java Web的技术细节
-web应用同样也需要一些初始化的参数,但 相对于每一个Servlet有一个ServletConfig来说,一个Web应用(确切的说是每个JVM)仅有一个ServletContext来存放这些参数,这个ServletContext对Web应用中的每个Servlet都可用。
智慧zhuhuix
2020/09/01
1K0
重温Java Web的技术细节
JavaWeb新手进阶经典项目 & 半小时高效开发 & 海量知识点涵盖 (二)
我们昨天完成了第一部分的开发,即项目搭建和登录、注册功能实现。今天本文将与读者一起实现用户列表的显示、部门模块的显示和头像上传功能。
易兮科技
2020/09/27
1.2K0
JavaWeb新手进阶经典项目 & 半小时高效开发 & 海量知识点涵盖 (二)
WEB:文件上传 —— 看这篇就够了
HTML 表单最初只支持 application/x-www-form-urlencoded 形式编码(key=value&key=value...),但它不适合用于传输二进制数据(文件)或者包含非ASCII字符的数据。所以 multipart/form-data 就诞生了,专门用于传输文件。
WEBJ2EE
2019/07/30
6.7K0
WEB:文件上传 —— 看这篇就够了
基于jsp和基于web的区别_java发送短信
最近几天有人需要帮忙做一个关于发送验证码的功能,之前没有做过,于是我鼓捣一阵子,记录一下关于web项目中注册登录常用的手机验证码和邮箱验证码的发送。
全栈程序员站长
2022/11/04
4.1K0
基于jsp和基于web的区别_java发送短信
第三章:用户管理功能【基于Servlet+JSP的图书管理系统】
  清楚了我们要操作的数据。我们就可以来创建相关的代码。整个项目的结构我们分为com.boge.sys和com.boge.book两个模块。
用户4919348
2023/07/11
5450
第三章:用户管理功能【基于Servlet+JSP的图书管理系统】
servlet实现上传功能
CBeann
2023/12/25
1260
springmvc文件上传(ajax请求 带参数)
这里用ajax文件上传,并携带几个参数,网上查到的大多都是没带参数只有文件的。 由于我项目代码太多,这里只给出关键代码。
别团等shy哥发育
2023/02/25
1.1K0
Spring MVC 学习总结(五)——校验与文件上传
Spring MVC不仅是在架构上改变了项目,使代码变得可复用、可维护与可扩展,其实在功能上也加强了不少。 验证与文件上传是许多项目中不可缺少的一部分。在项目中验证非常重要,首先是安全性考虑,如防止注入攻击,XSS等;其次还可以确保数据的完整性,如输入的格式,内容,长度,大小等。Spring MVC可以使用验证器Validator与JSR303完成后台验证功能。这里也会介绍方便的前端验证方法。
张果
2022/05/09
1K0
Spring MVC 学习总结(五)——校验与文件上传
编写一个注册信息填写界面,使用jQuery和JavaScript处理输出的信息,该页面能完成多种信息检查,并能利用jQuery发送Ajax请求。创建的JavaWeb项目名称为JQueryTest
编写一个注册信息填写界面,使用jQuery和JavaScript处理输出的信息,该页面能完成多种信息检查,并能利用jQuery发送Ajax请求。创建的JavaWeb项目名称为JQueryTest
CaesarChang张旭
2021/05/24
1.1K0
编写一个注册信息填写界面,使用jQuery和JavaScript处理输出的信息,该页面能完成多种信息检查,并能利用jQuery发送Ajax请求。创建的JavaWeb项目名称为JQueryTest
第四章:角色和菜单管理功能【基于Servlet+JSP的图书管理系统】
RoleServlet需要继承前面定义的BaseServlet,然后重写定义的抽象方法。同时要重写list方法。具体如下:
用户4919348
2023/07/11
3100
第四章:角色和菜单管理功能【基于Servlet+JSP的图书管理系统】
初学Java Web(7)——文件的上传和下载
文件上传 文件上传前的准备 在表单中必须有一个上传的控件 <input type="file" name="testImg"/> 因为 GET 方式有请求大小的限制,所以表单的提交方式必须是 POST <form action="/upload" method="post"> 表单默认的编码方式为 application/x-www-form-urlencoded ,应该修改为 multipart/form-data ,以二进制的形式进行数据的传输 <form action="/upload"
我没有三颗心脏
2018/04/26
1.3K0
初学Java Web(7)——文件的上传和下载
javaee的OA项目(二) 实现对部门的增删改查
我们已经搭建了javaee的项目架构,并且静态页面也可以访问了,现在我们开始利用代码操作数据库了
一写代码就开心
2021/06/17
8130
javaee的OA项目(二) 实现对部门的增删改查
springboot文件上传
multipart/form-data是指表单数据有多部分构成,既有文本数据,又有文件等二进制数据的意思。
一个风轻云淡
2022/11/13
2580
Servlet 3.0 文件上传与下载
主要是用到了客户端 HTML 页面的表单元素,使用<form> 标签的 enctype 属性,并设置它的值为 multipart/formdata,意思是:多部分/表单数据,同时使用<input type="file"> 的输入域用于指定上传的文件。
wsuo
2020/07/30
1.1K0
Servlet 3.0 文件上传与下载
Web---文件上传-用apache的工具处理、打散目录、简单文件上传进度
在这个上传中,我们并没有把uuid和文件名联系起来,这样是不好的,必须用数据库把uuid和其对应的文件名存起来。以后下载的时候还给客户端一样的名字,而不是给他uuid的名字。
谙忆
2021/01/21
1K0
Web---文件上传-用apache的工具处理、打散目录、简单文件上传进度
推荐阅读
相关推荐
文件上传和下载
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验