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

  到这里文件上传已经完全实现了,具体响应回去的文件上传路径要怎么处理,就看需求了。

时间: 2024-11-08 22:49:49

javascript插件uploadify简单实现文件上传的相关文章

【Jsp】使用jspsmartupload完成简单的文件上传系统

请不要妄想,一个html的file控件,再加上javascript与jquery语句就可以完成文件上传, 文件上传系统从来是需要配合服务器来完成的 用户把自己的文件上传到服务器上 文件上传系统是很复杂的一件事. html的file控件向动态网页语言以post方式通过enctype="multipart/form-data"解码成二进制文件就不管了 动态网页需要对其通过asp,jsp,php,asp.net编程,才能正常把文件保存到服务器中 网络上对文件处理的方法是五花八门,让人无从下手

jQuery插件AjaxFileUpload实现ajax文件上传时老是执行error方法 问题原因

今天在用jQuery插件AjaxFileUpload实现ajax文件上传时,遇到一个问题,如图: 老是执行error,无法执行succes方法,追踪ajaxfileupload.js源码发现: 当执行if(type=="json")    eval("data = "+data);会抛出异常,导致在处理异常的时候将status = "error" 因此一直执行error方法. 上网查询,得知eval函数是用来执行一段js代码,而并不是如我所想的反

nodejs 简单http 文件上传demo

// 这是一个简单的Node HTTP,能处理当前目录的文件 // 并能实现良种特殊的URL用于测试 // 用http://localhost:8000 或http://127.0.0.1:8000 连接这个服务器 // 首先,加载所有要用的模块 var http = require('http'); // HTTP服务器API var fs = require('fs'); // 文件系统API var server = new http.Server(); // 创建新的HTTP服务器 va

jfinal初接触,一个简单的文件上传例子

写了个上传的小例子. 从jfinal官网下载jfinal-1.8_demo_for_jsp.zip 然后下载jfinal-1.8-lib.zip 按要求删掉该删除的,引入一些包,之后的项目结构: DemoConfig.java中配置路由,只留下了根路径: /** * 配置路由 */ public void configRoute(Routes me) { me.add("/", CommonController.class); //me.add("/blog", B

python写个简单的文件上传是有多难,要么那么复杂,要么各种,,,老子来写个简单的

def upload(url,params): ''' 上传文件到服务器,不适合大文件 @params url 你懂的 @params {"action":"xxx","@file","file_path"} 普通参数 key:value 文件key头部加@ ''' import os import urllib2 BOUNDARY = "0450de9528f040078csuxianbaozic06"

基于Java的一个简单的文件上传下载功能

最近在公司给客户端做接口,有一个图片上传和文件下载的功能,本来想用Struts来做文件上传下载,但是看了下公司好像没有这个配置,然后看了下同事的代码,才发现原来Apache也可以简单的实现文件上传下载. 首先引入commons-io-2.2.jar FileUtils为我们提供了很多对文件的操作的方法,比如上传整个文件夹的文件.上传单个文件等 然后请看代码下载: public static void uploadFile(String targetDirectory,String targetF

使用jsp/servlet简单实现文件上传与下载

使用JSP/Servlet简单实现文件上传与下载 通过学习黑马jsp教学视频,我学会了使用jsp与servlet简单地实现web的文件的上传与下载,首先感谢黑马.好了,下面来简单了解如何通过使用jsp与servlet实现文件上传与下载. 在写代码之前,我们需要导入两个额外的jar包,一个是common-io-2.2.jar,另一个是commons-fileupload-1.3.1.jar,将这个两个jar 包导入WEB-INF/lib目录里. 首先,想要在web端即网页上实现文件上传,必须要提供

利用Socketserver实现简单的文件上传

利用Socketserver实现简单的文件上传 server.py #!/usr/bin/env python #coding:utf-8 import SocketServer import os class MyServer(SocketServer.BaseRequestHandler):     def handle(self):         base_path = 'C:/temp'         conn = self.request                 print

DVWA靶机--简单的文件上传漏洞

简单的文件上传漏洞(靶机安全级别:low) 事先准备好一句话木马,密码为pass 上传一句话木马,显示上传路径(一般网站是不会显示路径的,这里靶机为了方便你测试漏洞,直接显示出了路径: ../../hackable/uploads/pass.php succesfully uploaded!) 我们先尝试打开看看,将路径拼接到url后面:http://192.168.147.137/dvwa/hackable/uploads/pass.php 访问成功,但是没有显示任何东西(因为是php文件)