单文件文件上传到服务器(HTML5+js+Java)

上传单文件到服务器

应公司要求,在HTML5页面上实现上传文件到服务器,对于一个还没毕业的实习生菜鸟来说,这可不得了-----不会,网上各种百度,找各种博客还是没解决,最后还是请教了公司的大神,人家给卸了一个例子,然后根据人家写的终于把这个上传文件搞定。

好了,开始上代码。

HTML5代码:

 <form name="upform" action="" method="POST">
                    <input type ="file" name="myfile1" id="myfile1"/><br/>
                    <input type ="file" name="myfile2" id="myfile2"/><br/>
                            备注:<input type="text" name="mydata" id="mydata"/><br/>
                    <input type="button" value="确定" onclick="upload()"/><br/>
</form> 

js代码:

FormData可以把它理解成一个虚拟的表单对象,它只有一个方法append,我们可以通过append向FormData里面添加各种需要提交的数据。

url:/adata/adata/payment/PaymentAction/upload.menu----指的是你Java接受信息的action路径

_pathName=/adata//payment.jsp-----------指的是你HTML5页面的虚拟路径。

alert(result);-------指的是从Java后台返回的信息。

function upload() {
  mydata = document.getElementById("mydata").files[0];
  formData = new FormData();
  formData.append("mydata", mydata);

$.ajax({
              contentType:"multipart/form-data",
              url:"/adata/adata/payment/PaymentAction/upload.menu?_pathName=/adata//payment.jsp",
              type:"POST",
              data:formData,
              dataType:"text",
              processData: false, // 告诉jQuery不要去处理发送的数据
              contentType: false, // 告诉jQuery不要去设置Content-Type请求头
              success: function(result){
              alert(result);
}
});

}

Java代码:

 String savePath = "d:/";//存储路径
            String retMsg = "";//定义将返回给客户端的信息
            try {
                if (ServletFileUpload.isMultipartContent(request)) {
                    List<FileItem> items = new ServletFileUpload(new DiskFileItemFactory()).parseRequest(request);
                    for (FileItem item : items) {
                        if (!item.isFormField()) {// 过滤掉表单中非文件域
                            String fileType = item.getName().substring(item.getName().lastIndexOf(".") + 1).toLowerCase();//文件类型
                            String fileName = new Date().getTime() + "." + fileType; //保存的文件名
                            String filePath = savePath + "\\" + fileName; //保存的文件路径  

                            BufferedInputStream in = new BufferedInputStream(item.getInputStream());// 获得文件输入流
                            BufferedOutputStream out = new BufferedOutputStream(new FileOutputStream(new File(filePath)));// 获得文件输出流
                            org.apache.commons.fileupload.util.Streams.copy(in, out, true);// 开始把文件写到指定的上传文件夹
                            retMsg += "上传文件成功!";
                            in.close();
                            out.close();
                        }
                    }
                }
                response.setContentType("text/html;charset=utf8");
                PrintWriter pw = response.getWriter();
                pw.print(retMsg);
                pw.flush();
                pw.close();
               //根据自己需要返回页面一个 retMsg         // return retMsg  证明上传成功
            } catch (Exception e) {
                e.printStackTrace();
            } 
时间: 2024-10-15 19:34:50

单文件文件上传到服务器(HTML5+js+Java)的相关文章

Myeclipse中文件已经上传到服务器目录下,文件也没有被占用,但是页面中无法读取和使用问题的解决方法

这个问题是由于Myeclipse中文件不同步引起的.在Myeclipse中,工程文件是由Myeclipse自动扫描添加的,如果在外部修改了工程目录中的文件但又关闭了自动刷新功能,则会引起文件不同步.此外,在外部没有修改Myeclipse工程中的文件也有可能引起该问题. 解决方法: 有两种解决方法: 1)手动刷新.即在Myeclipse的工程目录中,右键refresh(或者按下F5). 2)配置Myeclipse的选项: a)Myeclipse启动时,刷新workspace,即勾选:window-

HTML5 文件域+FileReader 分段读取文件并上传到服务器(六)

说明:使用Ajax方式上传,文件不能过大,最好小于三四百兆,因为过多的连续Ajax请求会使后台崩溃,获取InputStream中数据会为空,尤其在Google浏览器测试过程中. 1.简单分段读取文件为Blob,ajax上传到服务器 <div class="container"> <div class="panel panel-default"> <div class="panel-heading">分段读取文件

web操作文件的上传到服务器 并且读取出来

1.文件的上传-servlet实现文件上传---核心API-DiskFileItemFactory 一.文件上传概述 l  实现web开发中的文件上传功能,需完成如下二步操作: ?    在web页面中添加上传输入项 ?    在servlet中读取上传文件的数据,并保存到本地硬盘中. l  如何在web页面中添加上传输入项? ?    <input type="file">标签用于在web页面中添加文件上传输入项,设置文件上传输入项时须注意: ?    1.必须要设置in

jquery文件批量上传控件Uploadify3.2(java springMVC)

人比較懒  有用为主 不怎么排版了 先放上Uploadify的官网链接:http://www.uploadify.com/  -->里面能够看到PHP的演示样例,属性说明,以及控件下载地址.分flash版(免费)和html5版(收费). 官网上能够看到效果演示. 另外在网上找到了一份Uploadify3.2的中文API文档.能够在我上传的资源里面下载. 以下就是一个基于springMVC的文件上传演示样例,看起来可能比文档更直观一些··· 1.下载插件放到项目中 2.在jsp页面中引入下面JS和

从网络中获取文件,上传到服务器

1 /** 2 * 模拟form表单的形式 ,上传文件 以输出流的形式把文件写入到url中,然后用输入流来获取url的响应 3 * 4 * @param url 5 * 请求地址 form表单url地址 6 * @param filePath 7 * 文件在服务器保存路径 8 * @return JSONObject 9 * url的响应信息返回值 10 * @throws IOException 11 * 文件不存在 12 */ 13 public static JSONObject send

Android使用OKHttp库实现视频文件的上传到服务器

目录 1 服务器接口简介 2 Android端代码实现 2.1 xml布局文件 2.2 Activity类 2.3 Okhttp网络通信类 1 服务器接口简介 此处我使用的服务器接口是使用Flask编写,具体实现代码: # -*- coding: utf-8 -*- from flask import Flask, render_template, jsonify, request import time import os import base64 app = Flask(__name__)

【转】linux下,如何把整个文件夹上传到服务器(另一台linux)

原文转自:https://zhidao.baidu.com/question/1046040541327493019.html 1.Linux下目录复制:本机->远程服务器 scp  -r /home/shaoxiaohu/test1  [email protected]:/home/test2 #test1为源目录,test2为目标目录,[email protected]为远程服务器的用户名和ip地址. 2.Linux下目录复制:远程服务器->本机 scp  -r [email protec

HTML表单制作,上传到服务器

表单: info.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <div align="center"> <form action="result.php" method

文件夹内多文件上传到服务器

文件夹上传至服务器希望可以给你一点帮助 直接上代码jsp页面 <div style="text-align:center; vertical-align:middel" id="uploadFile"> <input type="file" name="file" id="file" multiple="multiple" webkitdirectory /> &

Web大文件(夹)上传(断点续传)控件-Xproer.HttpUploader6

版权所有 2009-2017荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com/ 产品首页:http://www.ncmem.com/webapp/up6.2/index.asp 在线演示:http://www.ncmem.com/products/up6.3/index.htm 产品介绍:http://www.cnblogs.com/xproer/archive/2012/10/26/2741264.html 升级日志:http://www.cnblogs.