我正在使用这里几个问题中推荐的 urlrewriter.net。 我在显示图像和样式表时遇到了困难。
我阅读了 ScottGu 的博客（再次按照此处的推荐），最后他确实提到了这个问题并声明使用 ~/ 来进行服务器控件等（文章末尾的“正确处理 CSS 和图像引用” )。
我尝试了他的解决方案，但它似乎不起作用。
似乎唯一对我有用的是编写完整路径。出于某种原因，在我看来，这不是正确的解决方案。这会给开发和调试带来严重的问题。
有谁知道问题的原因是什么？ 我需要在 web.config 文件中更改什么吗？
谢谢
【问题讨论】：
标签： asp.net friendly-url url-rewriting
根据我的经验基本标签所解决的问题远远多于它解决的问题
我强烈建议第一个选项，通过在操作前检查 .aspx 扩展名来限制允许 URLrewriter 影响的内容。
【讨论】：
您是否尝试过 Page.ResolveUrl？
<link href="<%=Page.ResolveUrl("~/mycss.css")%>" type="text/css" rel="stylesheet" />
【讨论】：
我认为您需要从重写引擎中排除样式表和图像目录。我不熟悉您使用的引擎，但如果您使用的重写规则基于非常广泛的规则进行重写，它将错误地指向您的样式表和图像，以及我相信的 javascript。
您也可以尝试使用基本标签。
<base href="http://www.w3schools.com/images/" />
尝试将其放在您的 <head> 中，指向您的图像文件夹。
【讨论】：
我第二次使用基本 href。尽管您确实必须对站点从域的根目录运行时的差异进行一些处理，即生产与 Visual Studio 服务器相比。
<base id="BasePath" runat="Server"/>
然后在master代码后面。
受保护的无效 SetBaseHref()
{
if (Request.RawUrl != Request.Url.PathAndQuery)
{
字符串 baseUrl = "";
if (Request.IsSecureConnection)
baseUrl += "https://";
else
baseUrl += "http://";
baseUrl += Request.Url.Host;
if (Request.Url.Port != 80)
baseUrl += ":" + Request.Url.Port.ToString();
baseUrl += Request.RawUrl;
BasePath.Attributes.Add("HREF", baseUrl);
}
}
【讨论】：
~/ 仅适用于具有 runat="server" 属性的标签，因为这会告诉 asp.net 呈现控件。
例如
不会按照您的预期呈现，因为 asp.net 没有呈现控件。相反，您应该使用。
或者将 css 链接放在 head 标签中，例如
【讨论】：
你可以用这个：
<a href="<% =GetBaseURL() %>/">Home</a>
public static string GetBaseURL()
{
string url =HttpContext.Current.Request.Url.Scheme + “://” + HttpContext.Current.Request.Url.Authority + HttpContext.Current.Request.ApplicationPath.TrimEnd(’/') + ‘/’;
//EPiServer’s url start with a / so remove the url if (when) it contains one
if(url.EndsWith(”/”))
return url.Remove(url.LastIndexOf(”/”));
else
return url;
}
【讨论】：
URL 重写的一个大问题是当你使用相对路径时它会搞砸你。
例如，如果您的应用程序根目录中有一个名为 page.aspx 的文件，该文件用于多级导航的页面。例如
Virtual Path => Physical Path
/ => /page.aspx?id=1
/food/banana => /page.aspx?id=2
假设您在 page.aspx 中有一个指向您的 css 文件的相对路径，该文件位于 /css/main.css
<link rel="stylesheet" href="css/main.css"/>
当 page.aspx 从 /food/banana 的上下文中执行时，浏览器将尝试查找 /food/css/main.css，它不存在。
我的做法是禁用图像、CSS、JS 的 URL 重写，并有一个指向您的样式表（以及 img src 和 JavaScript）的绝对链接。这样你就可以保证浏览器总能找到它。然后从您的样式表中，您可以使用背景图像的相对路径。
我发现这种方法维护起来最简单，因为您无需花费数周时间尝试反向重写您的链接。
【讨论】：
我也遇到了样式表和图片的问题。
我不想使用 Base Href 解决方案并解决了我的问题，即更新我的相对路径以以单个斜杠开头。
nopCommerceStore 用于建立网上商店。
nopCommerce 使用“UrlRewritingNet.UrlRewrite”库来处理 url 重写。
nopCommerce 使用 ASP.NET 主题和皮肤来定义网上商店的外观。
在服务器端，您有以下文件夹结构：
根
root/App_Themes/darkOrange/base.css
root/App_Themes/darkOrange/cart-checkout-order.css
root/App_Themes/darkOrange/category.css
root/App_Themes/darkOrange/css/ie6.css（这个文件最终被删除了）
root/App_Themes/darkOrange/img/transparent_image_example.png
root/css/ie6.css
root/MasterPages/Root.Master
root/Default.aspx root/Category.aspx
当登陆默认页面（浏览器请求http;//yourstore/default.aspx）时，您的html源将包含以下html代码：
<link href="App_Themes/darkOrange/base.css" type="text/css" rel="stylesheet" />
<link href="App_Themes/darkOrange/cart-checkout-order.css" type="text/css" rel="stylesheet" />
<link href="App_Themes/darkOrange/category.css" type="text/css" rel="stylesheet" />
...
浏览器将触发以下请求：
http;//yourstore/App_Themes/darkOrange/base.css
http;//yourstore/App_Themes/darkOrange/cart-checkout-order.css
http;//yourstore/App_Themes/darkOrange/category.css
...
当点击“图书”类别时，浏览器会请求 http;//yourstore/Category/29-books.aspx) 您的 html 源代码将包含以下 html 代码：
<link href="../App_Themes/darkOrange/base.css" type="text/css" rel="stylesheet" />
<link href="../App_Themes/darkOrange/cart-checkout-order.css" type="text/css" rel="stylesheet" />
<link href="../App_Themes/darkOrange/category.css" type="text/css" rel="stylesheet" />
浏览器将触发以下请求：
http;//yourstore/Category/../App_Themes/darkOrange/base.css
http;//yourstore/Category/../App_Themes/darkOrange/cart-checkout-order.css
http;//yourstore/Category/../App_Themes/darkOrange/category.css
到目前为止一切正常。为了使所有浏览器的外观一致，需要加载 IE6 特定的样式表。 我学到了两件重要的事情：
不要将样式表添加到“App_Themes”文件夹中，而是将其放在单独的文件夹中。
如果引用图像，请使用以单斜杠开头的相对路径。
为了将特定布局应用于在 IE6 中查看的页面，我创建了一个新样式表并将其放置在“root/App_Themes/darkOrange/css”文件夹中。 在文件 'root/MasterPages/Root.Master' 中，我添加了以下几行 html 代码：
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" media="screen" href="/css/ie6.css" />
<![endif]-->
当 Css 文件放置在“App_Themes”文件夹或“App_Themes”内的子文件夹中时，它将自动被引用。 这会在非 IE6 浏览器中导致不良行为。 IE6 布局被应用到页面并弄乱了页面的外观。
当登陆默认页面（浏览器请求http;//yourstore/default.aspx）时，服务器会解析请求。 生成的 html 源代码将包含以下 html 代码：
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" media="screen" href="/css/ie6.css" />
<![endif]-->
而且 html 还包含以下行：
<link href="App_Themes/darkOrange/css/ie6.css" type="text/css" rel="stylesheet" />
所有浏览器都会触发以下请求：
http;//yourstore/App_Themes/darkOrange/css/ie6.css
IE6 将触发一个额外的请求（文件将从 IE 缓存中检索）：
http;//yourstore/App_Themes/darkOrange/css/ie6.css
这是不受欢迎的行为，因此我不得不将“ie6.css”文件替换为新文件夹。它现在被放置在 'root/css/ie6.css' 中。
为了在 IE6 中支持透明 png 图片，ie6.css 文件包含一些 css 'filter' 属性。
例如其中一个 div 选择器将包含以下 css 代码行：
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true', sizingMethod='crop', src='../App_Themes/darkOrange/img/transparent_image_example.png');
登陆默认页面时（浏览器请求http;//yourstore/default.aspx）IE6会请求：
http;//yourstore/img/transparent_image_example.png
当点击“书籍”类别时，浏览器请求 http;//yourstore/Category/29-books.aspx) IE6 会请求：
http;//yourstore/img/transparent_image_example.png
两者都导致“找不到页面”（HTTP/1.1 404 Not Found）。
替换后：
'../App_Themes/darkOrange/img/transparent_image_example.png'
与：
'/App_Themes/darkOrange/img/transparent_image_example.png'
一切正常。
这是因为相对路径以单斜杠开头。 浏览器会以如下方式解释 url：
它是否以'http;//'开头？如果是，则必须是绝对路径；如果不是，则必须是相对路径。
相对路径：
它是否以单斜线开头？如果是，它必须是“绝对路径引用”；如果不是，它必须是“相对路径引用”
注意：请参阅文档“统一资源标识符 (URI)：通用语法”(http://www.ietf.org/rfc/rfc2396.txt) 中的第 5 节“相对 URI 引用”。
如果是url重写页面：
使用“相对路径引用”（例如“http;//yourstore/Category/29-books.aspx”和“../App_Themes/darkOrange/img/transparent_image_example.png”）时，浏览器将失败。
使用“绝对路径引用”（例如“http;//yourstore/Category/29-books.aspx”和“/App_Themes/darkOrange/img/transparent_image_example.png”）时，浏览器会成功。
【讨论】：