google-chrome-extension - 将“n”拖放文件拖放到 Chrome 包应用程序？

Question

有没有人成功地将文件从桌面拖放到应用程序？

我尝试将这个拖放示例放入索引文件中，但我只是收到此错误：

Can't open same-window link to "file:///C:/Users....whatever"; try target="_blank".

请分享您的故事，您尝试过的内容以及是否成功:)

Answer 1

一些可以帮助您的资源：

我们一直在研究的新 Chrome 打包应用程序代码实验室涵盖了 AngularJS 和纯 JavaScript 中的拖放。

AngularJS 拖放：https ://github.com/GoogleChrome/chrome-app-codelab/tree/master/lab5_data/angularjs/2_drop_files

JavaScript 拖放：https ://github.com/GoogleChrome/chrome-app-codelab/tree/master/lab5_data/javascript/2_drop_files

在 developer.chrome.com/trunk/apps/app_codelab5_data.html#handle_drag_and_dropped_files_and_urls 上也有用于 AngularJS 拖放的早期版本文档

不过，我们正在研究文档以涵盖这两个示例。

Answer 2

我前一阵子做过这个，它奏效了。

您遇到的问题是您正在创建一个文件 url，然后尝试导航到该 url。导航失败，而不是阅读。它由于 CSP 而失败，并且由于我们对允许的 CSP 施加的安全限制，您可能无法使用不同的 CSP 覆盖它。

但是，您应该能够只读取文件并使用内容。您需要更改该示例代码以使用 ReadAsText 或 ReadAsArrayBuffer 而不是 readAsDataURL。在这里查看更多详细信息。

请让我们知道您的进展情况！

Answer 3

只听是drop行不通的。您将不得不阻止dragover.

document.body.addEventListener('dragover', function(e) {
  e.preventDefault();
}

document.body.addEventListener('drop', function(e) {
  alert('it works!')
}