引言

时隔一天，上一篇文章《文件存储》刚一停笔，今天上午就解决了困扰我已久的文件上传问题。

站在一个已实现功能的角度来重新看待这个文件上传的业务：编辑页面选择jar包，然后通过form表单提交，上传到后台程序，然后保存。

对于后端实现的更多细节，可以参考我的另一篇技术分享《Java实现用户头像上传》，里面较为详细的分析了文件从浏览器传输到服务器之后的一些处理规则，包括接收方式、磁盘存储等。

文件上传的入口

最简单的浏览器上传入口仅需要一个form标签：

<form action="http://localhost:8081/thingsparse/addorupdthingsparse" method="post" enctype="multipart/form-data"><input type="file" name="file" value="选择jar包"/><input id="submit_form" type="submit" class="btn btn-success save" value="保存"/>
</form>

前端只是用了传统的form表单上传文件的方式，提交按钮直接submit到后台，而不需要多写哪怕一丁点的额外js。

值得注意的是：每条form表单参数都需要有name属性，以及form表单的enctype="multipart/form-data"。

文件的存储

其实关键的代码就是文件的接收，至于后面的存储操作，基本上都是对IO流的操作。浏览《Java实现用户头像上传》参考更多信息。

/*** 解析新建编辑* * @param String*            newThingsParse是一个拥有ThingsParse类结构的json字符串* @return*/@RequestMapping(value = "/addorupdthingsparse")public ModelAndView saveThingsParse(MultipartFile file, HttpServletRequest request) {String idStr = request.getParameter("thingsparse_id");ThingsParse thingParse = new ThingsParse();//将被存储于mongodb的实例String filePath = "";// jar包的路径if (!file.isEmpty()) {File temp = new File("");filePath = temp.getAbsolutePath() + "\\" + file.getOriginalFilename();BufferedOutputStream out;try {out = new BufferedOutputStream(new FileOutputStream(new File(filePath)));out.write(file.getBytes());out.flush();out.close();} catch (FileNotFoundException e) {e.printStackTrace();} catch (IOException ex) {ex.printStackTrace();}}logger.info("保存的jar包路径是：" + filePath);//output:保存的jar包路径是：D:\workspace\wxgz\json.jarthingParse.setJarPackage(filePath);thingParse.setAuthor(request.getParameter("author"));thingParse.setDirection(request.getParameter("direction"));thingParse.setEntranceClass(request.getParameter("entrance_class"));thingParse.setEntranceMethod(request.getParameter("entrance_method"));thingParse.setName(request.getParameter("thingsparse_name"));thingParse.setTestData(request.getParameter("test_data"));thingParse.setVersion(request.getParameter("version"));if (idStr == null || "".equals(idStr)) {// 新增// 获取当前系统时间Calendar now = Calendar.getInstance();SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");String nowStr = sdf.format(now.getTime());// 将物解析实例的创建时间赋值thingParse.setCreateTime(nowStr);// 存储thingsParseRepository.save(thingParse);} else {// 编辑thingParse.set_id(new ObjectId(idStr));if(file.isEmpty()){thingParse.setJarPackage(request.getParameter("jar_package"));}thingParse.setCreateTime(request.getParameter("thingsparse_createtime"));thingsParseRepository.save(thingParse);}String listUrl = "redirect:http://localhost:8081/thingsparse/thingsparselist";return new ModelAndView(listUrl);//后台重定向}

总结

web应用的文件上传是一个相对通用的功能，使用最简单的form表单提交基本可以满足多数应用的要求。

关键的思路就是前端的form表单选择文件然后提交，后端使用类型MultipartFile 接收。而文件保存到本地磁盘可以参考《文件存储》和《Java实现用户头像上传》。

传统form表单提交方式的文件上传与文件存储相关推荐

form表单提交数据的同时上传文件代码示例
form表单提交数据的同时在表单中上传文件代码示例一.定义页面注意:在form表单中加入属性 enctype="multipart/form-data" 表示此表单支持文件上 ...
常见的Form表单提交方式
Form表单提交方式探究在进行项目编程的时候,我们难免会去编写一些简单的前端页面. 而编写前端页面就力不开 form表单的支持. 下面就form表单的提交方式进行如下探寻 1.常规写法在form表 ...
jmeter测试接口--form表单提交请求（解决请求传参为空的问题）
jmeter测试接口--form表单提交请求(解决请求传参为空的问题) 参考文章: (1)jmeter测试接口--form表单提交请求(解决请求传参为空的问题) (2)https://www.cnbl ...
php form表单提交方式,form表单提交数据的几种方式
一.submit提交一般表单提交通过type=submit实现,input type="submit",浏览器显示为button按钮,通过点击这个按钮提交表单数据跳转到/url. ...
前端基础至 form表单提交方式
原文:https://www.jianshu.com/p/8c947e7fee00 虽然前后端不分离项目越来越少了(vue等太香)但是有时候后端程序员想自己搞不分离web页面的时候还是会用原生htm ...
form表单提交，Servlet接收并读取Excel文件
首先是jsp页面: <body scroll=no style="overflow-y:hidden;" onselectstart="return false&q ...
用form表单提交方式上传图片到服务器
springMVC为文件上传提供了直接的支持,这种支持是通过MultipartResolver实现的,实现类为CommonsMultipartResovler. 依赖:commons-fileuplo ...
JSP form表单提交方式get 和post的区别
get: 提交的数据量要小于1024字节,表单提交时表单域数值(表单请求的信息:账号.密码等)会在地址栏显示. 如图 post: 传递的数据量不受限制,表单提交时表单的域值(表单 ...
form 关于form表单提交方式get和post的区别？
1.get是从服务器上获取数据,post是向服务器传送数据. 2.get是把参数数据队列加到提交表单的ACTION属性所指的URL中,值和表单内各个字段一一对应,在URL中可以看到.post是通过HT ...

传统form表单提交方式的文件上传与文件存储

引言

文件上传的入口

文件的存储

总结

传统form表单提交方式的文件上传与文件存储相关推荐

最新文章

热门文章