将网站部署到应用程序时的 mvc 捆绑和相关 css 图像

Posted 2023-03-06

【中文标题】将网站部署到应用程序时的 mvc 捆绑和相关 css 图像

【英文标题】：mvc bundling and relative css image when website is deployed to an application

【发布时间】：2015-12-02 00:55:45

【问题描述】：

要将相对图像路径转换为绝对路径，*** 中有很多问题被问到并得到了解答，如下所示：

MVC4 StyleBundle not resolving images

建议添加new CssRewriteUrlTransform()如下：

bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle")
       .Include("~/Content/css/jquery-ui/*.css", new CssRewriteUrlTransform()));

这实际上曾经救过我。但是现在我将我的网站部署到应用程序（不是网站的根目录）仍然存在问题：

申请是：

http://localhost/sample/

但是图片的网址是这样的：

http://localhost/css/imgs/spirit.png

应该是这样的：

 http://localhost/sample/css/imgs/spirit.png

虽然捆绑的 css 链接本身是正确且有效的。

【问题讨论】：

示例是 IIS 上的虚拟目录吗？

它是 IIS 中的应用程序和虚拟目录。在此示例中，应用程序名称为 sample

看看***.com/questions/19765238/…，它完整地描述了发生了什么和你需要做什么。

【参考方案1】：

如果不涉及虚拟目录，则以下代码将执行：

bundles.Add(new StyleBundle("~/bundles/css").Include(
                "~/Content/css/*.css", new CssRewriteUrlTransform()));

但是当使用 VirtualDirectory 时，CssRewriteUrlTransform 将重写到 Host 而不是 Host/VirtualDirectory。解决方案是派生 CssRewriteUrlTransform ，这在此处进行了充分讨论：ASP.NET MVC4 Bundling with Twitter Bootstrap:

public class CssRewriteUrlTransformWrapper : IItemTransform

    public string Process(string includedVirtualPath, string input)
               
        return new CssRewriteUrlTransform().Process("~" + VirtualPathUtility.ToAbsolute(includedVirtualPath), input);           
    

【参考方案2】：

这实际上只是另一个优化问题 当应用程序作为虚拟目录运行时正常工作。

由于您使用虚拟目录来托管您的网站，因此您应该制作一个包装器，该包装器将使用固定路径调用 CssRewriteUrlTransform：

public class CssRewriteUrlTransformWrapper : IItemTransform

        public string Process(string includedVirtualPath, string input)
                   
            return new CssRewriteUrlTransform().Process("~" + VirtualPathUtility.ToAbsolute(includedVirtualPath), input);           
        

More info.