javascript插件uploadify简单实现文件上传
最近在学习mvc,需要用到文件上传的功能,找了很多的jquery插件,最后决定使用uploadify这个插件,参照了各位大神的博客,终于勉勉强强会用了。在此,做一下笔记,方便以后忘了查看。
首先在官网上下载uploadify插件。http://www.uploadify.com/download/
解压后有以下文件:
然后在把下载下来的文件解压到项目文件夹中(只要项目可以引用到就可以了,但还是应该规范一点,养成良好的习惯)。
再然后,就是把uploadify.css和jquery.uploadify.min.js文件引用到页面中(当然还需要引用jquery文件)。
在页面创建一个type为file的input标签(属性name和id可以随便取,但是在做初始化时,就要使用到自己取得name或id值了)。
初始化。uploadify有一些参数需要设置的,我只设置了自己需要的参数,更多参数我参考了博客:http://blog.sina.com.cn/s/blog_5079086b0101fkmh.html
到此前端的文件上传已经完成了,接下来,就是后端如何处理上传文件了。
#region 文件上传+public ActionResult Upload(HttpPostedFileBase fileData)
/// <summary>
/// 文件上传
/// </summary>
/// <returns></returns>
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Upload(HttpPostedFileBase fileData)
{
if (fileData != null)
{
try
{
// 文件上传后的保存路径(找到自己要上传到的文件夹)
string filePath = Server.MapPath("~/Areas/uploadFile");
if (!Directory.Exists(filePath))
{
Directory.CreateDirectory(filePath);
}
string fileName = Path.GetFileName(fileData.FileName);// 原始文件名称
string fileExtension = Path.GetExtension(fileName); // 文件扩展名
string saveName = Guid.NewGuid().ToString() + fileExtension; // 保存文件名称
string path = filePath + "\\" + saveName;
fileData.SaveAs(path); return Json(new { Success = true, FileName = fileName, SaveName = saveName });
}
catch (Exception ex)
{
return Json(new { Success = false, Message = ex.Message }, JsonRequestBehavior.AllowGet);
}
}
else
{
return Json(new { Success = false, Message = "请选择要上传的文件!" }, JsonRequestBehavior.AllowGet);
}
}
#endregion
到这里文件上传已经完全实现了,具体响应回去的文件上传路径要怎么处理,就看需求了。
//-------更新(以上上传大文件出现http error 500错误)
解决这个错误不是很难,只要三步就可以了。
1.增加属性
'fileSizeLimit': '0',//单个文件大小,0为无限制,可接受KB,MB,GB等单位的字符串值
2.在web.config中的system.web节点下增加节点
<httpRuntime maxRequestLength="1073741824" executionTimeout="3600" />
3.在system.webServer节点下增加节点
<security>
<requestFiltering>
<!--修改服务器允许最大长度-->
<requestLimits maxAllowedContentLength="1073741824"/>
</requestFiltering>
</security>
javascript插件uploadify简单实现文件上传的更多相关文章
- 服务器文档下载zip格式 SQL Server SQL分页查询 C#过滤html标签 EF 延时加载与死锁 在JS方法中返回多个值的三种方法(转载) IEnumerable,ICollection,IList接口问题 不吹不擂,你想要的Python面试都在这里了【315+道题】 基于mvc三层架构和ajax技术实现最简单的文件上传 事件管理
服务器文档下载zip格式 刚好这次项目中遇到了这个东西,就来弄一下,挺简单的,但是前台调用的时候弄错了,浪费了大半天的时间,本人也是菜鸟一枚.开始吧.(MVC的) @using Rattan.Co ...
- jQuery插件AjaxFileUpload实现ajax文件上传时老是运行error方法 问题原因
今天在用jQuery插件AjaxFileUpload实现ajax文件上传时,遇到一个问题,如图: 老是运行error.无法运行succes方法,追踪ajaxfileupload.js源代码发现: wa ...
- 使用jsp/servlet简单实现文件上传与下载
使用JSP/Servlet简单实现文件上传与下载 通过学习黑马jsp教学视频,我学会了使用jsp与servlet简单地实现web的文件的上传与下载,首先感谢黑马.好了,下面来简单了解如何通过使用 ...
- WordPress Complete Gallery Manager插件‘upload-images.php’任意文件上传漏洞
漏洞名称: WordPress Complete Gallery Manager插件‘upload-images.php’任意文件上传漏洞 CNNVD编号: CNNVD-201309-377 发布时间 ...
- Django 实现简单的文件上传
今天分享一下Django实现的简单的文件上传的小例子. 步骤 创建Django项目,创建Django应用 设计模型 处理urls.py 以及views.py 设计模板,设计表单 运行项目,查看数据库 ...
- DVWA靶机--简单的文件上传漏洞
简单的文件上传漏洞(靶机安全级别:low) 事先准备好一句话木马,密码为pass 上传一句话木马,显示上传路径(一般网站是不会显示路径的,这里靶机为了方便你测试漏洞,直接显示出了路径: ../../h ...
- Java实现一个简单的文件上传案例
Java实现一个简单的文件上传案例 实现流程: 1.客户端从硬盘读取文件数据到程序中 2.客户端输出流,写出文件到服务端 3.服务端输出流,读取文件数据到服务端中 4.输出流,写出文件数据到服务器硬盘 ...
- javascript实现简单多文件上传
该上传功能主要用到html5新属性FormData,通过XMLHttpRequest对象send到服务器,支持文件多选和多次选择.文件去重.移除已选文件等 1.html代码 <div class ...
- 使用Uploadify(UploadiFive)多文件上传控件遇到的坑
最近项目中需要实现多文件上传功能,于是结合需求最终选择了Uploadify这一款控件来实现.相比其他控件,Uploadify具有简洁的界面,功能API基本可以解决大多数需求,又是基于jquery的,配 ...
随机推荐
- JSON对象如何转化为字符串?
序列化 定义 指将 JavaScript 值转化为 JSON 字符串的过程. JSON.stringify() 能够将 JavaScript 值转换成 JSON 字符串.JSON.stringify( ...
- VI打开和编辑多个文件的命令 分屏操作
VI打开和编辑多个文件的命令 可分两种情况: 1.在同一窗口中打开多个文件: vi file1 file2 file3:n 切换到下一个文件 (n=next):N 切换到上一个文件 2.在不同窗口 ...
- EPPLUS之外的选择,EXCEL的操作(NPOI,POI(java))
NPOI 编辑 NPOI 是 POI 项目的 .NET 版本.POI是一个开源的Java读写Excel.WORD等微软OLE2组件文档的项目. 中文名 NPOI 优 势 传统操作Excel遇到的 ...
- Source Insight 中使用 AStyle 代码格式工具
Source Insight 中使用 AStyle 代码格式工具 彭会锋 2015-05-19 23:26:32 Source Insight是较好的代码阅读和编辑工具,不过source in ...
- 《javascript高级程序设计》第21章 Ajax和Comet
21.1 XMLHttpRequest 对象 The XMLHttpRequest Object 21.1.1 XHR 的用法 XHR Usage 21.1.2 HTTP 头部信息 XHR Head ...
- inline-block的简单理解
1. 概念display:inline-block 将对象呈现为inline对象,但是对象的内容作为block对象呈现.之后的内联对象会被排列在同一行内.比如我们可以给一个link(a元素)inlin ...
- 解决qt5在ubuntu下无法调用fcitx输入中文的问题
如题,在以前安装qt5.2.1的时候就遇到了这个问题.当时上网搜了很多资料,结果都解决不了,发现都是复制来复制去. 这次因为要用qt5.3.0在ubuntu下写个程序,所以不解决这个问题不行了.就继续 ...
- js构建工具和预编译
Gulp应该和Grunt比较,他们的区别我就不说了,说说用处吧.Gulp / Grunt 是一种工具,能够优化前端工作流程.比如自动刷新页面.combo.压缩css.js.编译less等等.简单来说, ...
- PDF 补丁丁 0.4.1 版:新增嵌入中文字库、替换文档字库的功能
PDF 补丁丁 0.4.1 版新增了嵌入中文字库.替换文档字库的功能. 嵌入汉字字库 历史上有一批黄底黑字的 PDF 文档.这批文档都具有相同的问题:没有嵌入字库.在一些设备上阅读时显示乱码.复制文本 ...
- 在单元测试中指定log4j的配置文件
在开发过程中,我们会使用到log4j来输出日志,我们希望在单元测试的时候,只看到部分日志信息,或者定义日志输出的级别. 这个时候手工指定log4j的配置文件: 具体做法如下: 定义类如下: i ...