首页 > 代码库 > Asp.Net上传大文件带进度条swfupload

Asp.Net上传大文件带进度条swfupload

Asp.Net基于swfupload上传大文件带进度条百分比显示,漂亮大气上档次,大文件无压力,先看效果

一、上传效果图

1、上传前界面:图片不喜欢可以自己换

技术分享

2、上传中界面:百分比显示

 

技术分享

3、上传后返回文件地址,我测试呢所以乱写的

技术分享

二、核心代码

upload.htm代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title>博客园:webapi</title>    <link href="css.css" rel="stylesheet" type="text/css" />    <script type="text/javascript" src="swfupload/swfupload.js"></script>    <script type="text/javascript" src="js/swfupload.queue.js"></script>    <script type="text/javascript" src="js/fileprogress.js"></script>    <script type="text/javascript" src="js/filegroupprogress.js"></script>    <script type="text/javascript" src="js/handlers.js"></script>    <script type="text/javascript">        var swfu;        window.onload = function () {            var settings = {                flash_url: "swfupload/swfupload.swf",                upload_url: "uploadFile.ashx",                file_size_limit: "409600",                file_types: "*.apk;*.ipa",                file_types_description: "Web Image Files",                file_size_limit: "307200",                file_upload_limit: 1,                file_queue_limit: 1,                custom_settings: {                    progressTarget: "divprogresscontainer",                    progressGroupTarget: "divprogressGroup",                    //progress object                    container_css: "progressobj",                    icoNormal_css: "IcoNormal",                    icoWaiting_css: "IcoWaiting",                    icoUpload_css: "IcoUpload",                    fname_css: "fle ftt",                    state_div_css: "statebarSmallDiv",                    state_bar_css: "statebar",                    percent_css: "ftt",                    href_delete_css: "ftt",                    //sum object                    /*                    页面中不应出现以"cnt_"开头声明的元素                    */                    s_cnt_progress: "cnt_progress",                    s_cnt_span_text: "fle",                    s_cnt_progress_statebar: "cnt_progress_statebar",                    s_cnt_progress_percent: "cnt_progress_percent",                    s_cnt_progress_uploaded: "cnt_progress_uploaded",                    s_cnt_progress_size: "cnt_progress_size"                },                debug: false,                // Button settings                button_image_url: "images/btnupload.png",                button_width: "301",                button_height: "171",                button_placeholder_id: "spanButtonPlaceHolder",                //button_text: ‘<span class="theFont">上传文件</span>‘,                //button_text_style: ".theFont {background-image: url(‘images/btnupload.png‘);width:301px;height:171px}",                //button_text_left_padding: 12,                //button_text_top_padding: 3,                // The event handler functions are defined in handlers.js                file_queued_handler: fileQueued,                file_queue_error_handler: fileQueueError,                upload_start_handler: uploadStart,                upload_progress_handler: uploadProgress,                upload_error_handler: uploadError, //uploadError                upload_success_handler: uploadOk, //uploadSuccess                //upload_complete_handler: uploadComplete, //uploadComplete                file_dialog_complete_handler: fileDialogComplete            };            swfu = new SWFUpload(settings);        };        function uploadOk(file, serverData) {            if (serverData != "0") {                alert("上传完成!" + serverData);            } else {                alert("上传失败!");                swfu.setButtonDisabled(false); //启用上传按钮            }        }    </script>         </head><body>    <div id="main_upload">        <form id="frmMain" action="upload.ashx" runat="server" enctype="multipart/form-data">        <span id="spanButtonPlaceHolder"></span>        <div id="divprogresscontainer"></div>        <div id="divprogressGroup"></div> 
http://www.cnblogs.com/webapi/p/5811304.html </form> </div></body></html>

uploadFile.ashx代码

<%@ WebHandler Language="C#" Class="uploadFile" %>using System;using System.Web;using System.IO;public class uploadFile : IHttpHandler{    public void ProcessRequest(HttpContext context)    {        context.Response.ContentType = "text/plain";        string PathName = HttpContext.Current.Server.MapPath("file/");        string NewsName = DateTime.Now.ToString("yyyyMMddHHmmssfff");        string NewsPathName = Path.Combine(PathName, NewsName);        DateTime Dtime = System.DateTime.Now;        HttpPostedFile file = HttpContext.Current.Request.Files["Filedata"];        if (file != null && file.ContentLength > 0 && !string.IsNullOrEmpty(file.FileName))        {            file.SaveAs(NewsPathName + Path.GetFileName(file.FileName));        }        context.Response.Write("ok123");        context.Response.End();    }    public bool IsReusable    {        get        {            return false;        }    }}

 

源码打包下载地址:http://download.csdn.net/detail/pan524365501/9614045

本文地址:http://www.cnblogs.com/webapi/p/5811304.html

 

Asp.Net上传大文件带进度条swfupload