swfupload组件上传文件
前段时间做文件上传用的是H5的一个插件,由于浏览器的兼容性不好,所以又换了一个Flash版本的上传文件插件,感觉这个上传插件的使用方式跟H5的差不多,有些雷同。不过,由于后续浏览不再支持Flash(略囧),所以,暂时还没有找到能够完美兼容浏览器的上传文件插件。各位网友如果有好的插件,请推荐下。
View代码:
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Content/swfupload/swfupload.js"></script>
<script src="~/Content/swfupload/handlers.js"></script>
<script type="text/javascript">
var swfu;
window.onload = function () {
swfu = new SWFUpload({
// Backend Settings
upload_url: "/UploadFile/UploadFile",
post_params : {
}, // File Upload Settings
file_size_limit : "2 MB",
file_types : "*.jpg;*.bmp;*.jpg;*.jpeg;*.png;*.gif",
file_types_description : "JPG Images;bmp Images;jpg Images;jpeg Images;png Images;gif Images",
file_upload_limit : , // Zero means unlimited // Event Handler Settings - these functions as defined in Handlers.js
// The handlers are not part of SWFUpload but are part of my website and control how
// my website reacts to the SWFUpload events.
swfupload_preload_handler : preLoad,
swfupload_load_failed_handler : loadFailed,
file_queue_error_handler : fileQueueError,
file_dialog_complete_handler : fileDialogComplete,
upload_progress_handler : uploadProgress,
upload_error_handler : uploadError,
upload_success_handler : uploadSuccess,
upload_complete_handler : uploadComplete, // Button settings
button_image_url: "/Content/swfupload/images/XPButtonNoText_160x22.png",
button_placeholder_id : "spanButtonPlaceholder",
button_width: ,
button_height: ,
button_text : '<span class="button">上传文件<span class="buttonSmall">(2 MB Max)</span></span>',
button_text_style : '.button { font-family: Helvetica, Arial, sans-serif; font-size: 14pt; } .buttonSmall { font-size: 10pt; }',
button_text_top_padding: ,
button_text_left_padding: , // Flash Settings
flash_url : "/Content/swfupload/swfupload.swf", // Relative to this file
flash9_url: "/Content/swfupload/swfupload_FP9.swf", // Relative to this file custom_settings : {
upload_target : "divFileProgressContainer"
}, // Debug Settings
debug: false
}); //文件上传成功后,给用户提示信息
function uploadSuccess(file, serverData) {
var result = serverData.split('|');
if (result[] == 'ok') {
alert(result[]);
}
}
} </script>
</head>
<body>
<div id="content">
<div id="swfu_container" style="margin: 0px 10px;">
<div>
<span id="spanButtonPlaceholder"></span>
</div>
<div id="divFileProgressContainer" style="height: 75px;"></div>
<div id="thumbnails"></div>
</div>
</div>
</body>
</html>
Controller代码:
private string uploadPath = ConfigurationManager.AppSettings["UploadFile"];//文件上传路径
private string fileFormat = ConfigurationManager.AppSettings["FileFormat"];//允许上传的文件格式 /// <summary>
/// 保存上传文件
/// </summary
/// <returns></returns>
public ActionResult UploadFile()
{
HttpPostedFileBase fileData = Request.Files["Filedata"];
string fileExt = Path.GetExtension(fileData.FileName); string[] formatArray = fileFormat.Split('|');
if (!formatArray.Contains(fileExt)) //前端有格式的限制,但我觉得安全起见,后端还是验证下好点
{
return Content("no|上传文件格式不正确");
}
string saveDirectory = uploadPath + "/UploadFile/";//保存上传文件的文件夹
if (!Directory.Exists(saveDirectory))
{
Directory.CreateDirectory(saveDirectory);
} string fileName = Guid.NewGuid().ToString() + fileExt;
string savePath = saveDirectory + fileName;
fileData.SaveAs(savePath);//上传文件保存 return Content("ok|文件上传成功");
}
webconfig中的配置
<add key="UploadFile" value="E:/swfUploadFileStorage/"/>
<add key="FileFormat" value=".bmp|.jpg|.jpeg|.png|.gif"/>
swfupload组件上传文件的更多相关文章
- 使用commons-fileUpload组件上传文件
在近期的一个项目中有用到commons-fileUpload组件进行实现文件上传的功能(由于没用到框架),在使用的过程中有遇到一些问题,经过自己的琢磨也算顺利地将其解决了,在这里做个记录. 一.com ...
- EasyUI 关于IE使用window组件上传文件
有时候IE会对使用window组件上传文件(第二次)不生效,解决方案是: 将该window每次打开的时候,使用: $('#adUploadWindow').window('refresh', 'pan ...
- 关于commons-fileupload组件上传文件中文名乱码问题
java web开发,常用到的文件上传功能,常用的commons-fileupload和commons-io两个jar包.关于如何使用这两个jar来完成文件上传的功能,这里不做详解.使用commons ...
- 在Struts2中使用Uploadify组件上传文件
Uploadify是一个基于Jquery的文件上传组件,官网http://www.uploadify.com/可以在官网获得该组件,运行演示示例,下载帮助文档. 作为Web前端的增强技术,Jq ...
- javaweb-番外篇-Commons-FileUpload组件上传文件
一.Commons-FileUpload简介 Commons-FileUpload组件 Commons是Apache开放源代码组织的一个Java子项目,其中的FileUpload是用来处理HTTP文件 ...
- django Form组件 上传文件
上传文件 注意:FORM表单提交文件要有一个参数enctype="multipart/form-data" 普通上传: urls: url(r'^f1/',views.f1), u ...
- Ant Design Upload 组件上传文件到云服务器 - 七牛云、腾讯云和阿里云的分别实现
在前端项目中经常遇到上传文件的需求,ant design 作为 react 的前端框架,提供的 upload 组件为上传文件提供了很大的方便,官方提供的各种形式的上传基本上可以覆盖大多数的场景,但是对 ...
- [插件] 如何在一个页面中使用多个SWFUpload对象上传文件
首先需要引入相应的样式和JS文件,还需要借助jQuery的js 提供下载路径:http://pan.baidu.com/s/1EUzca ① 引入js <script type="te ...
- VUE -- 用组件上传文件和用xmlrequest上传
xmlrequest: sendForm(str, types) { var form = this.$refs.ipas_form; var oOutput = document.querySele ...
随机推荐
- 关于layui 三级联动 渲染报错解决方法
/** * 时间:2016年11月27日 * 作者:707200833 * 说明:依赖与jQuery和layui, 是基于layui开发的一个省市区联动的小插件, 使用上要基于layui的表单进行使用 ...
- [Shell] echo/输出 中引用命令
# 这样是错误的,是引用变量 echo "/Users/${whoami}/Desktop" >>> /Users//Desktop # 正确的写法应该是使用`` ...
- ZBrush细说3D海盗角色的创建艺术
一提到海盗,就不由自主想到了<加勒比海盗>,那个帅得一塌糊涂的杰克船长更是让人夜不能寐寝难安,但在艺术的世界里,角色无美丑,今天我们要讲的这位海盗,就与“帅气”八竿子打不着了,它甚至有点古 ...
- Spring cloud服务的提供者建立
1.0我们要在这里要建立一个服务的提供者模块,是一个module,类似于服务的公共模块 第一步:添加架包 <project xmlns="http://maven.apache.org ...
- tomcat-manager 设置
tomcat默认是没有用户登录控制的,需要登录manager,则需要配置角色与用户 1. 在conf/tomcat-users.xml中添加 <role rolename="manag ...
- alg--动态规划(dynamic planning)
怎么开头呢? 一句话概括吧, dp的思想就是递归的反思想. 参考的理化: https://www.cnblogs.com/steven_oyj/archive/2010/05/22/1741374.h ...
- PHP 闭包之变量作用域
在项目中,难免会遇到闭包的形式,那么在闭包中,变量的作用域到底是怎么样的呢.下面有几个简单的例子. e1 function test_1() { $a = 'php'; $func = funct ...
- Problem 10
Problem 10 # Problem_10.py """ The sum of the primes below 10 is 2 + 3 + 5 + 7 = 17. ...
- [置顶]
QQ空间技术架构之深刻揭密
QQ空间作为腾讯海量互联网服务产品,经过近七年的发展,实现了从十万级到亿级同时在线的飞跃.在这个过程中,QQ空间团队遇到了哪些技术挑战?其站点前后台架构随着业务规模的变化又进行了怎样的演进与变迁?成长 ...
- (0)资料官网【从零开始学Spring Boot】
Spring Boot官网:http://projects.spring.io/spring-boot/ Eclipse官网:http://www.eclipse.org/ Maven官网:http: ...