How to display instagram images on my website

Question

I am displaying Instagram feed on my website using the jsanahuja/jquery.instagramFeed

But the images are not displaying. And I am getting the following error in the console.

GET https://scontent-arn2-2.cdninstagram.com/v/t51.2885-15/sh0.08/e35/s640x640/174191033_293248945850264_4706822520582962514_n.jpg?tp=1&_nc_ht=scontent-arn2-2.cdninstagram.com&_nc_cat=1&_nc_ohc=lUMp5EnMMW8AX__E42K&edm=ABfd0MgBAAAA&ccb=7-4&oh=c755580e7a5f0c8e3d4170122390efbc&oe=60AE0543&_nc_sid=7bff83 net::ERR_BLOCKED_BY_RESPONSE

I checked the headers in the browser. Here are the request and response headers.

Even I created a simple HTML file with a single image tag and used the

https://scontent-arn2-2.cdninstagram.com/v/t51.2885-15/sh0.08/e35/s640x640/174191033_293248945850264_4706822520582962514_n.jpg?tp=1&_nc_ht=scontent-arn2-2.cdninstagram.com&_nc_cat=1&_nc_ohc=lUMp5EnMMW8AX__E42K&edm=ABfd0MgBAAAA&ccb=7-4&oh=c755580e7a5f0c8e3d4170122390efbc&oe=60AE0543&_nc_sid=7bff83

as image source but still getting the same error.

Is there any possibility to display the images? or Instagram is not allowing us to use their images on websites?

Answer 1

If you didn't find any solution yet, then you can use below PHP code to encode this image to base64.

URL : $url = "https://instagram.fsaw2-1.fna.fbcdn.net/v/t51.2885-15/301187532_174294221755151_1309939808330850870_n.jpg?stp=dst-jpg_e15&cb=2d435ae8-d7f9aae8&_nc_ht=instagram.fsaw2-1.fna.fbcdn.net&_nc_cat=1&_nc_ohc=-J-JDy4ZH1sAX_dLrAQ&edm=ALCvFkgBAAAA&ccb=7-5&ig_cache_key=MjkxMTI3NjYxNDM3MzgyNDM0MQ%3D%3D.2-ccb7-5&oh=00_AT-U540t2c9oCNV-Rlvszq5xd9Tyv5iEZ8U36xbg13cMqg&oe=63082161&_nc_sid=643ae9"

For image : 'data:image/jpg;base64,'.base64_encode(file_get_contents($url)) For video : 'data:video/mp4;base64,'.base64_encode(file_get_contents($url))

If you have bulk conversion then you can encode to base64 via jquery as well.

Hope this helps.