Preg_replace: append absolute path to url but exclude data url

Question

In PHP, I use this pattern to append absolute paths to relative URLs in my CSS file:

$sCssR = preg_replace('#url\((?!\s*[\'"]?(?:https?:)?//)\s*([\'"])?#', "url($1{$sRel}/", $sCss);

The pattern is working well, but data URLs like SVG images are effected too.

Example:

<? ob_start(); ?>
.url { background:url("//www.test.com/img.png"; }
.url { background:url("http://www.test.com/img.png"; }
.url { background:url("../img/test.png"; }
.url { background:url("data:image/svg+xml;utf8,<svg><circle/></svg>"); }
<?
    $sCss = ob_get_clean();
    $sRel = '//www.test.com/folder';
    $sCssR = preg_replace('#url\((?!\s*[\'"]?(?:https?:)?//)\s*([\'"])?#', "url($1{$sRel}/", $sCss);
    print $sCssR;
?>

Output will be:

.url { background:url("//www.test.com/img.png"; }
.url { background:url("http://www.test.com/img.png"; }
.url { background:url("//www.test.com/folder/../img/test.png"; }
.url { background:url("//www.test.com/folder/data:image/svg+xml;utf8,<svg><circle/></svg>"); }

Everything is fine, except the last line, which should not be touched and should look like this:

.url { background:url("data:image/svg+xml;utf8,<svg><circle/></svg>"); }

Can anyone help me to adjust the preg_replace pattern so 'data:' URLs won't be touched?

mickmackusa · Accepted Answer · 2018-02-15 13:29:26Z

1

Add a trailing (*SKIP)(*FAIL) component to the end of your pattern:

~url\((?!\s*[\'"]?(?:https?:)?//)\s*([\'"])?(?:data:(*SKIP)(*FAIL)|)~

(Pattern Demo)

This will effectively "disqualify" urls as you expect.

answered Feb 15, 2018 at 13:29

mickmackusa♦

49.2k13 gold badges98 silver badges165 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ilyssis Over a year ago

Nice, thx! Btw. do you know the difference between using '#url...#' and '~url...~' in the pattern? Both is working,

mickmackusa Over a year ago

There is no difference in this case. Because you aren't using # or ~ inside the pattern itself. Choosing the best pattern delimiter comes down to selecting a valid delimiter that will not be used in your pattern. (~ just happens to be my 1st preference after /) If you choose a pattern delimiter that also occurs inside the pattern itself, then it must be escaped -- this impacts pattern brevity and readability, so I avoid escaping whenever possible.

Collectives™ on Stack Overflow

Preg_replace: append absolute path to url but exclude data url

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related