将文件从本地存储上传到带有 chrome 扩展名的服务器

Question

如何使用 chrome 扩展将文件从用户本地存储上传到我的网络服务器。我使用了一个简单的文件类型输入标签，当用户点击它时，文件浏览器打开，扩展弹出消失，没有上传任何内容。我在 Ubuntu 15.04 上使用谷歌浏览器。

在我点击图标时加载的 popup.html 中：

<form method="post" action="" id="smsCampForm">

  <input type="text" name="recipent_number" id="recipent_number" placeholder="Recipent numbers separated by commas" class="form-control" required>
  <input type="file" name="fileToUpload" class="form-control" placeholder="Upload Excel File">
  <select name="listToSendSms" id="listToSendSms"></select>
  <textarea name ="message_content" rows="5" maxlength="120"  id="message_content" placeholder="Message maximum 120 characters" class="form-control"  required></textarea>
  <input type="submit" id="smsSubmit" name="submit" value="Send SMS" class="btn btn-success"></input>
</form>

我有一个 javascript 文件：

$("#smsCampForm").submit(function(event){
document.getElementById("smsSubmit").value = "Sending SMS...";
var formData = new FormData(this);
formData.append("chromeExtensionRequest","1");
$.ajax({
  url : myurl,
  type : 'POST',
  data : formData,
  processData : false,
  contentType : false,
  success : function(data,status){
    $("#smsResponse").html("<div class='alert alert-info'>"+data+"</div>");
    document.getElementById("smsSubmit").value = "Send SMS";
  }
});
event.preventDefault();
});
});

Answer 1

由于弹出窗口在失去焦点时会被完全破坏，因此您的文件选择器基本上不会触发任何内容 - 所有代码都已卸载。

没有办法阻止这种行为；因此，您应该将其卸载到其他内容，例如在选项卡或背景页面中加载的单独页面。