We should validate images

[holmesworcester]

Right now we don't seem to validate images beyond checking the extension. So I can add ".png" to any file and send it.

Is there a way to validate images more thoroughly in frontend before sending?

Is there a way to validate images more thoroughly in the backend?

What's the most secure way to do this?

[holmesworcester]

I think this is taken care of by the libraries we're using to the extent possible. Closing.

[holmesworcester]

Reopening, given #743

[holmesworcester]

There are two ways we're doing images now: data uris for profile images, and rendered files, for files.

We should ensure that we're protected in both cases against polyglot images and somebody building a data URI that does not behave as we expect to do, e.g.

• A CSRF, like hit our local endpoint to invite the attacker to our community, e.g.? I don't think this atttack works in this case because a data uri created by filling in PNG data is getting loaded in an image SRC and not a link the user follows. But I want to note that we are not only worried about access to other sites.
• Pass a polyglot file that does something weird, e.g. a PNG that is actually an SVG.

More info on polyglots:

• https://331.cybersec.fun/polyglot.html (a PNG that is also html containing js)
• https://github.com/DavidBuchanan314/tweetable-polyglot-png (a png that is a zip)
• A list of examples: https://github.com/DavidBuchanan314/tweetable-polyglot-png

One sort of folksy but reasonable step I've heard a lot of applications take is to recompress images from untrusted sources.

Another thought I have on this, which might be a good habit for us to get into when things like this come up, would be to understand what signal does.