防止上传具有相同名称的重复文件

时间:2019-05-24 10:52:28

标签: javascript jquery

我正在构建一个文件上传,需要防止上传重复的文件。 我尝试了一些方法,但是没有发生。 这是我的代码

var fileArray = [];
var fileCount = 0;
function readUrl(input) {
  fileCount = 0;
  var i;
  for (i = 0; i < input.files.length; i++) {
    var fsize = input.files[i].size,
      ftype = input.files[i].type,
      fname = input.files[i].name,
      fNameArray = [];
    (fFormat = fname.split(".").pop()),
      (fextension = fname.substring(fname.lastIndexOf(".") + 1));
    validExtensions = [
      "jpg",
      "pdf",
      "jpeg",
      "tiff",
      "gif",
      "png",
      "PNG",
      "doc",
      "docx"
    ];
    fNameArray.push(fname);
    fNameArray.join(",");
    if ($.inArray(fextension, validExtensions) == -1) {
      $.alert({
        icon: "fas fa-exclamation-circle fa-5x",
        title: "",
        theme: "my-theme",
        content: "This type of files are not allowed!"
      });

      $(input).val("");
      return false;
    } else if (fsize > 10000000) {
      /*1048576-1MB(You can change the size as you want)*/
      $.alert({
        icon: "fas fa-exclamation-circle fa-5x",
        title: "",
        theme: "my-theme",
        content: "File size too large! Please upload less than 10MB"
      });

      $(input).val("");
      return false;
    } else {
      fileArray.push([fname, fFormat]);
      fileArray.join(",");
      let file = input.files[i];
      var form = new FormData();
      form.append("Token", localStorage.tokenId);
      form.append("UserId", $("#loginDetails").text());
      form.append("Roles", $("#roleType").val());
      form.append("CanEmailID", $("#eAddress").text());
      form.append("file", file);
      $.ajax({
        type: "POST",
        url: baseUrl + "api/DocUpload/UploadDocument",
        //dataType: "json",
        processData: false,
        contentType: false,
        beforeSend: function() {
          $(".spinner-container").show();
        },
        crossDomain: true,
        data: form,
        success: function(response) {
          fileCount++;
          let ul = document.getElementById("appendedList");

          ul.innerHTML +=
            '<li><span class="styleList w-50 d-inline-block mr-3">' +
            file.name +
            "</span>" +
            "<span class='mx-2 font-italic' style='font-size:0.8em'>File " +
            fileCount +
            " of " +
            i +
            " </span><span class='delNode' onclick='deleteNode(this)'>X</span></li>";
          $(input)
            .prev()
            .text("Drag and drop another file or page \u000A or \u000A Browse");

          /*  document.body.querySelector(
              "a[data-docid=" + ref + "]"
            ).parentNode.previousSibling.innerHTML = fileSize / 1000 + " KB"; */
        },

        complete: function() {
          $(".spinner-container").hide();
        },
        error: function(jqXHR, error, errorThrown) {
          if (jqXHR.status && jqXHR.status == 400) {
            window.location.assign(accessUrl + "/axa/502.html");
          } else {
            window.location.assign(accessUrl + "/axa/502.html");
          }
        }
      });
    }
  }
}

我创建了一个数组fNameArray,用于保存上载的文件名。但是我无法确定是否已将特定文件添加到其中。 这是正确的方法还是我使用错误的方法来实现这一目标。 否则任何替代都将是伟大的。但是我只想在readUrl函数内部做到这一点。

0 个答案:

没有答案