有什么好办法处理图片上传
如果用户上传的图片较大,加载页面的时候需要等待很久,而且也会影响到其他人,有没有好办法,按照原图的长宽比例压缩,如果固定长宽会导致图片扭曲?,并且不能让原图变很模糊。大家会按这种思路处理图片吗? 以及用什么实现比较好
采取前端压缩再上传
采用七牛云展示的时候输出压缩图片就行了 花不了几块钱
前端压缩或者后端压缩,再者就是上云。
阿里云oss加cdn
laravel有image扩展包 那个可以按比例缩小 调模糊度
前端可以压缩图片,把图片放进 canvas,设定尺寸和质量,然后再导出,实现压缩。 对于图片上传,后端可以考虑对接 OSS,然后让前端直传 OSS ,这样后端就不会有那么大的压力。
现在的 CDN 基本都可以做图片压缩及裁切,当然你也可以在上传的时候将图片转为 webp 格式,然后前端做兼容,支持 webp 的浏览器用 webp 格式,不支持的用原来的图片格式,再通过 CDN URL 参数压缩裁切一下。
上传的时候:前端可以压缩 用法是image转canvas再转image 可以去找找 后端也可以对图片进行裁剪 intervention/image 这个包不错 文件存储位置 可以放到七牛云 oss这些专门做云存储的 用了oss之类的话 其实可以看下oss自带裁剪功能的 不过要收费的 费用不高
usefulangle.com/post/321/javascrip...
我觉得你需要的是这个: 前端js异步上传文件进度条
服务器入方向的带宽一般都是很高的,一张图片你想要在不损失画质的前提下保存最好就是不压缩。加载慢应该是设计的问题,如果是放到服务器,一般服务器出方向的带宽是很低的。推荐是图片传到服务器,服务器再走内网传到OSS(或其他存储服务),把OSS的链接(原图/压缩的看你需求)给前端,前端加载这个OSS的链接。
压缩而又不失真,自己实现有些困难吧,不如上传到云
回复太长发不出来,我截图了
大文件的话,建议是前端直传对象存储(七牛云,阿里oss,腾讯cos等),然后返回链接给后端;对象存储开启cdn加速。这样做的好处是减少服务器的容量和压力,后续做好对象存储里的文件分类、删除管理就好了。
如果因为图片文件过大导致前端静态资源加载慢而影响使用体验,那就在前端上传前,在不影响画质的同时进行压缩和提示就好了!
OSS + CDN