如何将 Python 在网页上运行
将 Python 在网页上运行的方法包括：使用 Web 框架（如 Django、Flask）、WebAssembly、使用适配库（如 Brython、Skulpt）、通过 WebSocket 或 REST API 与后端通信。其中，使用 Web 框架最为常见，能实现复杂的后端逻辑，并与前端高效交互。
使用 Web 框架（如 Django、Flask）
Django 和 Flask 是最流行的两个 Python Web 框架，它们提供了强大的工具和库来开发 Web 应用程序。Django 是一个高度集成的框架，适合大型项目，而 Flask 是一个轻量级框架，适合小型项目或服务。通过 Web 框架，开发者可以在服务器端运行 Python 代码，并通过 HTML、CSS 和 JavaScript 构建前端，使用 HTTP 请求和响应进行数据交互。
Django 的优势在于其“电池俱全”的设计理念，包含了 ORM、表单处理、用户认证等多种组件，适合开发大型复杂的应用。Flask 则更灵活，开发者可以自由选择所需的扩展，更适合需要特定功能的小型项目。下面将详细介绍如何使用 Django 和 Flask 将 Python 在网页上运行。
一、Django、Flask
1. Django
Django 是一个高级的 Python Web 框架，它鼓励快速开发和干净、实用的设计。 Django 的目标是让创建复杂、数据库驱动的网站成为一种简单而愉快的体验。
安装 Django
首先，通过 pip 安装 Django：
pip install django
创建 Django 项目
使用 django-admin 命令创建一个新的 Django 项目：
django-admin startproject myproject
进入项目目录并启动开发服务器：
cd myproject
python manage.py runserver
在浏览器中访问 http://127.0.0.1:8000/，你将看到一个欢迎页面，表示项目已经成功创建并运行。
创建 Django 应用
在 Django 项目中，可以创建多个应用（app），每个应用负责不同的功能模块。使用 startapp 命令创建一个新的应用：
python manage.py startapp myapp
在 myproject/settings.py 中添加新应用到 INSTALLED_APPS 列表：
INSTALLED_APPS = [
...
'myapp',
]
定义模型
在 myapp/models.py 中定义数据模型：
from django.db import models
class Post(models.Model):
title = models.CharField(max_length=100)
content = models.TextField()
created_at = models.DateTimeField(auto_now_add=True)
运行迁移
运行数据库迁移命令以创建相应的数据库表：
python manage.py makemigrations
python manage.py migrate
创建视图
在 myapp/views.py 中创建视图函数：
from django.shortcuts import render
from .models import Post
def index(request):
posts = Post.objects.all()
return render(request, 'index.html', {'posts': posts})
配置 URL
在 myproject/urls.py 中配置 URL 路由：
from django.contrib import admin
from django.urls import path
from myapp import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.index, name='index'),
]
创建模板
在 myapp/templates 目录下创建 index.html 模板文件：
<!DOCTYPE html>
<html>
<head>
<title>My Blog</title>
</head>
<body>
<h1>My Blog</h1>
{% for post in posts %}
<h2>{{ post.title }}</h2>
<p>{{ post.content }}</p>
<p><em>{{ post.created_at }}</em></p>
{% endfor %}
</body>
</html>
运行服务器
再次启动开发服务器：
python manage.py runserver
在浏览器中访问 http://127.0.0.1:8000/，你将看到数据库中的帖子列表。
2. Flask
Flask 是一个轻量级的 Python Web 框架，它提供了简单而灵活的设计，允许开发者根据需求自由选择所需的组件和扩展。
安装 Flask
通过 pip 安装 Flask：
pip install flask
创建 Flask 应用
创建一个新的 Flask 应用：
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
posts = [
{'title': 'First Post', 'content': 'This is the content of the first post.'},
{'title': 'Second Post', 'content': 'This is the content of the second post.'}
]
return render_template('index.html', posts=posts)
if __name__ == '__main__':
app.run(debug=True)
创建模板
在 templates 目录下创建 index.html 模板文件：
<!DOCTYPE html>
<html>
<head>
<title>My Blog</title>
</head>
<body>
<h1>My Blog</h1>
{% for post in posts %}
<h2>{{ post.title }}</h2>
<p>{{ post.content }}</p>
{% endfor %}
</body>
</html>
运行服务器
运行 Flask 应用：
python app.py
在浏览器中访问 http://127.0.0.1:5000/，你将看到帖子列表。
二、WebAssembly
WebAssembly（简称 WASM）是一种用于在 Web 浏览器中运行高性能代码的低级字节码格式。虽然 WebAssembly 主要用于运行 C/C++ 和 Rust 等语言编写的代码，但也可以将 Python 代码编译成 WebAssembly，并在浏览器中运行。
Pyodide
Pyodide 是一个将 CPython 解释器和常用的 Python 科学计算库编译成 WebAssembly 的项目。它允许在浏览器中运行 Python 代码，并与 JavaScript 进行交互。
安装 Pyodide
首先，从 Pyodide 的官方 GitHub 仓库下载最新版本：
git clone https://github.com/pyodide/pyodide.git
cd pyodide
使用 Pyodide
在 HTML 文件中加载 Pyodide 并运行 Python 代码：
<!DOCTYPE html>
<html>
<head>
<title>Pyodide Example</title>
<script src="https://cdn.jsdelivr.net/pyodide/v0.18.1/full/pyodide.js"></script>
</head>
<body>
<h1>Pyodide Example</h1>
<textarea id="python-code" rows="10" cols="50">
print("Hello, Pyodide!")
</textarea>
<button onclick="runPython()">Run Python</button>
<pre id="output"></pre>
<script>
async function loadPyodideAndPackages() {
const pyodide = await loadPyodide();
return pyodide;
}
let pyodideReady = loadPyodideAndPackages();
async function runPython() {
let pyodide = await pyodideReady;
let code = document.getElementById("python-code").value;
let output = await pyodide.runPythonAsync(code);
document.getElementById("output").textContent = output;
}
</script>
</body>
</html>
在浏览器中打开该 HTML 文件，即可运行 Python 代码并查看输出。
三、使用适配库
适配库（如 Brython 和 Skulpt）将 Python 代码转换为 JavaScript，并在浏览器中运行。它们提供了一种简单的方式来在网页上运行 Python 代码，而无需服务器端支持。
Brython
Brython（Browser Python）是一个将 Python 3 代码转换为 JavaScript 并在浏览器中运行的库。它提供了对大多数标准库的支持，并允许与 JavaScript 进行交互。
使用 Brython
在 HTML 文件中加载 Brython 并运行 Python 代码：
<!DOCTYPE html>
<html>
<head>
<title>Brython Example</title>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/brython@3.9.5/brython.min.js"></script>
</head>
<body onload="brython()">
<h1>Brython Example</h1>
<script type="text/python">
from browser import document
def greet(event):
document["output"].text = "Hello, Brython!"
document["greet"].bind("click", greet)
</script>
<button id="greet">Greet</button>
<div id="output"></div>
</body>
</html>
在浏览器中打开该 HTML 文件，即可运行 Python 代码并查看输出。
Skulpt
Skulpt 是一个将 Python 代码转换为 JavaScript 并在浏览器中运行的库。与 Brython 类似，它提供了一种简单的方式来在网页上运行 Python 代码。
使用 Skulpt
在 HTML 文件中加载 Skulpt 并运行 Python 代码：
<!DOCTYPE html>
<html>
<head>
<title>Skulpt Example</title>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/skulpt@0.11.0/skulpt.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/skulpt@0.11.0/skulpt-stdlib.js"></script>
</head>
<body>
<h1>Skulpt Example</h1>
<textarea id="python-code" rows="10" cols="50">
print("Hello, Skulpt!")
</textarea>
<button onclick="runPython()">Run Python</button>
<pre id="output"></pre>
<script>
function outf(text) {
let output = document.getElementById("output");
output.textContent += text;
}
function runPython() {
let code = document.getElementById("python-code").value;
Sk.configure({ output: outf });
Sk.importMainWithBody("<stdin>", false, code);
}
</script>
</body>
</html>
在浏览器中打开该 HTML 文件，即可运行 Python 代码并查看输出。
四、通过 WebSocket 或 REST API 与后端通信
在某些情况下，可以将 Python 代码运行在服务器端，通过 WebSocket 或 REST API 与前端进行通信。这种方法适用于需要在服务器端执行复杂计算或访问数据库的应用。
使用 Flask 创建 REST API
通过 Flask 创建一个简单的 REST API：
from flask import Flask, jsonify, request
app = Flask(__name__)
@app.route('/api/greet', methods=['POST'])
def greet():
data = request.get_json()
name = data.get('name', 'World')
return jsonify({'message': f'Hello, {name}!'})
if __name__ == '__main__':
app.run(debug=True)
前端与 REST API 交互
在 HTML 文件中使用 JavaScript 与 REST API 进行交互：
<!DOCTYPE html>
<html>
<head>
<title>REST API Example</title>
</head>
<body>
<h1>REST API Example</h1>
<input type="text" id="name" placeholder="Enter your name">
<button onclick="greet()">Greet</button>
<div id="output"></div>
<script>
async function greet() {
let name = document.getElementById("name").value;
let response = await fetch('/api/greet', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name: name })
});
let data = await response.json();
document.getElementById("output").textContent = data.message;
}
</script>
</body>
</html>
在浏览器中打开该 HTML 文件，并在输入框中输入姓名，然后点击“Greet”按钮，即可通过 REST API 与后端通信，并显示问候消息。
使用 WebSocket 与后端通信
通过 WebSocket 与后端进行实时双向通信。以下是一个使用 Flask-SocketIO 创建 WebSocket 服务器的示例：
from flask import Flask, render_template
from flask_socketio import SocketIO, emit
app = Flask(__name__)
socketio = SocketIO(app)
@app.route('/')
def index():
return render_template('index.html')
@socketio.on('message')
def handle_message(message):
emit('response', {'message': f'Hello, {message}!'})
if __name__ == '__main__':
socketio.run(app, debug=True)
前端与 WebSocket 交互
在 HTML 文件中使用 JavaScript 与 WebSocket 进行交互：
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Example</title>
</head>
<body>
<h1>WebSocket Example</h1>
<input type="text" id="message" placeholder="Enter a message">
<button onclick="sendMessage()">Send</button>
<div id="output"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.0/socket.io.js"></script>
<script>
const socket = io();
socket.on('response', function(data) {
document.getElementById("output").textContent = data.message;
});
function sendMessage() {
let message = document.getElementById("message").value;
socket.send(message);
}
</script>
</body>
</html>
在浏览器中打开该 HTML 文件，并在输入框中输入消息，然后点击“Send”按钮，即可通过 WebSocket 与后端通信，并显示响应消息。
总结
将 Python 在网页上运行的方法多种多样，开发者可以根据项目需求选择合适的方法。使用 Web 框架（如 Django、Flask）最为常见，能实现复杂的后端逻辑，并与前端高效交互。WebAssembly、适配库（如 Brython、Skulpt）以及通过 WebSocket 或 REST API 与后端通信也提供了不同的解决方案。希望本文对你在网页上运行 Python 代码有所帮助。
相关问答FAQs：
如何在网页上运行Python代码？
要在网页上运行Python代码，可以使用多种工具和技术。最常见的方法是使用Web框架如Flask或Django，这些框架允许你创建Web应用并在服务器端执行Python代码。此外，还有一些在线Python运行环境，比如Repl.it和PythonAnywhere，它们可以让你直接在浏览器中编写和运行Python代码而无需搭建自己的服务器。
在网页中使用Python有什么限制吗？
使用Python在网页上时，主要的限制来自于安全性和性能。例如，直接在客户端运行Python代码（如JavaScript那样）并不常见，因为大多数浏览器不支持Python。为了确保网页的安全性，服务器端代码执行需要遵循严格的访问控制和数据处理规则。
如何将Python与HTML结合使用？
将Python与HTML结合使用的最佳方式是利用模板引擎。Jinja2是Flask的默认模板引擎，它可以让你在HTML中嵌入Python代码。通过这种方式，你可以动态生成网页内容，响应用户的输入，并将数据从后端发送到前端。Django也提供了类似的功能，使得Python与HTML的结合变得简单直观。
