我们刚刚将一个ASP MVC intranet 网站移动到本地服务器上,并且在一个页面上使用的图片遇到了一些奇怪的事情。出于某种原因,URL包含一个额外的子文件夹。这有点奇怪的是,这是一个在“主模板”页面中使用的URL,但没有其他页面显示这种奇怪之处。这是
论文是有问题的两张照片:
<img src="../../Content/images/Monet3.png" id="MonetSig" />
<img src="../../Content/images/TEST2body_top.png" id="topPic" alt="tag"/>
当我在Chrome中调出开发人员工具时,我会收到以下两个图片的错误消息:
GET http://insideapps.dev.company.com/Monet/Monet/Content/images/Monet3.png 404 (Not Found)
GET http://insideapps.dev.company.com/Monet/Monet/Content/images/TEST2body_top.png 404 (Not Found)
同样,没有其他页面显示此错误。
以下是该网站主要布局的副本:
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
<script language="javascript">
function DoFun() {
}
</script>
</head>
<body>
@using Monet.Common
<div class="page">
<header>
<div style="margin: 10px;" id="Logo">
<img src="../../Content/images/Monet3.png" id="MonetSig" />
</div>
@* </a>*@
@* <div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>*@
<nav>
<ul id="menu">
<li>@Html.MenuLink("Agents", "Index", "Agent")</li>
<li>@Html.MenuLink("Products", "Index", "Product")</li>
<li>@Html.MenuLink("Product Training", "Index", "Course")</li>
<li>@Html.MenuLink("Continuing Ed", "Index", "ContEdCourse")</li>
<li>@Html.MenuLink("Help", "About", "Home")</li>
</ul>
</nav>
</header>
<img src="../../Content/images/TEST2body_top.png" id="topPic" alt="tag"/>
<section id="main">
@RenderBody()
</section>
<footer>
</footer>
</div>
</body>
</html>
以防万一,这是相关页面的Index.cshtml
@model IEnumerable<Monet.Models.FollowUpItems>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script src="@Url.Content("~/Scripts/jquery.tablesorter.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#thetable").tablesorter();
}
);
function GetNotes(id) {
$('#' + id).dialog();
}
function GetMisc(id) {
var target = id + "Misc";
$('#' + target).dialog();
}
</script>
<h2>Follow Up Items</h2>
@using (Html.BeginForm())
{
<span id="searchBox" class="boxMe" >
<form method="post">
<select name="Table" title="Table" style="font-size:8pt;">
<option value="%">--Table Name--</option>
<option value="AgentContEd">CE</option>
<option value="AgentProductTraining">PT</option>
</select>
<select name="IssueType" style="font-size:8pt;">
<option value="%">--Issue Type--</option>
<option value="W">Warning</option>
<option value="E">Error</option>
</select>
<select name="Status" style="font-size:8pt;">
<option value="%">--Status Type--</option>
<option value="O">Open</option>
<option value="U">Under Review</option>
</select>
<input type="image" src="@Url.Content("~/Content/Images/Filter.bmp")" alt="Filter" style="padding-top: 0px;" />
<a href="#" style="padding-left: 30px;"></a>
</form>
</span>
<br />
<br />
<span id="programExplanation" style="width: 500px; float:left; padding: 5px; margin-left: 25px;"></span>
<span class="error" style="clear: both;">
@ViewBag.ErrorMessage
</span>
<span class="msg">
@ViewBag.Message
</span>
<br />
<br />
<br />
}
<table>
<tr>
<th>
Table
</th>
<th>
Issue
</th>
<th>
Status
</th>
<th>
Message
</th>
<th>
CreatedBy
</th>
<th>
CreatedOn
</th>
<th>
Key1
</th>
<th>
Key2
</th>
<th>
Notes
</th>
<th>
Misc.
</th>
<th></th>
</tr>
@foreach (var item in Model.Where(i => i.Status != "C" && i.IssueType != "S"))
{
var note = string.Empty;
if (!String.IsNullOrWhiteSpace(item.Notes))
{
note = item.Notes.ToString();
}
var id = item.Id;
var target = id + "Misc";
<tr>
<td>
@if (!String.IsNullOrWhiteSpace(item.TableName))
{
if (item.TableName.Equals("AgentContEd"))
{
@Html.Raw("CE");
}
else if (item.TableName.Equals("AgentProductTraining"))
{
@Html.Raw("PT");
}
else
{
@Html.DisplayFor(modelItem => item.TableName)
}
}
</td>
<td>
@Html.DisplayFor(modelItem => item.IssueType)
</td>
<td>
@Html.DisplayFor(modelItem => item.Status)
</td>
<td>
@Html.DisplayFor(modelItem => item.Message)
</td>
<td>
@Html.DisplayFor(modelItem => item.CreatedBy)
</td>
<td>
@Html.DisplayFor(modelItem => item.CreatedOn)
</td>
<td>
@Html.DisplayFor(modelItem => item.Key1)
</td>
<td>
@Html.DisplayFor(modelItem => item.Key2)
</td>
<td>
@if (!String.IsNullOrWhiteSpace(item.Notes))
{
<span id="notes" onclick='GetNotes(@id);'>
<img src="@Url.Content("~/Content/images/magnify.gif")" alt="Show Notes" />
</span>
}
<div id="@id" title="Notes" style="display:none;">
@Html.DisplayFor(modelItem => item.Notes)
</div>
</td>
<td>
@if (!String.IsNullOrWhiteSpace(item.LastUpdateBy) || !String.IsNullOrWhiteSpace(item.LastUpdateOn.ToString()))
{
<span id="misc" onclick='GetMisc(@id);'>
<img src="@Url.Content("~/Content/images/magnify.gif")" alt="Show Notes" />
</span>
}
<div id="@target" title="Misc" style="display:none;">
@Html.DisplayFor(modelItem => item.LastUpdateBy)
@Html.DisplayFor(modelItem => item.LastUpdateOn)
</div>
</td>
<td>
@Html.ActionLink("Edit", "Edit", new { id = item.Id })
</td>
</tr>
}
</table>
答案 0 :(得分:4)
在ASP.NET MVC应用程序中处理url时始终使用heleprs,并且不要像你那样对它们进行硬编码。
所以:
<img src="@Url.Content("~/Content/images/Monet3.png")" id="MonetSig" />
<img src="@Url.Content("~/Content/images/TEST2body_top.png")" id="topPic" alt="tag" />
如果您使用的是WebPages v2.0(这是ASP.NET MVC 4中的默认设置),您可以这样做:
<img src="~/Content/images/Monet3.png" id="MonetSig" />
<img src="~/Content/images/TEST2body_top.png" id="topPic" alt="tag" />
无论您的应用程序在何处以及如何托管,Url帮助程序都会负责为资源生成正确的URL。