PHP search & replace img src - php

Question

Ok, the situation is simple (i hope!)
I am working locally (xampp) and in my .php file i've got the following img elements :
<img src="http://example.com/images/project-1/image1.jpg"/>
<img src="http://example.com/images/project-1/image2.jpg" />
<img src="http://example.com/images/project-1/image3.jpg" />
How can I make it to run a search and replace function (with php if possible) that will fulfil the following:
1) On page load to scan the whole document and find all the above images that don't appear (broken links)
2) IF from the above we find broken images , then to replace only the part that says "http://example.com" with "http://127.0.0.1/projectfile".
So what I want is to scan the whole document for broken images and if I find x of them then to replace the src from this:
src="http://www.example.com/images/project-1/image1.jpg"
with this:
src="http://127.0.0.1/project/images/project-1/image1.jpg"
I want to do this for all the images automatic, and not manually.
Currently I am struggling to do this with jQuery but I probably I am gonna need PHP because I need to navigate to the previous folders,scan dir etc etc
Thank you for you support!
Any ideas or tips?
So far what I tried and succeeded partially as I said above is to search/replace with jQuery:
$('img').attr('src',function(i,e){
return e.replace("http://example.com","http://127.0.0.1");
})
,which ignores the live website src folder and sticks directly to the local folder but I need to make it a bit more clever :)

Answer 1

Use jquery error event to detect missing images and replace them. Following code should do the trick
$(document).ready(function(){
$('img').on('error',function(){
// Avoid endless loop for noexistant images
if($(this).data('alreadyChecked')) return;
$(this).data('alreadyChecked',true);
//Replace src
$(this).attr('src', $(this).attr('src').replace("http://example.com","http://127.0.0.1"));
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<img src="http://example.com/images/project-1/image1.jpg"/>
<img src="http://example.com/images/project-1/image2.jpg" />
<img src="http://example.com/images/project-1/image3.jpg" />

Answer 2

A solution with .htaccess is the best approach for this. PHP wont do it because PHP executes before the page loads. By the time these elements are on your page, it's already too late for PHP to touch them. I'm sure a hack with jQuery could work on this but it wont be reliable and it will slow down your loads and you will likely have flicker because jQuery can't touch the items until after the page loads, and at that point your broken links will already be showing until jQuery replaces them.
Try this in your .htaccess file:
RewriteEngine on
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} !-f
RewriteCond %{REQUEST_URI} \.(gif|jpg|jpeg|png)$
RewriteRule ^.*/images/(.*)/(.*)$ http://127.0.0.1/project/images/$1/$2 [L,R=301]
.htaccess will replace the URLs at the request level before PHP or jQuery ever even see the content.

Answer 3

The best way to achieve what you want is to use javascript/jquery and replace the href value when the condition (broken link) is met.

Answer 4

Thank you guys!!
Although I was initially looking for a PHP way to do this, apparently JQuery worked as well!
Thanks #Nadeem Manzoor and the rest! :)