写在前面:

  上传文件的方式有很多,最近在做项目的时候,一开始也试用了利用jquery的插件ajaxFileUpload来上传大文件,下面,用一个上传文件的简单例子,记录下,学习的过程~~~

  还是老样子,上代码最明了啦。。

  前台jsp页面:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
String scheme = request.getScheme();
String serverName = request.getServerName();
String contextPath = request.getContextPath();
int port = request.getServerPort(); //网站的访问跟路径
String baseURL = scheme + "://" + serverName + ":" + port
+ contextPath;
request.setAttribute("baseURL", baseURL);
%>
<html>
<head>
<title>ajaxFileUpload文件上传简单示例</title>
<script src="${baseURL}/ligerui2/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>
<%--引入文件上传插件--%>
<%--jquery文件上传插件--%>
<script src="${baseURL}/script/ajaxfileupload.js" type="text/javascript"></script> <script type="text/javascript"> //打开选择文件对话框
function text_click(){
$("#upload").click();
} //选择文件后触发事件函数
function test(){
//将文件名赋值到文本输入框
var fileName = $("#upload").val();
$("#fileText").val(fileName);
} //文件上传
function btn_upload(){
var fileName = $("#upload").val();
var fileName2 = $("#fileText").val();
if(fileName == "" || fileName2 == ""){
alert("请先选择哦~~~");
} $.ajaxFileUpload({ //Jquery插件上传文件
url: '${baseURL}/uploadFile3',
secureuri: false,//是否启用安全提交 默认为false
fileElementId: "upload", //type="file"的id
dataType: "text", //返回值类型 success: function (data)
{
if(data.indexOf("success")!=-1){//上传成功 alert("上传成功!");
}else{
alert("上传失败。。");
} }, }); }
</script> </head>
<body style="padding:10px">
<div id="layout1">
<div >
文件名(上传): <input type="text" style="height: 25px;width: 250px;" id="fileText" onclick="text_click()" /> <button onclick="btn_upload()">开始上传</button>
</div> <%--将文件隐藏,由点击输入框来触发选择文件--%>
<div hidden="hidden">
<%--这里不要忘记name,因为在后台是是以name来接收的--%>
<input type="file" id="upload" name="upload" onchange="test();">
</div>
</div>
</body>
</html>

  后台action:

/**
* Description:com.ims.action
* Author: Eleven
* Date: 2017/12/26 10:50
*/
@Controller("FileAction")
public class FileAction extends BaseAction{ //记得提供对应的get set方法
//上传文件对象(和表单type=file的name值一致)
private File upload;
//文件名
private String uploadFileName;
//上传类型
private String uploadContentType; public void uploadFile3() throws Exception{ String str = "D:/upload33/"; //文件保存路径
System.out.println("文件路径===="+uploadFileName);
String realPath = str + uploadFileName;
File tmp =new File(realPath);
FileUtils.copyFile(upload, tmp);
System.out.println("上传文件"+uploadFileName+",大小:"+(upload.length()/1024/1024)+"M"); //当文件上传成功,用流写消息给页面
PrintWriter writer = ServletActionContext.getResponse().getWriter();
writer.print("success"); } public File getUpload() {
return upload;
} public void setUpload(File upload) {
this.upload = upload;
} public String getUploadFileName() {
return uploadFileName;
} public void setUploadFileName(String uploadFileName) {
this.uploadFileName = uploadFileName;
} public String getUploadContentType() {
return uploadContentType;
} public void setUploadContentType(String uploadContentType) {
this.uploadContentType = uploadContentType;
}
}

  这里还是说一下,对于文件的接收,其命名都是要以上传文件对象名开头的,比如文件对象变量名为upload,则接收文件名的变量为uploadFileName,这里稍微注意下。

  struts.xml配置:

 <action name="uploadFile3" class="FileAction" method="uploadFile3">
</action>

  到这里,文件上传的简单功能就已经完成了,下面,运行截图:

 对于前面开头说的是大文件的上传,那么这个上传文件的最大限度是多少?在测试过程中发现,在struts.xml文件中可以控制上传文件的大小:

<!--这里可以控制整个项目中上传文件的大小-->
<constant name="struts.multipart.maxSize" value="7340000"/>

  我这里举例配置的value值是7340000,假设我现在上传文件大小有7M,7 * 1024 * 1024 = 7340032,比我设置的value值要大,故此时上传文件会失败,抛出异常:

org.apache.commons.fileupload.FileUploadBase$SizeLimitExceededException: the request was rejected because its size (7576262) exceeds the configured maximum (7340000)

  所以我们可以通过设置这个值,来控制上传文件的大小,查阅资料,也是可以局部进行控制上传文件的大小的,即设置fileUpload拦截器,这里就不过多进行设置了,等以后有用到,再去研究也不迟。

  开心。。。。。。。

  

ajaxFileUpload上传文件简单示例的更多相关文章

  1. ajaxFileUpload上传文件后提示下载的问题

    在某些版本浏览器下ajaxFileUpload上传文件会提示下载, 1:为什么? 可以观察到,即便返回 JsonResult 在返回的头中也没有任何消息体,直接理解为文本了. 2:解决方案 前端: f ...

  2. 在使用 AjaxFileUpload 上传文件时,在项目发布到 iis 后,图片不能预览

    在使用 AjaxFileUpload  上传文件时,图片已经上传成功了,在站点没有发布时,可以预览,可是在项目发布到 iis 后,图片就不能预览,在网上找了很多的方案也没解决,最后的解决方案如下: 1 ...

  3. ajaxFileUpload上传文件没反应

    调用jquery的ajaxFileUpload异步上传文件,IE浏览器不进入success问题 原因:json转换异常,ie浏览器处理后的返回json没有<pre>标签,直接是完整的jso ...

  4. springmvc+ajaxFileUpload上传文件(前后台彻底分离的情况下)

    首先是导入jar包: web.xml: <servlet> <servlet-name>mvc-dispatcher</servlet-name> <serv ...

  5. Jquery+ajaxfileupload上传文件

    1.说明 ajaxfileupload.js是一款jQuery插件,用于通过ajax上传文件. 下载地址:http://files.cnblogs.com/files/lengzhan/ajaxfil ...

  6. SpringMvc通过controller上传文件代码示例

    上传文件这个功能用的比较多,不难,但是每次写都很别扭.记录在此,以备以后copy用. package com.**.**.**.web.api; import io.swagger.annotatio ...

  7. springMVC上传文件简单案例

    html <form name="Form2" action="/SpringMVC006/fileUpload2" method="post& ...

  8. 解决ajaxfileupload上传文件在IE浏览器返回data为空问题

    关于ajaxfileupload,建议还是别用,已经没有人维护的脚本了,笔者就是入了这个坑. 在IE浏览器中ajaxfileupload返回data为空 jq.ajaxFileUpload ( { u ...

  9. Dropzone.js拖拽上传(简单示例)

    今天碰到一个需求,页面上有“点击上传”的按钮,点击可以执行上传事件,从桌面拖拽图片拖拽到任何地方,都可以执行上传,且不影响点击按钮事件.下面是简单示例: 简单示例如下: <!DOCTYPE ht ...

随机推荐

  1. angular2.x指令

    1.指令 *ngIf: 判断 isActive 为true时 <user-detail> 生效展示 <user-detail *ngIf="isActive"&g ...

  2. [动态规划]P1220 关路灯

    题目描述 某一村庄在一条路线上安装了n盏路灯,每盏灯的功率有大有小(即同一段时间内消耗的电量有多有少).老张就住在这条路中间某一路灯旁,他有一项工作就是每天早上天亮时一盏一盏地关掉这些路灯. 为了给村 ...

  3. Python函数篇

    1.函数名的命名规则: 函数名必须以下划线或字母开头,可以包含任意字母.数字或下划线的组合.不能使用任何的标点符号: 函数名是区分大小写的. 函数名不能是保留字. 2. 形参和实参 形参:形式参数,不 ...

  4. 微服务配置内容《网上copy》=========》如何创建一个高可用的服务注册中心

    前言:首先要知道什么是一个高可用的服务注册中心,基于spring boot建成的服务注册中心是一个单节点的服务注册中心,这样一旦发生了故障,那么整个服务就会瘫痪,所以我们需要一个高可用的服务注册中心, ...

  5. 第四届河南省ACM 节能 区间DP

    1001: 节 能 时间限制: 1 Sec  内存限制: 128 MB 提交: 21  解决: 9 [提交][状态][讨论版] 题目描述 Dr.Kong设计的机器人卡多越来越聪明.最近市政公司交给卡多 ...

  6. UWP 实现App多语言为所欲为切换

    为所欲为,嗯 话不多说,先看效果吧(事先说明,我的方法不是最好的,但是我用着最有效.) [吐槽一下博客园上传的图片,我的App敲鸡漂亮滴,自带亚克力效果,怎么图片上传上来这么多的噪点啊.] [ 商店地 ...

  7. PHPstorm 函数时间注释的修改

    正常的PHPstorm里面函数方法的注释是没有动态时间设置的,但是看了PHP file里面有时间日期的注释,而PHP Function Doc Comment 却没有,让很多PHPer很头疼,今天在搜 ...

  8. ZTREE改版 -- 增删减 -- 图标字体化 完整改版

    引言 这次主要更新增删改功能以及修复存在的一些bug:图标能动态改变,回调函数添加 ZTREE改版功能完善 前面文章对于改版过程做了较详细的解释,这里就不多加赘述了,直接看效果图: 增加按钮: 修改节 ...

  9. extjs 关于dom操作的几个库

    经过几天的学习研究,发现ext与jquery的设计思路完全是来自两个方向. jquery是内聚,把所有东西都放在$的下面,而ext是采用分模块的设计思路,每个功能封装一个库.这样就形成了各自的实用风格 ...

  10. RobotFramework自动化测试框架-移动手机自动化测试Element Attribute Should Match关键字的使用

    Element Attribute Should Match 关键字用来判断元素的属性值是否和预期值匹配,该关键字接收四个参数[ locator | attr_name | match_pattern ...