前端图片显示，如何最大程度的让其不压缩变形，同时又能铺满盒子？

很多项目都会有后台上传图片的功能，这导致往往用户会传一些不规则比例的图片（这个确实头疼，其实不只用户传图没有固定宽高比，前端样式上，图片盒子也很难保证一个通用的比例），也就导致了有些超出比例的图片在前端显示的时候会出现压缩，拉伸，变形问题。
现在项目通过阿里云储存能够实现一些基本的图片缩放，裁剪处理，但是很显然，在严重超出前端图片盒子比例的情况下，仍然会有拉伸变形问题。
我这边的处理方法总结了一下，只能做到两步：
1 阿里云裁剪，压缩。
2 图片居中自适应，即：img{max-width:100%;max-heightt:100%}。
如上问题所述，当原图宽高比例严重不符的时候仍然会存在问题。
我能想到的方式还有一种就是把图片作为图片盒子的背景，然后居中铺满，但是很显然，工作量大，改动多（因为框架用的vue，拉取数据后还得绑定样式）。
问：
有没有更好的方式能达到最大化的图片显示优化？请指教