Detecting and preventing changing of links when page is rendered on browser

I want to translate a website and render it on my domain. Here is the flow:

URL entered ---> Server ----> Extract text --> Call made to google's machine translation API
                                                     |
                                                     |
                                                    \ /
   Send back the translated HTML <--  Replace all text in source website with translated

This is the flow right now. Is this how everyone would attempt this? I use puppeteer to render the webpage before extracting the text.

I am facing a situation for which I do not have the answer. He is what happens. When the translated HTML is sent back a certain section of it looks as follows:

....
<img src="https://chat.amplify.ai/plugin/img/closeme-v2.png" alt="Close">
....

Something happens during the rendering that this URL gets changed to http://localhost:3001/plugin/img/closeme-v2.png where the hostname is my localhost address (testing on my local machine)

My question is, how do I detect and prevent this? What happens as a result of this is, that the images do not load because the address gets changed.

Is there any event in Javascript that will let me handle this?