ASP.NET MVC 文件异步上传问题处理

最近在做一个网站,用asp.net MVC4.0来开发,今天遇到了个小问题,通过查找相关渠道解决了,在这里把这个问题写出来,问题非常简单,不喜勿喷,mark之希望可以给遇到相同问题的初学者一点帮助。
我要实现文件的异步上传,前端提交的文件后台老是获取不到。
我前端是这样写的:

@using (Ajax.BeginForm("UpdateNewInfo", "Home", new AjaxOptions() { HttpMethod = "post", OnSuccess = "afterAdd" }, new { id = "form1" }))
    {
        <table>
                <td>选择图片</td>
                <td>
                    <input type="file" id="uploadImg" name="fileUpImg" />
                    <input type="button" id="btnFileUp" value="上传图片"/>
                </td>
            </tr>
        </table>
    }

选择一张图片,点击上传图片按钮,图片就异步上传到服务器,提交的是一个Form表单,使用ajaxSubmit来异步上传文件。

后台获取文件信息

HttpPostedFileBase postFile = Request.Files["fileUpImg"];

但是postFile对象一直为空,查看Form表单,又显示有数据,那么问题出在哪里呢?

这个问题困扰了我一上午,然后再博问里提问,马上就有人指出了我的错误。

问题在这里

@using (Ajax.BeginForm("UpdateNewInfo", "Home", new AjaxOptions() { HttpMethod = "post", OnSuccess = "afterAdd" }, new { id = "form1", enctype = "multipart/form-data" }))

原来我们传文件的时候必须设置Form表单的enctype=”multipart/form-data”

表单中enctype=”multipart/form-data”的意思,是设置表单的MIME编码。默认情况,这个编码格式是application/x-www-form-urlencoded,不能用于文件上传;只有使用了multipart/form-data,才能完整的传递文件数据,进行下面的操作.

时间: 2024-09-27 07:09:13

ASP.NET MVC 文件异步上传问题处理的相关文章

百度 flash html5自切换 多文件异步上传控件webuploader基本用法

双核浏览器下在chrome内核中使用uploadify总有302问题,也不知道如何修复,之所以喜欢360浏览器是因为帮客户控制渲染内核: 若页面需默认用极速核,增加标签:<meta name="renderer" content="webkit"> 若页面需默认用ie兼容内核,增加标签:<meta name="renderer" content="ie-comp"> 若页面需默认用ie标准内核,增加标签

使用AjaxFileUpload.js实现文件异步上传

ajax是无法提交文件的,所以在上传图片并预览的时候,我们经常使用Ifame的方法实现看似异步的效果.但是这样总不是很方便的,AjaxFilleUpload.js对上面的方法进行了一个包装,使得我们不用去管理Iframe的一系列操作,也不用影响我们的页面结构,实现异步的文件提交. html: <input type="file" name="upload" hidden="hidden" id="file_upload"

HTML5实现图片文件异步上传

利用HTML5的新特点做文件异步上传非常简单方便,本文主要展示JS部分,html结构.下面的代码并未使用第三发库,如果有参照,请注意一些未展现出来的代码片段.我这边的效果预览: 1.文件未选择 2.文件已选择 HTML代码部分: 思路:下面代码中我利用css的z-index属性将input="file"标签隐藏在了id=btnSelect元素下面,通过触发a标签的点击后,弹出文件选择框.下面的masklayer用于点击确认按钮后的弹出层,避免用户重复点击确认按钮. <div id

SpringMVC + AJAX 实现多文件异步上传

转自:https://www.jianshu.com/p/f3987f0f471f 今天,我就这个问题来写一篇如何用 SpringMVC + AJAX 实现的多文件异步上传功能.基本的代码还是沿用上篇文章中所用到的项目,需要的朋友可以点击前面的链接查看.在这里只贴出关键代码. 首先我们要准备一个 JS 文件,即:ajaxfileupload.js,它需要用到 jQuery,所以我们还需要准备 jQuery 的库,两个文件在文末尾都有链接提供下载. JSP 关键代码: <li> <div&

文件的上传(表单上传和ajax文件异步上传)

一.表单上传: html客户端部分: <form action="upload.ashx" method="post" enctype="multipart/form-data"> 选择文件:<input type="file" name="file1" /><br /> <input type="submit" value="上传&q

文件上传之——用SWF插件实现文件异步上传

之前提高过几篇文件上传,那些都不错.今天小编带领大家体会一种新的上传方法,及使用Flash插件实现文件上传. 使用Flash的好处就是可以解决浏览器兼容性问题.之前我写的一个快捷复制功能也是利用的Flash. 最近一直在用MVC,所以还是以MVC举例:先来张效果图: UploadIndex2.cshtml代码: @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&q

Html5+asp.net mvc 图片压缩上传

在做图片上传时,大图片如果没有压缩直接上传时间会非常长,因为有的图片太大,传到服务器上再压缩太慢了,而且损耗流量. 思路是将图片抽样显示在canvas上,然后用通过canvas.toDataURL方法得到base64字符串来实现压缩. 废话不多少不多说直接看代码: 本次测试使用了 zepto.min.js 插件,更新版本的下载请点击这里 主要js代码: //图片压缩处理 ; (function () { /** * 加载的时候进行抽样检测 * 在iOS中,大于2M的图片会抽样渲染 */ func

关于文件异步上传

今天要做一个图片异步上传的功能,需求是这样的 在官网让玩家提出问题反馈,只是再发聩是需要玩家上传图片作为客服审核的证据.为了保证官网的安全性,于是准备了一台图片服务器,专门存储图片. 我的思路是在页面上传文件到图片服务器,并返回图片的地址.然后再提交表单时,将图片url,保存入数据库. 1.  利用 ajaxfileupload进行上传时,是不能进行跨域操作的. 2.  所以更换为jquery.fileupload进行跨域操作,不过没有中文文档,使用时很是费劲.因为第一次上传没有反应,只有第二次

HTML5 文件异步上传 — h5uploader.js

原文地址:http://imziv.com/blog/article/read.htm?id=62 之前写过一篇H5异步文件上传的文章, 但是很多朋友看着我的这个教程还是出现很多问题,文章写的不是很好,比较早了.其实通过H5做异步上传已经非常简单了,通过查看文档,便可以很轻松的完成这个功能,当然,如果你不愿意查看文档自己动手的话,那么就用插件咯.h5uploader是我最近封装的HTML5上传插件,代码才白来行,使用的话也比较简单,支持文件大小,类型,progress等等功能.本篇教程,将向你展