Python3 / JS - 如何使用 eel 处理本地文件上传？

Question

我目前正在使用 Eel.

开发本地类 Electron 软件

此软件旨在作为独立的 Windows 应用程序捆绑，需要运行在用户的本地计算机上。

在此软件中，我希望能够 select 并在 Python 后端处理本地文件。要访问该文件，我使用 HTML <form> 和 <input type='file' />.

我想知道我应该如何在此框架内处理本地文件的上传，因为与电子不同，香草 JavaScript.

中没有可用的 dialog.showOpenDialog() 功能

帮助另一个用户使用 Electron，但我正在寻找 vanilla ES6 中的解决方法。

提前致谢

Answer 1

在摆弄 JS 和 HTML5 File API 之后（并且非常糟糕地未能获得预期结果），我记得我是一个 Python 人。

我想到的解决此问题的最简单方法是让 Python 处理文件管理。因此，我没有使用 HTML <input type='file'>，而是创建了一个带有 onclick JS 函数的按钮：

<button type="button" onclick="getPathToFile()">Select File</button>


<script type="text/javascript">
    function getPathToFile() {
        eel.pythonFunction()(r => console.log(r));
    };
</script>

与此同时，我让 Python 处理后端的文件对话框：

import wx
import eel

@eel.expose
def pythonFunction(wildcard="*"):
    app = wx.App(None)
    style = wx.FD_OPEN | wx.FD_FILE_MUST_EXIST
    dialog = wx.FileDialog(None, 'Open', wildcard=wildcard, style=style)
    if dialog.ShowModal() == wx.ID_OK:
        path = dialog.GetPath()
    else:
        path = None
    dialog.Destroy()
    return path

在 JavaScript 的控制台中你会得到 [1] path/to/selected/file.

此方法还允许您像在 Python 中一样对文件执行操作（解析、保存、修改...）并使用 HTML / [ 显示信息=26=] / JavaScript GUI.
很整洁。

Python3 / JS - 如何使用 eel 处理本地文件上传？

Python3 / JS - How do I handle local file uploads with eel?

javascript

html

file-upload

eel