#1

Images in pbs.twimg.com/media are broken on React, but on local hosts they work.
I don’t understand why from localhost react is able to load the images correctly. the only possibility i thought is that there is a control on the “robots”.

image
image1623×477 69.2 KB

es image: https://pbs.twimg.com/media/FODr03FXIAUa1Yj?format=webp&name=small
Console
image
image766×317 9.62 KB

Does anyone know a way to load them correctly?

Requests api v2 does not work with React but with Postman it does
#2

This is strange. Can you try load any other images of any other domains from your React code?

#3

Sorry for the delay.
Yes in addition to the images ti tuitter I used other link-images for example

https://upload.wikimedia.org/wikipedia/it/0/09/Twitter_bird_logo.png
https://upload.wikimedia.org/wikipedia/commons/thumb/5/5a/Patreon_logomark.svg/1024px-Patreon_logomark.svg.png
https://avatars.githubusercontent.com/u/67595890?s=400&u=fb2c3c0e4d6846e73bfdbbde76c52ed06f14c9ef&v=4

To open the images I used CardMedia React Card component - Material UI

                <CardMedia
                    sx={{ maxWidth: 900, maxHeight: 900 }}
                    component="img"
                    image={url}
                    alt="Paella dish"
                />

I also tried
<img src=url width={30} height={24} alt="Logo" />

but it doesn’t work, or better testing it locally it works, but using the online site (firebase or netlify) it doesn’t work

#4

Is your server up and running? Can you try visit the page from other device?
Or check here a similar question was asked, perhaps it could help?

#5

You’re right.
I thought it was u block, but no. I discovered that having set the “privacy” settings of edge as hard, it was blocking the images. Use Microsoft Edge to protect against potentially unwanted applications | Microsoft Docs

1 Like