• asp.net mvc 上传下载文件的几种方式


    view:

    <!DOCTYPE html>
    
    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title></title>
        <script src="~/Scripts/jquery-1.10.2.min.js"></script>
        <script src="~/Scripts/jquery.form.js"></script>
    </head>
    <body>
        <div>
            页面上传需要注意以下几点:<br />
            1、同一个页面可以有不止一个form但是不能嵌套<br />
            2、form:method="post" enctype="multipart/form-data"<br />
            3、input:type="file" name="XX" 必须要有name值<br />
        </div>
    
        <div style="margin-top:20px;">
            submit直接提交:提交后刷新页面,直接使用ajax不能把file传到后台处理<br />
            <form method="post" action="UpLoadPic" enctype="multipart/form-data">
                <input type="file" name="filename" id="filename" accept="image/*" />
                <input type="submit" value="提交" />
            </form>
        </div>
    
        
        <script>
            $(function () {
                var options = {
                    success: function (data) {
                        alert("成功");
                    }
                };
    
                //$("#myform1").ajaxForm(options);
    
                $("#myform1").submit(function () {
                    $(this).ajaxSubmit(options);
                    return false;
                });
            });
        </script>
        <div style="margin-top:20px;">
            jQuery.Form.js参照:http://www.cnblogs.com/heyuquan/p/form-plug-async-submit.html <br />
            http://www.vaikan.com/docs/jquery.form.plugin/jquery.form.plugin.html <br />
            http://www.cnblogs.com/xiaofeixiang/p/3676597.html <br />
            每次还会刷新页面
            <form id="myform1" method="post" action="UpLoadPic1" enctype="multipart/form-data">
                <input type="file" name="filename1" id="filename1" accept="image/*" />
                <input id="tijiao1" type="submit" value="提交" />
            </form>
    
            <div id="outputdiv"></div>
        </div>
    
        <script src="~/Scripts/ajaxfileupload.js"></script>
        <div style="margin-top:20px;">
            ajaxfileupload.js参照:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html <br />
            <form method="post" action="GetPic" enctype="multipart/form-data">
                <input type="file" name="filename2" id="filename2" accept="image/*" />
                <input type="button" value="提交" onclick="f2submit();" />
            </form>
            <script>
                function f2submit() {
                    //文件上传
                    $.ajaxFileUpload({
                        url: 'UpLoadPic2',
                        secureuri: false,
                        fileElementId: 'filename2',
                        success: function () {
                            alert("成功");
                        },
                        error: function () {
                            alert("失败");
                        },
                    });
                    return false;
                }
            </script>
        </div>
    
        <script src="~/Scripts/uploadify/jquery.uploadify.min.js"></script>
        <div style="margin-top:20px;">
            jquery.uploadify.js参照:http://blog.sina.com.cn/s/blog_5079086b0101fkmh.html <br />
            局部刷新
            <form method="post" enctype="multipart/form-data">
                <input type="text" id="FilePathName" readonly="readonly" style=" 300px;" />
                <input type="file" name="filename3" id="filename3" accept="image/*" />
                <input type="button" value="提交" onclick="f3submit()" />
            </form>
            <script>
                $(function () {
                    $('#filename3').uploadify({
                        //'multi': false,
                        //'uploadLimit': 100,
                        auto: false, // 是否直接上传
                        // 64,
                        //height: 28,
                        buttonText: "浏览",
                        'fileSizeLimit': '20MB',
                        'fileTypeExts': '*.doc;*.docx;*.xlsx;*.pdf;*.ppt;*.pptx;*.xls;*.jpg;*.png;',
                        swf: '/Scripts/uploadify/uploadify.swf',
                        //uploader: '/Scripts/uploadify/UploadFile.ashx',
                        uploader: '/Home/UpLoadPic3',
                        onSelect: function (file) {
                            $("#FilePathName").val(file.name);
                        },
                        'onSelectError': function (file, errorCode, errorMsg) {
                            if (errorCode == -110) {
                                errorMsg = "文件大小不能超过20MB!";
                            }
                            else if (errorCode == -100) {
                                errorMsg = "已经有文件在队列中,请先取消之前的文件!";
                            }
                            else if (errorCode == -130) {
                                errorMsg = "文件格式错误,请选择正确格式的文件!";
                            }
                            else {
                                errorMsg = "未知错误!";
                            }
                            alert(errorMsg);
    
                            return false;
                        },
                        onUploadSuccess: function (file) {
                            alert("成功");
                        }
                    });
                });
                function f3submit() {
                    $('#filename3').uploadify('upload');
                }
    
            </script>
        </div>
    
        <div style="margin-top:20px;">
            FormData提交参照:http://www.cnblogs.com/hutuzhu/p/4409292.html <br />
            FormData为HTML5对象,只支持新浏览器<br />
            <form id="myform4" name="myform4">
                <input type="file" name="filename4" id="filename4" accept="image/*" />
                <input type="button" value="提交" onclick="f4submit()" />
            </form>
            <script type="text/javascript">
                function f4submit() {
                    var form = document.getElementById("myform4");
                    var formData = new FormData(form);
                    var oReq = new XMLHttpRequest();
                    oReq.onreadystatechange = function () {
                        if (oReq.readyState == 4) {
                            if (oReq.status == 200) {
                                alert(xhr.responseText);
                            }
                            else {
                                alert("失败");
                            }
                        }
                    }
                    oReq.open("POST", "UpLoadPic4");
                    oReq.send(formData);
                    return false;
                }
            </script>
        </div>
    
        <hr />
        <a href="/Home/GetFileByContent">根据文件内容下载二进制方式上传的文件</a>
        <br />
        <a href="/Home/GetFileByPath">根据文件保存路径下载上传的文件</a>
    </body>
    </html>
    View Code

    controller:

            public static string FilePath = string.Empty;
            public static byte[] FileContent;
    
            /// <summary>
            /// 视图
            /// </summary>
            /// <returns></returns>
            public ActionResult UpFile()
            {
                return View();
            }
    
            /// <summary>
            /// submit
            /// </summary>
            [HttpPost]
            public void UpLoadPic()
            {
                SaveFileDirect();
                //SaveFileStream();
                Response.Redirect("Upfile");
            }
    
            /// <summary>
            /// ajaxSubmit
            /// </summary>
            [HttpPost]
            public void UpLoadPic1()
            {
                SaveFileDirect();
                //SaveFileStream();
                Response.Redirect("Upfile");
            }
    
            /// <summary>
            /// ajaxfileupload.js
            /// </summary>
            [HttpPost]
            public void UpLoadPic2()
            {
                //SaveFileDirect();
                SaveFileStream();
            }
    
            /// <summary>
            /// jquery.uploadify.js
            /// </summary>
            public void UpLoadPic3()
            {
                //SaveFileDirect();
                SaveFileStream();
            }
    
            /// <summary>
            /// FormData
            /// </summary>
            public void UpLoadPic4()
            {
                //SaveFileDirect();
                SaveFileStream();
            }
    
            /// <summary>
            /// 直接保存上传文件到指定目录
            /// </summary>
            public void SaveFileDirect()
            {
                // 获取文件
                var upfile = Request.Files[0];
                // 拼接保存路径
                string uppath = Server.MapPath("~/UpFile/") + Path.GetFileName(upfile.FileName);
                // 存入指定目录
                if (upfile.ContentLength > 0)
                {
                    upfile.SaveAs(uppath);
                }
    
                FilePath = uppath;
                FileContent = null;
            }
    
            /// <summary>
            /// 通过二进制流保存文件,可以存入数据库
            /// </summary>
            public void SaveFileStream()
            {
                // 获取文件
                var upfile = Request.Files[0];
                // 拼接保存路径
                string uppath = Server.MapPath("~/UpFile/") + Path.GetFileName(upfile.FileName);
                // 读入文件流
                byte[] temp = new byte[upfile.InputStream.Length];
                upfile.InputStream.Read(temp, 0, (int)upfile.InputStream.Length);
                // 写到指定目录
                using (FileStream fs = new FileStream(uppath, FileMode.OpenOrCreate, FileAccess.ReadWrite, FileShare.ReadWrite))
                {
                    fs.Write(temp, 0, temp.Length);
                }
                FilePath = uppath;
                FileContent = temp;
            }
    
            /// <summary>
            /// FileContentResult方式下载
            /// </summary>
            /// <returns></returns>
            public FileResult GetFileByContent()
            {
                List<string> typeList = new List<string>() { ".png", ".jpg", ".jpeg" };
                string FileName = Path.GetFileName(FilePath);
    
                if (FileContent != null && FileContent.Length > 0)
                {
                    if (typeList.Contains(Path.GetExtension(FileName)))
                    {
                        return File(FileContent, "image/jpg");
                    }
                    // 存在fileDownLoad属性的FileResult以附件形式下载,默认会以内联方式打开
                    return File(FileContent, "application/octet-stream", FileName);
                }
                return null;
            }
    
            /// <summary>
            /// FilePathResult方式下载
            /// </summary>
            /// <returns></returns>
            public FileResult GetFileByPath()
            {
                List<string> typeList = new List<string>() { ".png", ".jpg", ".jpeg" };
                string FileName = Path.GetFileName(FilePath);
    
                if (FileName != null)
                {
                    if (typeList.Contains(Path.GetExtension(FileName)))
                    {
                        return File(FilePath, "image/jpg");
                    }
                    // 存在fileDownLoad属性的FileResult以附件形式下载,默认会以内联方式打开
                    return File(FilePath, "application/octet-stream", FileName);
                }
                return null;
            }
    View Code
  • 相关阅读:
    nodejs pm2使用
    react生命周期
    It's a start!
    关于react-native报错: Invariant Violation: WebView has been removed from React Native. It can ....
    react-native 页面使用WebView布满整个页面,导航栏不显示问题
    两个函数执行顺序,异步问题处理(已解决)
    react-native webView乱码问题
    react-native 多页面之间传值
    时间戳转换为时间日期格式
    React Native返回刷新页面(this.props.navigation.goBack())
  • 原文地址:https://www.cnblogs.com/ariter/p/6062289.html
Copyright © 2020-2023  润新知