1

我在这里的几个问题中建议使用 urlrewriter.net。我在显示图像和样式表时遇到了困难。

我阅读了 ScottGu 的博客(再次按照此处的推荐),最后他确实提到了这个问题并声明使用 ~/ 用于服务器控件等(文章末尾的“正确处理 CSS 和图像引用”)。

我尝试了他的解决方案,但似乎不起作用。

唯一对我有用的是写完整的路径。出于某种原因,在我看来,这不是正确的解决方案。这会给开发和调试带来严重的问题。

有谁知道问题的原因是什么?我需要在 web.config 文件中更改什么吗?

谢谢

4

8 回答 8

2

您是否尝试过 Page.ResolveUrl?

<link href="<%=Page.ResolveUrl("~/mycss.css")%>" type="text/css" rel="stylesheet" />
于 2009-01-09T17:37:10.407 回答
2

以我的经验,基本标签是比它解决的问题多得多的根源

我强烈建议第一个选项,通过即在行动之前检查 .aspx扩展名来限制允许 URLrewriter 影响的内容。

于 2008-12-16T16:18:30.320 回答
0

~/ 仅适用于具有 runat="server" 属性的标签,因为这告诉 asp.net 呈现控件。

例如

<link href="~/mycss.css" type="text/css" rel="stylesheet" />

不会按照您的预期呈现,因为 asp.net 没有呈现控件。相反,您应该使用。

<link runat="server" href="~/mycss.css" type="text/css" rel="stylesheet" />

或者将 css 链接放在 head 标签中,例如

<head runat="server">
  <link href="~/mycss.css" type="text/css" rel="stylesheet" />
</head>

于 2008-12-23T09:27:43.560 回答
0

我认为您需要从重写引擎中排除样式表和图像目录。我不熟悉您使用的引擎,但是如果您使用的重写规则基于非常广泛的规则进行重写,它将错误地指向您的样式表和图像,以及我相信的 javascript。

您还可以尝试使用基本标签。

<base href="http://www.w3schools.com/images/" />

尝试将其放在您的<head>, 指向您的图像文件夹。

于 2008-12-07T20:13:34.093 回答
0

你可以使用这个:

<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;
}
于 2009-07-04T08:43:37.170 回答
0

我第二次使用基本href。尽管您确实必须对站点从域的根目录运行时的差异(即生产与 Visual Studio 服务器相比)做一些改动。

<base id="BasePath" runat="Server"/>

然后在master代码后面。

protected void SetBaseHref() {
if (Request.RawUrl != Request.Url.PathAndQuery)
{
string 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);
    }

}

于 2008-12-16T16:14:12.810 回答
0

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)的绝对链接。这样你就可以保证浏览器总能找到它。然后从您的样式表中,您可以使用背景图像的相对路径。

我发现这种方法维护起来最简单,因为您不需要花费数周时间尝试反向重写您的链接。

于 2009-07-04T09:08:19.570 回答
0

我也遇到了样式表和图像的问题。

我不想使用 Base Href 解决方案并解决了我的问题,即更新我的相对路径以以单斜杠开头。

我的设置

nopCommerceStore 用于建立网上商店。

nopCommerce 使用“UrlRewritingNet.UrlRewrite”库来处理 url 重写。

nopCommerce 使用 ASP.NET 主题和皮肤来定义网上商店的外观。

在服务器端,您具有以下文件夹结构:

根/App_Themes/darkOrange/base.css

根/App_Themes/darkOrange/cart-checkout-order.css

根/App_Themes/darkOrange/category.css

root/App_Themes/darkOrange/css/ie6.css(这个文件最终被删除了)

根/App_Themes/darkOrange/img/transparent_image_example.png

根/css/ie6.css

根/MasterPages/Root.Master

根/Default.aspx 根/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中的透明PNG

到目前为止,一切运行良好。为了使所有浏览器的外观一致,需要加载 IE6 特定的样式表。我学到了两个重要的东西:

  1. 不要将样式表添加到“App_Themes”文件夹中,而是将其放在单独的文件夹中。

  2. 如果引用图像,请使用以单斜杠开头的相对路径。

样式表和“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”中。

引用图像、Url 重写和相对路径:

为了在 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”)时,浏览器会成功。

于 2009-11-24T10:10:59.170 回答