【问题标题】:Route images in View folder in Asp.Net MVC 3在 Asp.Net MVC 3 的 View 文件夹中路由图像
【发布时间】:2012-05-14 02:53:59
【问题描述】:

我之前尝试过问这个问题有点不同,但没有被理解,所以我会尝试另一种方式:

我有一个 MVC 3 应用程序,我像往常一样在 Views 目录中有视图。但是,由于各种原因,我需要每个视图的图像与视图本身位于同一文件夹中,即在我的情况下,例如视图/手册/en-US/名称

这是我使用的路线:

routes.MapRoute(
                "Parameter",
                "{controller}/{action}/{lang}/{prod}",
                new { controller = "Manuals", action = "Product", lang = "en-US", prod = "name" }
        );

现在,如前所述,我需要此视图的图像位于同一文件夹中,以便图像路径可以简单地为“ATEXSymbol.svg”。

当我只有这条路线,并为图像使用这样的简单相对路径时,我得到的是这样的错误:

未找到视图“da-DK/ATEXSymbol.svg”或其主视图或 没有视图引擎支持搜索的位置。下列 搜索位置:~/Views/Manuals/da-DK/ATEXSymbol.svg.aspx ~/Views/Manuals/da-DK/ATEXSymbol.svg.ascx ~/Views/Shared/da-DK/ATEXSymbol.svg.aspx ~/Views/Shared/da-DK/ATEXSymbol.svg.ascx ~/Views/Manuals/da-DK/ATEXSymbol.svg.cshtml ~/Views/Manuals/da-DK/ATEXSymbol.svg.vbhtml ~/Views/Shared/da-DK/ATEXSymbol.svg.cshtml ~/Views/Shared/da-DK/ATEXSymbol.svg.vbhtml

所以基本上,它在正确的语言文件夹中寻找图像,但没有产品名称文件夹部分,并且附加了许多视图扩展名之一。我知道 MVC 并不真的希望在同一个文件夹中使用这个相对路径,但我几乎别无选择。我需要将图像放在同一个文件夹中,以防我无法控制。

那么我该如何实现呢?

编辑:

其实上面我有点误会了,说路径的产品名称部分丢失了,当然不是。路径的那部分是视图本身的名称。所以基本上我通过 src 属性中的简单相对路径(只是图像文件的名称)获得的路径为图像创建了正确的路径。唯一的问题是添加了视图文件扩展名...

有人知道怎么解决吗?

编辑 2:

顺便说一句,我本可以使用 Url.Content,但由于某种原因,它也不起作用。如果我使用这个:

<embed  type="image/svg+xml" src="@Url.Content("~/Content/images/da-DK/3153/CheckRotation.svg")"></embed>

...它可以工作...但是如果我使用它(同样的东西,但图像在 Views 文件夹中)...

<embed  type="image/svg+xml" src="@Url.Content("~/Views/Manuals/da-DK/CheckRotation.svg")"></embed>

...它不起作用。如果我在 web 检查器中检查后一个示例中的路径,它看起来像正确的路径 (localhost:49864/Views/Manuals/da-DK/CheckRotation.svg),但显示找不到它的消息。

编辑 3:

Thinking Sites 的回答给了我一个解决方案,我只需要稍微修改一下,因为我需要为视图本身建议的路线。所以我添加了这条路线:

routes.MapRoute(
                "Image",
                "{controller}/{action}/{lang}/{prod}",
                new { controller = "Manuals", action = "Image", lang = "en-US", prod = "name" }
        );

我对路径做了一些调整(如建议的那样),因为 prod 现在实际上带有整个文件名,包括扩展名:

public ActionResult Image(string lang, string prod)
        {
            var root = Server.MapPath("~/Views/Manuals/");
            var filepath = Path.Combine(root, lang, prod); // whatever creates your path here.
            return File(filepath, "image/svg+xml");
        }

然后在视图中我可以有这样的路径:

<embed  type="image/svg+xml" src="@Url.Content("/Manuals/Image/da-DK/CheckRotation.svg")"></embed>

【问题讨论】:

  • 这条路线对我来说很好。我认为问题出在你的行动上。您返回的是 FileResult 而不是 ViewResult?
  • 不,实际上这只是视图的路径,我正在返回一个 ActionResult。我实际上不知道如何处理 SVG 图像的路线或动作。路由也尝试将此控制器用于 SVG 图像,但如上所述,它不起作用。
  • 路线看起来不错。 ActionResult 是 FileResult 和 ViewResult 的基类。你得到的错误是因为你在你的方法中寻找一个视图,而不是一个文件。您是否需要动态加载 SVG 文件?无论如何,它们不应该在视图文件夹中。如果您将它们放在内容文件夹中,则可以直接向它们添加一个 url,而无需路由。如果它们是动态的,那么您正在寻找 FileResult 来加载 SVG 并发送字节。 SVG 文件本身有什么动态的吗?
  • 对,不,SVG 文件基本上只是用于视图的图像,所以它们应该只是显示。如果我将它放在 Content 文件夹中,我实际上知道该怎么做。但是,客户要求(无论是否正确)它应该位于 Views 文件夹中。这是因为内容将被大量倾倒,他们不想像那样分开东西。这是一个不寻常的背景,我知道,但情况就是这样。所以我需要让图片链接在同一个 View 文件夹中作为相对链接工作......
  • 你有一个加载它们的动作,是吗?

标签: asp.net asp.net-mvc-3 asp.net-mvc-routing viewengine


【解决方案1】:

使用这条路线:

routes.MapRoute(
                "Parameter",
                "{controller}/{action}/{lang}/{prod}",
                new { controller = "Manuals", action = "Product", lang = "en-US", prod = "name" }
        );

在您的控制器 ManualsController 中创建此操作

public ActionResult Product(string lang,string prod){
   var root = Server.MapPath("~/views/manuals/");
   var filepath = Path.Combine(root,lang,prod,".svg"); // whatever creates your path here.
   return File(filepath ,"your mime type");
}

不需要自定义视图引擎。 FileResult 就是为这种场合而设计的。

【讨论】:

  • 但是我做不到,那么就没有提供视图本身的操作方法......
  • 实际上,我得到了它的工作,我只需要进行一些调整,看看我的编辑。谢谢!
【解决方案2】:

也许你的问题的答案就在你的错误中:

未找到视图“da-DK/ATEXSymbol.svg”或其主视图或没有视图引擎支持搜索到的位置

您是否考虑过插入custom view engine

我自己从未创建过并且无法提供指导,因此这是一个不完整的答案(我可以稍后根据 cmets 删除)。不过,这是一个有趣的问题,据我所知,这是一个独特的问题。我想知道谁会规定将项目“大量倾倒”以用于一个按惯例不按这种方式工作的框架。不过,如果您使用的是 Web 表单,那将非常简单。

【讨论】:

  • 我知道,这是非常规的,但是由于不同原因的不同要求使它如此......我考虑过自定义视图引擎以及自定义路由处理程序,但不幸的是我无法得到到目前为止它也可以工作。
  • 我在我的问题中犯了一个小错误,现在编辑。这有帮助吗?
  • 视图文件扩展名必须来自视图引擎。我认为您将不得不走自定义视图引擎之路。
  • 没必要。您只需要文件路径并将它们传递给 FileResult。
猜你喜欢
  • 2014-10-05
  • 1970-01-01
  • 2017-02-28
  • 2011-08-11
  • 1970-01-01
  • 1970-01-01
  • 2010-10-19
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多