How do image previews/thumbnails work on Lemmy?

柊 つかさ@lemmy.world to No Stupid Questions@lemmy.world – 2 points –

If I copy an image link from Reddit or Imgur a preview shows up in the 'Create Post' page. When posted, a thumbnail shows up. However when I try to do the same with art found on Twitter or Pixiv this does not work. I try to inspect the element but I can't figure out what the difference is. Twitter's images don't end on a image extension (eg. '.png') and has some arguments in the link (eg. 'https://pbs.twimg.com/media/Foojf9RaEAA1GM-?format=png&name=small', src: https://twitter.com/_denkirk/status/1624149696263651328). However Reddit's image links are like that too and they still work. File extensions are just part of the file name and don't actually do anything so that shouldn't matter either. Maybe I'm just stupid.

You can always download the image and upload it to Lemmy (with link to source of course). However, I thought it would be better to use links to images hosted somewhere else in order to reduce load on the instance server. Lemmy.world hosting runs on donations so I thought it would be bad to upload lots of image data and have it serve them. Lemmy also describes itself as a 'link aggregator', this seems to express the preference for links over images.

Excuse my ignorance.

9

You are viewing a single comment

I'm not a lemmy dev, I just took a look at their repository

I believe it's the regex that detects if something is an image

A reddit image URL is :

https://i.redd.it/2obhjz2wb37b1.jpg
or
https://preview.redd.it/7s1p7mal707b1.jpg?width=640&crop=smart&auto=webp&v=enabled&s=f741210c6c54fed7c3ed06aaabdb1f0a49fd46cb

in both cases it has ".jpg" (with the dot) in it so it passes the regex. It does not need to finish with it.

Whereas the image your provided does not have that in it.

You can instead download the image and post it like this, or similarly take a screenshot.

I believe that sort of website does this on purpose to make sure they don't waste server resources on other website that do not drive any ad revenue to them.

(if you're not a dev, I assume this is your face right now, sorry about this:

Thanks, your answer makes sense. Changing the regex so it does not need the '.' will lead to undesirable behaviour as links with hashes in them could randomly contain something like 'png'. Adding individual support for sites (like Twitter) might be a bad idea as it complicates things.

Interestingly, this Pixiv link ends on '.jpg' yet doesn't work still: https://i.pximg.net/img-master/img/2020/05/28/00/00/23/81902983_p0_master1200.jpg (src: https://www.pixiv.net/en/artworks/81902983) They might have some extra protection.

Pixiv does not allow direct linking to images as it uses an authentication token to fetch images, and this token is only sent if you view the image from the pixiv.net site. They don't have a "no token required reduced size preview" version of the image that is used to generate thumbnails. What @iraldir saw the second time is probably a cached version of the image as it always returns 403 when I request i.pximg.net directly.

I got a 403 the first time I visited it, then when I went to the source, and back to the image it works. I suspect they have a cookie or something to detect that you're a valid user.

Because this is a different domain the cookie would not come with the image request.

Just a wild guess