I have the url to the instagram image, and I want to show it on my website. However, when I place the link in the <img src = "url_here"
tag the image is broken.
Also when I just click on the url everything is ok! What am I doing wrong?
You cannot make that work. If you check the devtools of your browser, in the "network" tab, you will see that the request for the image is blocked. That is because the server expects a request from the same origin, as shown in this response header:
cross-origin-resource-policy: same-origin
You can read more about it here: https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
There is no way to circumvent that, except by proxying the request using an other server that will download the image before sending it to the user's browser.