RegEx for extracting image paths in PHP

Question

I want to extract particular pattern matching URL from the given img tag in PHP.

Input

<img class="ezlazyload aligncenter size-large wp-image-473313" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22459%22%20height%3D%22600%22%3E%3C%2Fsvg%3E" alt="shiny-ash-hat-pikachu" width="459" height="600" data-ezsrc="https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.png" data-ezsrcset="https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.png 459w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-138x180.png 138w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-314x410.png 314w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu.png 640w">

Above is my $img_tag and I want to extract the image URL either it is in any format(jpg or png) in the above tag:

Attempt

preg_match_all('/"(https:\/\/cdn.gamerant.com\/wp-content\/uploads\/.+?\.png)"/s', $img_tag, $matches1, PREG_PATTERN_ORDER);

Above one extract .png only , if I change to .jpg means it extract jpg, How to extract png or jpg, if exist any in given $img_tag?

Answer 1

I'm sure there are much easier ways to solve your problem. This is just continuing your original method, using parenthesis () to group:

$img_tag = '<img class="ezlazyload aligncenter size-large wp-image-473313" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22459%22%20height%3D%22600%22%3E%3C%2Fsvg%3E" alt="shiny-ash-hat-pikachu" width="459" height="600" data-ezsrc="https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.png" data-ezsrcset="https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.PNG 459w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-138x180.jpg 138w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-314x410.JPEG 314w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu.jpeg 640w">';

preg_match_all('/(https:\/\/cdn.gamerant.com\/wp-content\/uploads\/)(.+?\.)(png|jpg|jpeg|JPEG|PNG|JPG)/s', $img_tag, $matches1, PREG_PATTERN_ORDER);

var_dump($matches1);

All Outputs:

array(4) {
  [0]=>
  array(5) {
    [0]=>
    string(77) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.png"
    [1]=>
    string(77) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.PNG"
    [2]=>
    string(77) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-138x180.jpg"
    [3]=>
    string(78) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-314x410.JPEG"
    [4]=>
    string(70) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu.jpeg"
  }
  [1]=>
  array(5) {
    [0]=>
    string(44) "https://cdn.gamerant.com/wp-content/uploads/"
    [1]=>
    string(44) "https://cdn.gamerant.com/wp-content/uploads/"
    [2]=>
    string(44) "https://cdn.gamerant.com/wp-content/uploads/"
    [3]=>
    string(44) "https://cdn.gamerant.com/wp-content/uploads/"
    [4]=>
    string(44) "https://cdn.gamerant.com/wp-content/uploads/"
  }
  [2]=>
  array(5) {
    [0]=>
    string(30) "shiny-ash-hat-pikachu-459x600."
    [1]=>
    string(30) "shiny-ash-hat-pikachu-459x600."
    [2]=>
    string(30) "shiny-ash-hat-pikachu-138x180."
    [3]=>
    string(30) "shiny-ash-hat-pikachu-314x410."
    [4]=>
    string(22) "shiny-ash-hat-pikachu."
  }
  [3]=>
  array(5) {
    [0]=>
    string(3) "png"
    [1]=>
    string(3) "PNG"
    [2]=>
    string(3) "jpg"
    [3]=>
    string(4) "JPEG"
    [4]=>
    string(4) "jpeg"
  }
}

Desired output

$img_tag = '<img class="ezlazyload aligncenter size-large wp-image-473313" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22459%22%20height%3D%22600%22%3E%3C%2Fsvg%3E" alt="shiny-ash-hat-pikachu" width="459" height="600" data-ezsrc="https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.png" data-ezsrcset="https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.PNG 459w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-138x180.jpg 138w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-314x410.JPEG 314w, https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu.jpeg 640w">';

preg_match_all('/(https:\/\/cdn.gamerant.com\/wp-content\/uploads\/)(.+?\.)(png|jpg|jpeg|JPEG|PNG|JPG)/s', $img_tag, $matches1, PREG_PATTERN_ORDER);

var_dump($matches1[0]);

For desired output, you may just var_dump($matches1[0]);:

array(5) {
  [0]=>
  string(77) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.png"
  [1]=>
  string(77) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-459x600.PNG"
  [2]=>
  string(77) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-138x180.jpg"
  [3]=>
  string(78) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu-314x410.JPEG"
  [4]=>
  string(70) "https://cdn.gamerant.com/wp-content/uploads/shiny-ash-hat-pikachu.jpeg"
}