How to fix URL Rewriting for links inside CSS files with IIS7

I'm trying to set up a proxy server for my friends back at home. I'm currently following the tutorial on the web site (http://blogs.iis.net/carlosag/archive/2010/04/01/setting-up-a-reverse-proxy-using-iis-url-rewrite-and-arr.aspx) but I've come across a strange problem.

I've tried making /pandora redirect to www.pandora.com but the links inside the CSS files are not changing. Furthermore they are still linked to the localhost/img/.. path. They should be redirected to the localhost/pandora/img/.. path.

sniplet from the first webpage

<link rel="shortcut icon" href="/pandora/favicon.ico" type="image/x-icon" />
<link rel="icon" type="image/ico" href="/pandora/favicon.ico" />

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="css/compiled.css?v=95845013">
<link id="valanceStyle" rel="stylesheet" type="text/css" href="/pandora/static/valances/pandora/default/design.css"/>

Can you guys help me fix this problem?

Answers


It is possible to do this with a outbound rewrite rule in combination with ARR. The following rule should do it:

<system.webServer>
    <rewrite>
        <outboundRules>
            <rule name="Rewrite image URLs in CSS response" preCondition="IsCSS">
                <match pattern="localhost/img/" />
                <action type="Rewrite" value="localhost/pandora/img/" />
            </rule>
            <preConditions>
                <preCondition name="IsCSS">
                    <add input="{RESPONSE_CONTENT_TYPE}" pattern="text/css" />
                </preCondition>
            </preConditions>
        </outboundRules>
    </rewrite>
</system.webServer>

You should of course replace localhost with the proper domain names. If you are rewriting from a different domain name then the match tag should contain the domain name you want to replace and the action tag should contain the domain name you want it to replace.

As CSS is not HTML you can not use tag filtering feature of the URL rewrite module. So it can only do regular expression matching against the whole content of the CSS file which can potentially be CPU intensive on large CSS files. If you know how many URL's need to be replaced you can add the occurrences="x" attribute to the <match> tag to limit the number of matches the URL rewrite module has to look for. Also try moving the CSS rules to the top of the CSS file. E.g.:

<action type="Rewrite" value="localhost/pandora/img/" occurrences="3" />

You can also enable user mode caching in IIS and add the attribute rewriteBeforeCache="yes" to the <outboundRules> tag to let IIS cache the rewritten content. E.g.:

<outboundRules rewriteBeforeCache="yes">

More useful info and tips about outbound rewrite rules can be found in this blog post.


Need Your Help

Facebook PHP SDK: Post attached photo to fanpage

facebook api sdk attachment photo

in my working code to post a message with url-based image, i have this setup:

Android java : delete selected file / folder

java android delete-file

How to delete the selected file / folder by using long pressed ?