英文:
Torn between a couple practices for file upload to CDN
问题
我正在工作的平台涉及客户端（ReactJS）和服务器（NodeJs，Express），当然。
这个平台的主要功能涉及用户不断上传图片。
使用 multer 成功设置了一切，以接收表单数据中的图片到我的 API 服务器上，现在是时候创建一个“图片管理系统”了。
我将要解决的主要问题是用户的文件大小不可预测。这些文件是图片，取决于用户的操作系统，即用户拍照、用户截屏。
第一个解决方案是确定最大文件大小，并使用压缩算法将其传输到 API 服务器。当后端成功接收到它时，图片将被上传到 CDN（Cloudinary），然后链接与其他相关记录一起存储在数据库中。
第二个解决方案，我倾向于将这个“上传到 CDN”的系统转移到客户端，并让客户端直接连接到 Cloudinary，然后获取安全链接并插入到将发送到服务器的 JSON 中。
这消除了处理文件大小的问题，这是一种进步，但我想知道这是否是一个好的做法。
英文:
The platform I'm working on involves the client(ReactJS) and server(NodeJs, Express), of course.
The major feature of this platform involves users uploading images constantly.
Everything has been setup successfully using multer to receive images in formdata on my api server and now its time to create an "image management system".
The main problem I'll be tackling is the unpredictable file size of users. The files are images and the depend on the OS of the user i.e user taking pictures, users taking screenshots.
The first solution is to determine the max file size, and to transport it using a compression algorithm to the api server. When the backend receives it successfully, images are uploaded to a CDN (Cloudinary) and then the link is stored in the database along with other related records.
The second which im strongly leaning towards is shifting this "upload to CDN" system to the client side and make the client connect to cloudinary directly and after grab the secure link and insert into the JSON that would be sent to the server.
This eliminates the problem of grappling with file sizes which is progress, but I'll like to know if it is a good practice.
答案1
得分: 1
使用Cloudinary上传小部件进行客户端上传时，可以限制文件大小。在调用小部件时，您可以包括'maxFileSize'参数，并将其值设置为500000（值应以字节为单位提供）。
如果客户端尝试上传较大的文件，他/她将收到错误消息，指示已超出最大文件大小，并且上传将失败。
或者，您可以选择限制图像的尺寸，如果超过了限制，上传不会失败，而是会自动按给定的尺寸缩小，保持宽高比，并且上传请求将成功。
但是，使用此方法不能保证上传的文件将低于某个所需的特定大小（例如500KB），因为每个图像都不同，一个缩小到给定尺寸的图像可能会导致文件大小小于您的阈值，而另一个图像可能会略微超过它。
可以通过将其作为传入转换的一部分来实现此目标，使用限制裁剪方法。
相关文档链接：
https://cloudinary.com/documentation/upload_widget
https://cloudinary.com/documentation/image_transformations#limit
https://cloudinary.com/documentation/upload_images#incoming_transformations
英文:
Restricting the file size is possible when using the Cloudinary Upload Widget for client-side uploads.
You can include the 'maxFileSize' parameter when calling the widget, setting its value to 500000 (value should be provided in bytes).
https://cloudinary.com/documentation/upload_widget
If the client will try and upload a larger file he/she will get back an error stating the max file size is exceeded and the upload will fail.
Alternatively, you can choose to limit the dimensions of the image, so if exceeded, instead of failing the upload with an error, it will automatically scale down to the given dimensions while retaining aspect ratio and the upload request will succeed.
However, using this method doesn't guarantee the uploaded file will be below a certain desired size (e.g. 500kb) as each image is different and one image that is scaled-down to given dimensions can result in a file size that is smaller than your threshold, while another image may slightly exceed it.
This can be achieved using the limit cropping method as part of an incoming transformation.
https://cloudinary.com/documentation/image_transformations#limit
https://cloudinary.com/documentation/upload_images#incoming_transformations
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论