如何限制直接云上载的文件大小(客户端jquery)

时间:2014-01-29 18:11:18

标签: file-upload cloudinary

我在文档中找不到使用直接上传时如何限制文件的大小。我正在使用:

在服务器端生成文件上载输入字段
cloudinary.uploader.image_upload_tag

之后,文件从客户端上传。

另外。 $ cloudinary.config似乎是为了指定api密钥和存储桶名称而设计的,没有其他配置。

我很欣赏这一点!

1 个答案:

答案 0 :(得分:3)

如果您使用直接上传,请在直接上传中修复您的最大可上传文件大小javascript billow是代码示例。

$(function () {
    $('#direct_upload input[type="file"]')
    .fileupload({
      dropZone: '#direct_upload',
      disableImageResize: true,
      imageMaxWidth: 600,
      imageMaxHeight: 600,
      maxFileSize:2048 //2 mb
      acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
      start: function () {
        $("#direct_upload .progress").attr("style","display:block")
      },

      progress: function (e, data) {
        var com = Math.round((data.loaded * 100.0) / data.total)
        $("#direct_upload .progress .progress-bar").attr("style","width:"+com+"%")
        $("#direct_upload .progress .progress-bar").text(com +"% Complete")
      },
    })
    .on('cloudinarydone', function (e, data) {
        $('#submit-btn').attr('style','');
        $("#direct_upload .progress").attr("style","display:none")
        $("#direct_upload .progress .progress-bar").attr("style","width:0%")
        $("#direct_upload .progress .progress-bar").text("0% Complete")

        $.post(this.form.action, $(this.form).serialize()).always(function (result, status, jqxhr) {
          $('.status_value').text(result.errors ? JSON.stringify(result.errors) : status);
        });

        var  image_url = $.cloudinary.image(data.result.public_id, {
           format: data.result.format, width: 75, height: 75,style: "display:none", crop: "fill"
           })
        $('.Submitted').append(image_url);
    });
  });

希望这对你有用。

maxFileSize:2048

这会将文件大小最大修复为2 MB。