使用带有c#后端的HTML5.0将图像上传到服务器

时间:2014-02-07 21:25:00

标签: c# asp.net-mvc html5 asp.net-mvc-4 image-uploading

我正在尝试构建一个图像应用程序,用户可以在服务器上上传图像。

我使用HTML 5.0作为我的前端,c#作为我的后端遵循MVC 4架构。我将在下面附上我的代码。

    <div id="imageup">
    <form method="post" action="UploadImage" enctype="multipart/form-data">
    <label for="file">Filename:</label>
    Image: <input type="file" name="file" id="file"/>
    NAME: <input type="text" name ="testname" id="nametestid" runat="server"/>
    <input type="submit" value="image" />


    </form>

    </div>

以下是我在http://www.hanselman.com/blog/ABackToBasicsCaseStudyImplementingHTTPFileUploadWithASPNETMVCIncludingTestsAndMocks.aspx

上找到的后端代码

这是后端代码:

 [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult UploadImage(String testname)
    {
        Console.Out.WriteLine("HERE");
       // name.Length
       if(testname.Length==0){
          System.Console.WriteLine("Hello");
           //return Json("All files have been successfully stored.");
       }

       foreach (string file in Request.Files)
       {
           HttpPostedFileBase hpf = Request.Files[file] as HttpPostedFileBase;
           if (hpf.ContentLength == 0)
               continue;
           string savedFileName = Path.Combine(
              AppDomain.CurrentDomain.BaseDirectory,
              Path.GetFileName(hpf.FileName));
           hpf.SaveAs(savedFileName);
       }
       /* foreach (HttpPostedFile file in files)
        {
            string filePath = Path.Combine(TempPath, file.FileName);
            System.IO.File.WriteAllBytes(filePath, ReadData(file.InputStream));
        }

        //*/
        return RedirectToAction("Create");

    }

代码的问题是当我通过浏览器传递文件时,在断点中我得到image的值为null,但是我得到的文本与数据的形式相同。

1 个答案:

答案 0 :(得分:1)

终于明白了,

关键是要告诉控制器我将图像作为表格的一部分传递。

只需添加:

@using (Html.BeginForm("UploadImage", "Image", FormMethod.Post,
                        new { enctype = "multipart/form-data" }))

感谢Mike&amp;托米