使用电子的本机拖放文件上传器答案

【问题标题】：Native Drag and Drop File uploader using electron使用电子的本机拖放文件上传器
【发布时间】：2019-02-25 16:15:21
【问题描述】：

我正在制作一个简单的文件上传器来将 jpeg 文件上传到服务器。但我遇到了障碍。

我似乎无法让Native File Drag and drop 工作。当我将图像或任何其他文件拖到文件上传器所在的位置时，它只会显示停止光标。像这样：

<input class="upload" type="file" id="Filedata" capture="" name="Filedata" multiple="" onchange="update()" accept="image/jpeg">
       <script type="text/javascript" charset="utf-8">
         document.getElementById('Filedata').ondragstart = (event) => {
         event.preventDefault()
         ipcRenderer.send('ondragstart', '/path/to/item')
       }
       </script>

以上是我要链接的代码。它在 Chrome 测试中运行良好，但在 Electron 应用程序上无法正常运行。我做错了什么？有什么我想念的吗。我将另一半代码放在我的main.js

const { ipcMain } = require('electron')
ipcMain.on('ondragstart', (event, filePath) => {
  event.sender.startDrag({
    file: filePath,
    icon: '/path/to/icon.jpg'
  })
})

有人对我做错了什么有任何想法吗？任何帮助将不胜感激，这里是repo of my project

编辑完全重新安装成功了谢谢。

【问题讨论】：

可能是related
经过测试，根据提供的答案，上述内容是准确的。尝试重新安装。 Drag'n'Drop into Electron app is not allowed 的可能重复项

标签： javascript node.js electron

【解决方案1】：

下载 repo 并进行测试后，我没有发现任何问题，因此似乎某些内容被意外删除或更改了。有两种方法可以解决此问题。

选项 1：

阅读“Updating Electron”后运行npm update electron-prebuilt -save

选项 2：

卸载 Electron 并重新安装：

卸载：npm uninstall electron
重新安装：npm install electron

我确实在您的 main.js 中注意到您在第 34 行定义了常量 ipcMain。在顶部调用常量是一个好习惯，您可以修改：

const {app, BrowserWindow} = require('electron')

到：

const {app, BrowserWindow, ipcMain} = require('electron')

【讨论】：