如何在 Eel 中正确实现 Python 函数回调 JavaScript 函数-js教程-PHP中文网

如何在 Eel 中正确实现 Python 函数回调 JavaScript 函数

本文详解 Eel 框架中跨语言调用的关键顺序问题：Python 函数需通过 eel.* 调用已暴露的 JS 函数，而前提是 eel.js 必须在自定义脚本之前加载，否则 eel 对象未定义将导致回调失败。

本文详解 eel 框架中跨语言调用的关键顺序问题：python 函数需通过 `eel.*` 调用已暴露的 js 函数，而前提是 `eel.js` 必须在自定义脚本之前加载，否则 `eel` 对象未定义将导致回调失败。

在使用 Eel 构建桌面 Web 应用时，双向通信（Python ↔ JavaScript）是核心能力。常见误区是：Python 端调用 JS 函数失败，并非逻辑错误，而是 HTML 中脚本加载顺序不当所致。

如示例所示，testpy() 在 Python 中调用 eel.say_hello_js("World")，但浏览器控制台报错 eel is not defined 或 eel.say_hello_js is not a function——根本原因在于 script.js（含 say_hello_js 和 testjs）被加载时，eel.js 尚未就绪，导致：

eel.expose(say_hello_js) 无法执行（eel 全局对象不存在）；
eel.testpy() 调用虽成功（因 eel.js 后续加载补全了前端接口），但 Python 端发起的 eel.say_hello_js(...) 因 JS 端未完成暴露而静默失败。

✅ 正确做法：严格保证 <script src="../eel.js"></script> 在所有依赖 eel 的自定义脚本之前加载。

修正后的 index.html 片段如下：

Java 接口排错助手

在调试 Java 后端 API 故障时使用此技能，尤其适用于以下任务：分析日志、跨 Controller、Service 和 Mapper 层追踪请求、定位异常根因、检查 SQL 执行或参数流转，以及生成简洁的诊断结论与修复方案。

下载


    <title>Test</title><!-- ✅ eel.js 必须最先加载 --><script type="text/javascript" src="../eel.js"></script><!-- ✅ 自定义脚本在后，确保 eel 对象已存在 --><script type="text/javascript" src="./script.js"></script><button onclick="testjs()">Test</button>

同时，JavaScript 端需确保：

eel.expose() 调用在 eel.js 加载完成之后执行（即置于 <script></script> 标签内、且位置靠后）；
函数暴露与调用逻辑清晰，避免异步竞态（Eel 默认同步暴露，无需额外 await）。

? 补充注意事项：

不要将 eel.js 的 <script></script> 标签放在底部——Eel 需在 DOM 解析早期注入全局 eel 对象；
若使用模块化（如 ES6 import），Eel 不支持原生模块语法，必须使用传统 <script></script> 标签加载；
可在 JS 中添加防御性检查：if (typeof eel !== 'undefined') { eel.expose(say_hello_js); }，提升健壮性；

Python 端调用 JS 函数时，建议添加错误回调以捕获前端异常：

eel.say_hello_js("World")()  # 返回 Promise，可链式 .catch(...)
# 或使用回调风格（推荐用于调试）：
eel.say_hello_js("World")(lambda: print("JS executed"), lambda e: print("JS error:", e))

遵循此加载顺序与调用规范，即可稳定实现“JS → Python → JS”的完整调用链，充分发挥 Eel 的双向通信能力。