如何点击HTML按钮运行Python脚本？本地部署遇执行无效问题

我明白你现在的困境——按钮能显示但点了没反应，核心问题在于你的server.py大概率只是单纯提供静态文件服务，没处理按钮点击后的请求逻辑，同时前端也没正确把点击事件和后端执行脚本的操作关联起来。下面给你一套完整的可落地解决方案，用轻量的Flask框架搭建后端，让按钮真正能触发脚本执行：

第一步：先装必要依赖 #

打开终端，先安装Flask（如果还没装的话）：

pip install flask

第二步：重写server.py #

把原来的server.py替换成下面的代码，它会负责渲染页面、接收前端请求，并且执行对应的Python脚本：

from flask import Flask, render_template, request, jsonify
import subprocess
import os

app = Flask(__name__)

# 定义两个脚本的路径，确保和server.py在同一文件夹下
SCRIPT_1 = os.path.join(os.path.dirname(__file__), "你的第一个脚本名.py")
SCRIPT_2 = os.path.join(os.path.dirname(__file__), "你的第二个脚本名.py")

# 渲染首页
@app.route('/')
def show_index():
    return render_template('index.html')

# 处理执行脚本的请求
@app.route('/execute-script', methods=['POST'])
def execute_script():
    script_type = request.json.get('script')
    try:
        # 根据前端传来的标识选择要执行的脚本
        if script_type == "script1":
            run_result = subprocess.run(['python', SCRIPT_1], capture_output=True, text=True)
        elif script_type == "script2":
            run_result = subprocess.run(['python', SCRIPT_2], capture_output=True, text=True)
        else:
            return jsonify({'status': 'fail', 'msg': '未知的脚本类型'})
        
        # 返回执行结果，方便前端显示
        return jsonify({
            'status': 'success',
            'output': run_result.stdout,
            'error': run_result.stderr
        })
    except Exception as e:
        return jsonify({'status': 'fail', 'msg': str(e)})

if __name__ == '__main__':
    app.run(debug=True)

第三步：调整index.html #

修改你的页面代码，给按钮添加点击事件，通过AJAX请求后端接口，还能显示执行结果：

<!DOCTYPE html>
<html>
<head>
    <title>执行Python脚本</title>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.4/dist/jquery.min.js"></script>
</head>
<body>
    <h2>点击按钮执行脚本</h2>
    <button id="btn-script1">执行脚本1</button>
    <button id="btn-script2">执行脚本2</button>
    
    <!-- 用来显示执行结果的区域 -->
    <div id="result-area" style="margin-top:20px; padding:10px; border:1px solid #eee;"></div>

    <script>
        // 绑定脚本1按钮的点击事件
        $('#btn-script1').click(() => triggerScript('script1'));
        // 绑定脚本2按钮的点击事件
        $('#btn-script2').click(() => triggerScript('script2'));

        // 发送请求执行脚本的通用函数
        function triggerScript(scriptName) {
            $('#result-area').text('正在执行，请稍等...');
            $.ajax({
                url: '/execute-script',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify({script: scriptName}),
                success: (res) => {
                    let resultText = res.status === 'success' 
                        ? `执行成功！\n输出内容：${res.output}` 
                        : `执行失败：${res.msg}`;
                    if (res.error) resultText += `\n错误信息：${res.error}`;
                    $('#result-area').text(resultText);
                },
                error: () => {
                    $('#result-area').text('请求后端失败，请检查server.py是否正常运行');
                }
            });
        }
    </script>
</body>
</html>

第四步：整理文件结构 #

一定要按照这个结构放文件，Flask默认会找templates目录下的模板文件：

你的项目文件夹/
├── server.py
├── templates/
│   └── index.html
├── 你的第一个脚本名.py
└── 你的第二个脚本名.py

第五步：测试运行 #

1. 终端进入项目文件夹，执行python server.py
2. 打开浏览器访问http://localhost:5000
3. 点击按钮，就能看到脚本执行的结果啦！

小提示 #

• 如果你的系统里Python命令是python3（比如Mac/Linux），记得把server.py里的['python', ...]改成['python3', ...]
• 先单独运行那两个脚本，确保它们本身没有语法错误，避免影响测试

内容的提问来源于stack exchange，提问作者Edsel Norwood