RSA
RSA

Reputation: 1449

Why the crossorigin works in localhost but was not in other devices

In a request from Instagram, the URL refers to images or cover of a video post can be seen by adding crossorigin to img tag and it works fine in localhost requests.

<img src="<%= image.thumbnail %>" alt="<%= image.caption %>" title="<%= image.caption %>"
                             class="img-fluid" crossorigin>

But when the web app is called on other devices (even in the same network) gets following error:

enter image description here

these lines were also added to the code but are not working

app.use(function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "https://*.cdninstagram.com/*"); // update to match the domain you will make the request from
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

Upvotes: 0

Views: 163

Answers (1)

Parsaria
Parsaria

Reputation: 1089

Instagram has introduced a strict-origin-when-cross-origin policy and is only allowing the following cross origin sites:

https://www.instagram.com
https://*.fbcdn.net
https://*.instagram.com
https://*.cdninstagram.com
https://*.facebook.com
https://*.fbsbx.com

This leads me to believe that they are restricting websites to display the API data. The data itself is still accessible, just not directly over a website. You would need to use a proxy or a server to resolve it

Upvotes: 1

Related Questions