个人资料图片上传 - 客户端或服务器端

时间:2015-08-07 09:52:30

标签: javascript angularjs image client-server user-experience

构建上传个人资料图片系统。

寻找允许方形图像的系统,并允许用户选择大图像的一小部分(意味着需要裁剪)。还可根据需要根据尺寸和尺寸进行验证。

客户端裁剪

HTML5画布和基于localstorage的解决方案像ngImgCrop,Angular Image Crop一样存在,但是存在类似的问题 -

    如果高结果(超过1 MB)
  • 图像失真
  • 某些旧的(非html5)浏览器可能不支持

服务器端裁剪

像Jcrop这样的解决方案,但工作流程和时间/带宽消耗很长。

  • 客户端需要将完整的大文件发送到服务器,即使它是5MB
  • 然后从服务器再次下载到预览
  • 然后显示裁剪UI并发送裁剪坐标
  • 服务器执行裁剪并创建文件
  • 下载并显示裁剪的图像

什么是最好的方法。告诉我每个人的利弊。一个伟大的创业公司应该做什么,现在的行业标准解决方案是什么?为什么?

1 个答案:

答案 0 :(得分:1)

最佳答案主要取决于您的目标受众。许多习惯使用在线服务的人都会有一个预裁剪或小版本的个人资料图片,可以上传,并且不会尝试上传20百万像素的照片。如果您的目标受众更传统,那么您可能希望将您的方法转变为更宽容,并专注于旧的,广泛支持的技术。

对我来说,最好的解决方案如下:

  • 专注于客户端解决方案 - 让用户在客户端裁剪照片,然后在服务器上对其进行优化。
  • 要对付海量照片图片,要么拥有简单的标签"最大文件大小:1mb",要么在最初选择照片时检查文件大小,然后上传&首先调整大小/压缩它。
  

一个伟大的创业公司应该做什么以及现在的行业标准解决方案是什么?为什么?

一个伟大的创业公司不应受到行业标准的限制或过度影响,并且应该通过各种方法进行推理。