python eel运行html-个人博客

功能：使用python运行html并实现交互。
需求：记录常用的链接，并实现在网页上控制服务器关机。

代码说明

main.py

程序入口：运行它即可运行html。
- passwprd是sudo的密码。
- host是本机ip，port注意不要使用已用的端口。
- 相关package请自行下载。

#coding=utf-8
import eel
import os

passwprd = '000000'  # sudo的密码

@eel.expose # 3. 使用装饰器,类似flask里面对路由的定义
def shutdown():
    print("关机")
    os.system('echo %s | sudo -S shutdown -h now' % (passwprd))
    return'已关机'


if(__name__=="__main__"):
    # 1. 定义html文件所在文件夹名称
    eel.init('web')
    # 2. 启动的函数调用放在最后,host='ip',port=0表示使用随机端口,size=(宽,高)
    eel.start('index.html', host='192.168.31.157', port=3000, size=(600,300))

index.html

网页代码：网页的具体样式在这里实现。

<!-- jquery, js的库 -->
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<!-- css样式 -->
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">    

<style>
#wrap{
    display: flex;
    justify-content: space-around;
}
</style>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>本地服务器</title>
    <script type="text/javascript" src="/eel.js"></script>
</head>

<body>
    <div class="container">
        <div class="card mt-4">
            <div class="card-body">
                <button class="btn btn-lg btn-success" id="std" onclick="shutdownbtn()">关机</button>
            </div>
            
            <div class="card-body">
                <a href="http://192.168.31.157:3001/index.php/apps/files">
                    <button class="btn btn-lg btn-success" >网盘</button>
                </a>
                <a href="http://192.168.31.157:3002">
                    <button class="btn btn-lg btn-success" >Gitlab</button>
                </a>
            </div>    
        </div>
    </div>

    <script>
        // 调用python中的函数,注意需要在定义前加上async声明异步
        async function shutdownbtn(){
            $("#std").text("正在关机");
            let content = await eel.shutdown()();
            $("#std").text(content);
        }
        
    </script>
</body>
</html>

run.sh

启动python的脚本。
- PYTHONPATH：python包的路径。

#!/bin/bash
P_HOME=$(cd $(dirname $0);pwd)
echo "P_HOME=$P_HOME"
export PYTHONPATH=/usr/local/lib/python3.8/dist-packages
# export PATH=$PATH:
echo "PYTHONPATH=$PYTHONPATH"
cd $P_HOME
python3 main.py
cd ../

local-server.service

开机自启动脚本。
- ExecStart：run.sh脚本所在的绝对路径。

[Unit]
Description=local-server
After=network.target
StartLimitIntervalSec=0
[Service]
Type=simple
Restart=always
RestartSec=1
User=root
ExecStart=/usr/bin/bash /www/wwwroot/192.168.31.157/run.sh

[Install]
WantedBy=multi-user.target

运行代码

进入到/etc/systemd/system目录内，把local-server.service文件通过软链接文件的方式添加到这里。

重载系统服务。

systemctl daemon-reload

将服务注册为开机启动。

systemctl enable local-server.service

启动服务。

systemctl start local-server.service

可能遇到的问题

在使用bash指令运行run.sh文件时提示多了\r\r。

安装dos2unix。
- linux只能运行unix格式的脚本，可用此进行转换。

sudo apt-get install dos2unix

转换格式。

sudo dos2unix run.sh

再次运行run.sh，已运行成功。

找不到chrom浏览器。

下载64位浏览器

wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb

安装

sudo dpkg -i google-chrome*; sudo apt-get -f install

效果

关机：通过调用python函数实现关机。

点击关机后，通过python回调修改html按钮的文本显示。

参考链接：
Python使用Eel和HTML开发桌面应用
 ubuntu查看python及安装包的位置
 $‘\r’: 未找到命令 : 没有那个文件或目录之解决
 在Ubuntu上20.04编写一个开机自启动的Python脚本

目录CONTENT

python eel运行html

代码说明

main.py

index.html

run.sh

local-server.service

运行代码

可能遇到的问题

效果

评论区