在 Razor 中使用站点根目录相对链接

Posted 2023-04-01

【中文标题】在 Razor 中使用站点根目录相对链接

【英文标题】：Using site root relative links in Razor

【发布时间】：2012-01-24 08:16:57

【问题描述】：

我有一个网站在使用 Razor (C#) 时运行良好，当我使用本地测试 (WebMatrix IIS) 时，所有编码都正常运行。

当我把它“在线”放在我的服务器上时，网站并不是它自己的网站根目录

例如：

http://intranet.mycompany.com/inform

这基本上是我的文件夹结构的“根”，所以我所有的文件夹都从那里开始（css 文件 default.cshtml...等等）

当我从链接http://intranet.mycompany.com/inform 访问我的网站时，我的“_PageStart.cshtml”正确地看到了它，它为我提供了我在 _PageStart.cshtml 中配置的布局（它确实显示了布局 + 呈现的 default.cshtml）

但没有其他方法可以找到正确的路径，例如：

<img src="~/images/logos/hdr.png" />

img 持有人在那里，我可以看到它，但显示链接已损坏...当我右键单击 img 持有人并执行属性以查看文件应该在哪里时，它会告诉我：

http://intranet.mycompany.com/images/logos/hdr.png

所以它会转到“完整”根而不是相对根...

我该如何解决？

【问题讨论】：

顺便说一句，一开始我是用“/img/logos/hdr.png”做的，结果是一样的

好吧，我正在做更多的测试......我意识到（如果我错了，请纠正我）......“HTML”标签（即使它在 CSHTML 页面内）仍然存在像没有大脑的普通“html”一样工作......你必须告诉他们一切......所以我网页中的链接需要有 /inform 才能正常工作？有没有办法让它变得相对？

是的，您视图中的纯 html 会“按原样”呈现。只是 C#/VB 代码呈现动态内容。

【参考方案1】：

您必须在整个应用程序中使用相对路径：

~ 在静态 html 代码中不起作用。

你可以写

<img src="@Url.Content("~/images/logos/hdr.png")" />

或

<img src="../images/logos/hdr.png" />

第一种方法适用于布局文件，当您有不同长度的路由 url 时，您的相对路径可能会发生变化。

编辑

关于正常链接的问题：

链接到应用程序中的另一个页面时，您没有将视图文件指定为目标，而是将呈现视图的操作指定为结果。为此，您使用 HtmlHelper ActionLink:

@Html.ActionLink("Linktext", "YourController", "YourAction")

它会自动为您生成正确的网址：

<a href="YourController/YourAction">Linktext</a>

编辑 2

好的，没有 MVC - 所以你必须自己生成链接。

您也必须使用相对路径。不要以/ 字符开始任何链接！

<a href="linkOnSameLevel.cshtml">Link</a>
<a href="../linkOnParentLevel.cshtml">Link</a>
<a href="subFolder/linkOnOneLevelDown.cshtml">Link</a>

编辑 3

使用布局页面时可以使用Hrefextension 方法生成相对url：

<link href="@Href("~/style.css")" ...

【讨论】：

好的，可以用图像修复它，但是链接呢？

您没有链接到 mvc 中的视图文件。您链接到操作。这通常是通过 @Html.ActionLink() 助手完成的。

嗨 Jan...这只是一个网站而不是应用程序...除非我没有正确地做某事...当我使用时： 它给了我：CS0103：名称 'Url' 在当前上下文中不存在...甚至 Visual Web Developer Express 也给我同样的错误...跨度>

啊，好吧，你不使用 MVC，对吧？好的，那么您没有可用的 html 帮助程序，您必须使用相对路径自己编写链接。我已经更新了我的答案。

非常感谢您的帮助 Jan...基本上可以作为一个不复杂的普通网页工作...现在我的问题是页面被渲染了，因为我有点使用一半 MVC-一半不.. . （这是新的 CSHTML 网页）样式表不会移动，所以 从根目录开始工作......但是一旦我渲染了它位于文件夹中... CSS 样式未正确加载... 我应该在每个文件夹中复制该 CSS 样式表还是您会看到其他解决方案？

【参考方案2】：

如下图使用Url.Content：

<img src="@Url.Content("~/images/logos/hdr.png")" />

【参考方案3】：

我知道默认情况下会添加“~”，但我倾向于更改它，以便所有路径都相对于我的代码文件而不是应用程序根目录，例如使用“..”。 "../images/logos"等

【讨论】：

您的代码文件 /Things/Index.cshtml 可以用作 /app/Things 或 /app/Things/（带有斜杠）。加上其他两种方式，如果您在某些服务器上部署到 root，则没有前导 /app/。在可选的尾部斜杠的情况下 .. 链接将被破坏。最好在服务器端执行 ~ (@Url.Content("~/....") 或 @Href("~/....")