CODEWITHSUNDEEP
phpregexpreg-replace
Kladskull
Kladskull

Reputation: 10742

What am I doing wrong for my RegEx Match?

I am trying to replace url contents inside a css file on the fly.

I am aiming to:

  1. Insert a string (a path, i.e: '/testing/sub/path/') right before any valid file I come across.
  2. I want to ensure that the path is inserted after the first quote or double quite if it exists.
  3. If there is a non file (such as) data:, I want it to be skipped.
  4. If there is a path starting with '../' or '/' I want to ignore it.

I am using PHP with preg_replace()

Here is my regex: /(url\()(['"a-zA-Z0-9].*)(\))/g

You can see the exact test I am trying in the image below. For the reason of not knowing Regex well, it is actually selecting the strings with data in them which I don't want. Here was my last attempt, which is totally messed up: /(url\()(['\"\W][^data\:image]['"a-zA-Z0-9].*)(\))/g

I can figure out the actual replace string, its just the initial match that is confusing me.

My example from regex101

Here is my test data: (not valid css, just using for preg testing)

.grab-cursor {
    cursor:url(grab.png) 8 8, move; 
}

.grabbing-cursor{ 
    cursor:url(grabbing.png) 8 8, move;
    cursor:url("grabbing.png") 8 8, move;
    cursor:url("data.png") 8 8, move;
    cursor:url(data.png) 8 8, move;
    cursor:url('data.png') 8 8, move;
    cursor:url('grabbing.png') 8 8, move;
}
    background-image: url(video-ico.png);
    background-repeat: no-repeat;
    background-position: center center;

background: url(data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/)
background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/")
background: url('data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/')
/*  background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M256,92.481c44.433,0,86.18,17.068,117.553,48.064C404.794,171.411,422,212.413,422,255.999%09s-17.206,84.588-48.448,115.455c-31.372,30.994-73.12,48.064-117.552,48.064s-86.179-17.07-117.552-48.064%09C107.206,340.587,90,299.585,90,255.999s17.206-84.588,48.448-115.453C169.821,109.55,211.568,92.481,256,92.481%20M256,52.481%09c-113.771,0-206,91.117-206,203.518c0,112.398,92.229,203.52,206,203.52c113.772,0,206-91.121,206-203.52%09C462,143.599,369.772,52.481,256,52.481L256,52.481z%20M206.544,357.161V159.833l160.919,98.666L206.544,357.161z%22/%3E%3C/svg%3E") no-repeat center center; */
    background: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%09%20width=%22512px%22%20height=%22512px%22%20viewBox=%220%200%20512%20512%22%20enable-background=%22new%200%200%20512%20512%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22white%22%20d=%22M243.391,166.834l215.748-42.766l-0.145-0.727L444.558,50.5l-363.4,72.035%09C63.07,126.12,50,141.985,50,160.424c0,16.312,0,242.407,0,242.407c0,32.351,26.318,58.669,58.668,58.669h294.664%09c32.35,0,58.668-26.318,58.668-58.669V167.575v-0.741H243.391z%20M422,402.831c0,10.294-8.374,18.669-18.668,18.669H108.668%09C98.374,421.5,90,413.125,90,402.831V261.765h332V402.831z%20M339.528,186.834l-34.931,34.931h-52.426l34.931-34.931H339.528z%09%20M395.225,80.668l41.139,27.529l-51.396,10.214l-41.17-27.55L395.225,80.668z%20M293.981,100.736l41.199,27.568l-51.394,10.213%09l-41.229-27.588L293.981,100.736z%20M192.625,120.827l41.257,27.608l-51.395,10.213L141.2,131.021L192.625,120.827z%20M183.77,186.834%09h52.426l-34.931,34.931h-52.426L183.77,186.834z%20M355.385,221.765l34.931-34.931h52.426l-34.931,34.931H355.385z%20M232.923,393.31%09V284.553l88.693,54.38L232.923,393.31z%22/%3E%3C/svg%3E") no-repeat center center;
    background-size: 80px 80px;
    opacity: 0.9;

Upvotes: 0

Views: 78

Answers (2)

Hammer
Hammer

Reputation: 1582

Well, you may try this one.

(url\()((['"]{0,1})[a-zA-Z0-9-]+.[a-zA-Z]+\3)(\))

Demo

This will match everything inside url() url('') or url("") that ends with a file extension. Here i only matched situation without numbers. if you need files that have numbers in their extension, just change the pattern [a-zA-Z] into [a-zA-Z0-9]. This may not be the best solution but works fine with your test data.

Update the question if you need further help.

Upvotes: 2

Pillow89
Pillow89

Reputation: 1

I'm not sure, but I think you need lookahead

Your [^data:image] can't work because it searching for individual signs.

Maybe you can try this: (It's not perfect, maybe helpful for your situation)

(url\()((?!"data:image|'data:image|data:image).*)(\))

(?=exp) is a lookahead and searches for the given string (?!exp) is the opposite. But you can read more in the given link above.

I changed your ['"a-z...] to .* It searches now for any char

Hope it helps.

Upvotes: 0

Related Questions