Question

在数据库中存储时，我得到红色x标记而不是图片。我相信我在Views文件中遇到了问题。请有人看看这个并告诉我如何纠正它。如果我有错误的URL操作，请告诉我应该使用哪些。提前致谢。

SubCategory2表包含以下列...

列字段＆gt;图1：数据类型＆gt; VARBINARY（MAX）

列字段＆gt; ImageMimeType：数据类型＆gt; VARCHAR（50）

Index.cshtml文件

 @foreach (var item in Model) {
    <td>
                <img src="@Url.Action("GetImage", "SubProductCategory2", 
  new { id = item.SubProductCategoryID})" alt="" height="100" width="100" /> 
           </td>

Edit.cshtml文件 “编辑”是控制器中的方法。 “ProductCategoryL2”是控制器中的方法。 “GetImage”是控制器中的方法。所有这些方法都在名为ProductCategoryControllerL2

的同一控制器文件中

@using (Html.BeginForm("Edit", "ProductCategoryL2", "GetImage", 
FormMethod.Post, new { @encType = "multipart/form-data" }))
 {
  <div class="editor-field">
    <img src="@Url.Action("GetImage", "SubProductCategory2", new {    
    Model.SubProductCategoryID })" alt="" /> 
    @Html.ValidationMessage("Picture1", "*")
    <input type="file" id="fileUpload" name="Create" size="23"/>
  </div>
}

ProductCategoryL2Controller.cs文件

    [HttpPost]
    public ActionResult Edit(int id, FormCollection collection, 
    SubProductCategory2 editSubProdCat, HttpPostedFileBase image)
    {
        var r = db.SubProductCategory2.First(x => x.SubProductCategoryID 
        == id);

        if (TryUpdateModel(r))
        {
            if (image != null)
            {
              editSubProdCat.ImageMimeType = image.ContentType;
              editSubProdCat.Picture1 = new byte[image.ContentLength];
              image.InputStream.Read(editSubProdCat.Picture1, 0, 
              image.ContentLength);
            }
            db.SaveChanges();
            return RedirectToAction("/");
        }
        return View(r);

   }

  public FileContentResult GetImage(int productId)
  {
      var product = db.SubProductCategory2.First(x => 
      x.SubProductCategoryID == productId);
      return File(product.Picture1, product.ImageMimeType);
  }

添加注释
我正在使用MVC 3框架。 GetImage方法已经从Steven Sanderson的书籍Pro ASP.NET MVC 2 Framework中得到了提及。所以我不确定这是不是一个问题？

Answer 1

我要调试的第一步是直接在浏览器中尝试图像的URL。右键单击红色X，复制URL并将其粘贴到地址栏中。如果网址看起来正确，那么你应该是一个更好的错误，告诉你问题是什么。如果失败，请在GetImage例程中放置一个断点，以确保路由正确并且您的方法被调用。尝试Fiddler查看正在发出的请求以及您的Web服务器正在说什么。

我的猜测是你的行动有误。当方法在您的ProductCategoryL2控制器上时，看起来您正在链接到SubProductCategory2控制器上的GetImage操作。

另外，我不明白你的Model.SubProductCategoryID值应该如何映射到你的productId参数。尝试更改这些电话：

Url.Action("GetImage", "SubProductCategory2", 
    new { id = item.ProductCategoryID})
Url.Action("GetImage", "SubProductCategory2", new {    
    Model.SubProductCategoryID })

到这些：

Url.Action("GetImage", "ProductCategoryL2", 
    new { productId = item.ProductCategoryID})
Url.Action("GetImage", "ProductCategoryL2", new {    
    productId = Model.SubProductCategoryID })

Answer 2

您的输入文件字段名为Create：

<input type="file" id="fileUpload" name="Create" size="23"/>

而处理表单提交的控制器操作参数称为image（具有HttpPostedFileBase类型的那个）=＆gt;您的null控制器操作中此参数始终为Edit，并且不会将任何内容保存在数据库中。

此属性在enctype帮助程序中称为encType而不是Html.BeginForm。同样在GetImage操作中，确保product.Picture1表示正确的图像字节数组，并且其内容类型与product.ImageMimeType匹配。

因此，例如，为了进一步调试此问题，您可以尝试将其保存到某个临时文件，以便在返回之前查看它是否是有效图像。还要确保从数据库中提取的product实例不为null：

 // if the content type is image/png:    
File.WriteAllBytes(@"c:\foo.png", product.Picture1);

然后确保使用图像查看器成功打开foo.png。

Answer 3

您正在尝试将文件内容作为值返回到img的src属性。您的浏览器需要为图像发出单独的请求。

将您的观点更改为：

<img src="GetImage/@(Model.SubProductCategoryID)" />

MVC3 - 从db获取红色x而不是图片

3 个答案: