Python Eel 是一个强大的工具，可以帮助开发者使用 Python 构建基于 Web 技术的桌面应用程序。本教程将详细介绍如何使用 Python Eel 创建一个多页面的桌面应用，并且重点讲解如何指定应用程序使用的端口号。
1. 准备工作
首先，确保你已经安装了 Python 环境以及 pip 包管理工具。如果还没有安装，可以访问 Python 官网 下载并安装最新的 Python 版本。
安装 Eel 库：
代码语言：bash复制pip install eel创建一个项目目录，例如 my_eel_project，并按照以下结构准备项目文件：
my_eel_project/
├── web/
│ ├── main.html
│ ├── page1.html
│ ├── page2.html
│ └── js/
│ └── main.js
└── main.py2. 创建 HTML 文件
在 web 文件夹中创建多个 HTML 文件作为你的应用程序的页面。
main.html：
<!DOCTYPE html>
<html>
<head>
<title>Main Page</title>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<h1>Main Page</h1>
<button onclick="navigate('page1.html')">Go to Page 1</button>
<button onclick="navigate('page2.html')">Go to Page 2</button>
</body>
</html>page1.html：
<!DOCTYPE html>
<html>
<head>
<title>Page 1</title>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<h1>Page 1</h1>
<button onclick="navigate('main.html')">Go to Main Page</button>
<button onclick="navigate('page2.html')">Go to Page 2</button>
</body>
</html>page2.html：
<!DOCTYPE html>
<html>
<head>
<title>Page 2</title>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<h1>Page 2</h1>
<button onclick="navigate('main.html')">Go to Main Page</button>
<button onclick="navigate('page1.html')">Go to Page 1</button>
</body>
</html>在这些 HTML 文件中，我们通过简单的按钮实现页面之间的导航，每个按钮都调用 JavaScript 中的 navigate 函数。
3. 创建 JavaScript 文件
在 js 文件夹中创建 JavaScript 文件，用于处理页面的交互逻辑。
js/main.js：
function navigate(page) {
window.location.href = page;
}这个 JavaScript 文件定义了一个 navigate 函数，用于实现页面之间的跳转。
4. 编写 Python 主程序
创建 main.py 文件来启动 Eel 应用，并且指定应用程序使用的端口号。
main.py：
import eel
# 初始化 eel，指定 web 文件夹为前端文件目录
eel.init('web')
# 启动 eel，打开 main.html 页面，并指定端口号，例如 8080
eel.start('main.html', size=(800, 600), port=8080)在这段代码中，我们通过 port 参数指定了 Eel 应用程序使用的端口号为 8080。你可以根据需要更改端口号。
5. 运行应用程序
在终端中进入项目目录，并执行 main.py 文件来启动应用程序：
python main.py现在，你可以在浏览器中访问 http://localhost:8080，来查看你的 Eel 应用程序。点击页面上的按钮，可以在 main.html、page1.html 和 page2.html 之间进行导航，而指定的端口号 8080 也在应用中生效。
6. 扩展应用功能
除了简单的页面导航外，你还可以通过 Eel 支持的其他功能，如与 Python 后端的交互、使用本地存储等，进一步扩展应用的功能。
与 Python 后端交互
你可以在 JavaScript 中调用 Python 函数，实现前后端的互动。例如，在 JavaScript 文件中添加以下代码：
代码语言：javascript复制function callPythonFunction() {
eel.pythonFunction()((result) => {
console.log(result);
});
}在 Python 中定义对应的函数：
代码语言：python代码运行次数：0复制@eel.expose
def pythonFunction():
return "Hello from Python!"使用本地存储
你还可以利用 HTML5 的本地存储功能，在用户浏览器中存储数据。例如：
代码语言：javascript复制function saveData() {
localStorage.setItem('key', 'value');
}
function loadData() {
let value = localStorage.getItem('key');
console.log(value);
}7. 处理错误和调试
在开发过程中，可能会遇到各种错误。以下是一些常见问题及其解决方法：
端口被占用
如果指定的端口号已被其他应用程序占用，你会看到类似 OSError: [Errno 98] Address already in use 的错误信息。解决方法是选择一个未被占用的端口号，修改 main.py 中的 port 参数。
跨域问题
有时，前端页面可能会遇到跨域资源共享 (CORS) 的问题。可以在 Python 代码中添加 CORS 头部，允许跨域请求：
代码语言：python代码运行次数：0复制@eel.expose
def pythonFunction():
response = flask.jsonify({"message": "Hello from Python!"})
response.headers.add('Access-Control-Allow-Origin', '*')
return response调试
在调试过程中，可以使用浏览器的开发者工具 (F12) 查看控制台日志，了解前端页面中的错误信息。同时，可以在 Python 代码中使用 print 语句输出调试信息。
@eel.expose
def pythonFunction():
print("Python function called")
return "Hello from Python!"8. 部署应用
开发完成后，你可能需要将应用程序打包并分发给用户。Eel 支持多种打包工具，如 PyInstaller 和 cx_Freeze。
使用 PyInstaller 打包应用程序：
pip install pyinstaller
pyinstaller --onefile main.py这个命令会生成一个可执行文件，用户可以直接运行它，而无需安装 Python 和依赖包。
总结
本教程详细介绍了如何使用 Python Eel 创建一个多页面的桌面应用，并且重点讲解了如何指定应用程序使用的端口号。通过这些步骤，你可以快速开始使用 Eel 开发自己的桌面应用程序，并在开发过程中自定义所需的端口号。
除了基本的页面导航，本教程还介绍了如何与 Python 后端交互、使用本地存储、处理错误和调试应用，以及如何打包和部署应用。希望本教程能够帮助你更好地理解和应用 Python Eel。如果有任何问题或者进一步的需求，请随时与我联系！
