上传(浏览)Uploadfy插件的使用

来源:互联网 发布:c语言自学网 编辑:程序博客网 时间:2024/06/05 09:20

<1>

Uploadify v3.2.1 参数说明

<!DOCTYPE html><html><head>    <meta name="viewport" content="width=device-width" />    <title>Create</title>    <link href="~/third-party/easyui/jquery-easyui-1.4.1/themes/default/easyui.css" rel="stylesheet" />    <link href="~/third-party/uploadify-v3.2.1/uploadify.css" rel="stylesheet" />    <script src="~/Scripts/jquery-1.10.2.min.js"></script>    <script src="~/third-party/uploadify-v3.2.1/jquery.uploadify.min.js"></script></head><body>    @using (Html.BeginForm())    {        @Html.AntiForgeryToken()        <div class="panel" style="display: block; width: 450px;">            <div class="panel-header">                <div class="panel-title">新增</div>            </div>            <div class="easyui-panel panel-body">                <table>                    <tr>                        <td>页面分类:</td>                        <td>                            <select id="CLASSIFICATION" name="CLASSIFICATION" disabled>                                <option value="1">首页</option>                                <option value="2">帮助中心</option>                            </select>                        </td>                    </tr>                    <tr>                        <td>图片:</td>                        <td style="width:300px;padding-top:10px;">                            <input type="text" id="PIC_NAME" name="PIC_NAME" style="display:none;" />                            <span id="uploadify"></span>                            <div>                                <img id="ImgResult" style="max-width: 300px; max-height: 150px; display:none;" />                            </div>                        </td>                    </tr>                    <tr style="display:none;">                        <td>图片链接(相对路径):</td>                        <td><input type="text" id="IMG_URL" name="IMG_URL" /></td>                    </tr>                    <tr>                        <td>链接地址(绝对路径):</td>                        <td><input type="url" id="LINK_URL" name="LINK_URL" /></td>                    </tr>                    <tr>                        <td><input type="submit" value="新增" class="btn btn-default" /></td>                        <td><a href="/Ms_Pic_Banner/Index">返回列表</a></td>                    </tr>                </table>            </div>        </div>    }</body></html>
<script type="text/javascript">    $(function () {        $('#uploadify').uploadify({            uploader: '/Ms_Pic_Banner/PicUpload',// 服务器端处理地址            swf: '/third-party/uploadify-v3.2.1/uploadify.swf',            width: 60,            height: 23,            buttonText: "浏  览",            buttonClass: "uploadify-button-new",            fileTypeExts: "*.jpg;*.jpeg;*.png",            fileTypeDesc: "请选择 jpg jpeg png 文件",            fileSizeLimit: "4MB", //设置可以上传文件的最大大小            multi: false,            onUploadStart: function (file) {//settings是设置的意思。这段代码的意思就是:设置formData的值为{@foreach (string k in Request.Cookies.AllKeys)                //{ @:'cookie_@(k)': '@Request.Cookies[k].Value', });}的一个键值对集合                $("#uploadify").uploadify("settings", "formData", {@foreach (string k in Request.Cookies.AllKeys)                {                    @:'cookie_@(k)': '@Request.Cookies[k].Value',                                            }'': ''                });            },            onSelectError: function (file, errorCode, errorMsg) {                switch (errorCode) {                    case -110:                        //$('#uploadify').uploadify('settings', 'fileSizeLimit')的意思是获取fileSizeLimit这个属性的值【$('#uploadify').uploadify()的参数问题:当只有两个参数的情况下,表示获取值。如果有三个参数,表示设置值。参考上面的设置值的方法】                        alert("文件 [" + file.name + "] 大小超出系统限制的" + jQuery('#uploadify').uploadify('settings', 'fileSizeLimit') + "大小!");                        break;                }            },            onUploadSuccess: function (file, data, response) {                if (data != "") {                    $("#ImgResult").show().attr("src", "/upload/banner/" + data);                    $("#PIC_NAME").val(file.name);                    $("#IMG_URL").val(data);                }            }        });    });</script>

Ms_Pic_Banner控制器

/// <summary>        /// 图片上传处理        /// </summary>        /// <param name="Filedata"></param>        /// <returns></returns>        [UserAuthorizeAttribute(ActionType = (int)UserPermissionEnum.Create, ControllerName = "Ms_Pic_Banner")]//权限处理        public string PicUpload(HttpPostedFileBase Filedata)        {            try            {                // 如果没有上传文件                if (Filedata == null || string.IsNullOrEmpty(Filedata.FileName) || Filedata.ContentLength == 0)                    return "";                //判断是否为图片                if (!PictureOperate.isImg(Filedata.FileName))                    return "";                //保存原图                string filename = System.IO.Path.GetFileName(Filedata.FileName);                string filepath = this.Server.MapPath(string.Format("~/upload/banner/{0}", filename));                Filedata.SaveAs(filepath);                //处理原图,并保存处理后的图片                string tempFileName = "zc_" + DateTime.Now.ToFileTime() + Filedata.FileName.Substring(Filedata.FileName.Split('.')[0].Length);//重命名图片名称                string tempFilePath = this.Server.MapPath(string.Format("~/upload/banner/{0}", tempFileName));                PictureOperate.CutForCustom(Filedata.InputStream, tempFilePath, 1920, 300, 0);//对图片进行裁剪处理:定长宽裁剪按模版比例最大范围的裁剪图片并缩放至模版尺寸                //删除原图                FileInfo fi = new FileInfo(filepath);                fi.Delete();                //返回处理后的图片名称                return tempFileName;            }            catch            {                return "";            }        }


HttpPostedFileBase 类:

充当类的基类,这些类提供对客户端已上载的单独文件的访问。

属性


    
 名称说明公共属性ContentLength在派生类中重写时,获取上载文件的大小(以字节为单位)。公共属性ContentType在派生类中重写时,获取上载文件的 MIME 内容类型。公共属性FileName在派生类中重写时,获取客户端上文件的完全限定名。公共属性InputStream在派生类中重写时,获取一个 Stream 对象,该对象指向一个上载文件,以准备读取该文件的内容。页首

方法

    
 名称说明公共方法Equals(Object)确定指定的对象是否等于当前对象。 (继承自 Object。)受保护的方法Finalize允许对象在“垃圾回收”回收之前尝试释放资源并执行其他清理操作。 (继承自Object。)公共方法GetHashCode作为默认哈希函数。 (继承自 Object。)公共方法GetType获取当前实例的 Type (继承自Object。)受保护的方法MemberwiseClone创建当前 Object 的浅表副本。 (继承自Object。)公共方法SaveAs在派生类中重写时,保存上载文件的内容。公共方法ToString返回表示当前对象的字符串。 (继承自 Object。)页首

备注

HttpPostedFileBase类为抽象类,该类包含的成员与HttpPostedFile 类相同。使用HttpPostedFileBase 类可以创建一些派生类,这些派生类与HttpPostedFile 类相似,但是可以进行自定义并在 ASP.NET 管道外部使用。在执行单元测试时,通常使用派生类实现具有自定义行为的成员以实现正在测试的方案。

HttpPostedFileWrapper类是从HttpPostedFileBase 类派生的。HttpPostedFileWrapper类用作HttpPostedFile 类的包装。在运行时,通常使用HttpPostedFileWrapper 类的实例调用HttpPostedFile 对象的成员。

==============================================================================================



自己用一般处理程序进行测试
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <title></title>    <script src="js/jquery-1.11.2.js"></script>    <script src="uploadify/jquery.uploadify.js"></script>    <link href="uploadify/uploadify.css" rel="stylesheet" /></head><body>    <div id="box"></div></body></html><script type="text/javascript">    $("#box").uploadify({        swf: "../uploadify/uploadify.swf",        uploader: "../Handler1.ashx",        buttonText: "浏览",        fileSizeLimit: 800,        fileTypeExts: "*.doc; *.pdf; *.rar",        preventCaching: true,        progressData: "speed",        removeCompleted: true,        checkExisting: true,        onUploadStart: function (file) {                        alert("准备上传的时候触发")                  },        onSelectError: function (file, errorCode, errorMsg) {            if (file.fileSizeLimit > 800);            {                alert("文件超过了规定的大小");                return;            }        }    });</script>
一般处理程序(服务端)Handler1.ashx
using System;using System.Collections.Generic;using System.Linq;using System.Web;namespace easy_ui{    /// <summary>    /// Handler1 的摘要说明    /// </summary>    public class Handler1 : IHttpHandler    {        public void ProcessRequest(HttpContext context)        {            context.Response.ContentType = "text/html";            HttpPostedFile fileData = context.Request.Files[0];            string result = uploadify(fileData);            if (result == "")            {                context.Response.Write("请选择要上传的文件");            }            if(result=="上传文件类型错误")            {                context.Response.Write("请选择.doc,.pdf, .rar格式的文件");            }            context.Response.Write("上传成功");        }        public string uploadify(HttpPostedFile fileData)        {            if (fileData == null || string.IsNullOrWhiteSpace(fileData.FileName) || fileData.ContentLength <= 0)            {                return "";            }            else            {                string fileName = System.IO.Path.GetFileName(fileData.FileName);//获取上传的文件名                //获取文件扩展名(带个点)|| ext != ".pdf" || ext != ".rar"                string ext = System.IO.Path.GetExtension(fileData.FileName);                if (ext != ".doc")                {                    return "上传文件类型错误";                }                // 指定文件稍后要保存的地址                string filePath = HttpContext.Current.Server.MapPath(string.Format("~/File/{0}", fileName));                //保存上传文件的内容。                fileData.SaveAs(filePath);                return fileName;            }        }        public bool IsReusable        {            get            {                return false;            }        }    }}





0 0