python 如何嵌在网页里

Python可以通过多种方式嵌入网页中，常见的方法有Django、Flask、WebAssembly等。其中，Django和Flask是使用Python进行后端开发的框架，WebAssembly则允许在浏览器中运行Python代码。下面详细介绍Django的使用方法。

一、使用Django嵌入Python代码

1、安装和设置Django

首先，需要确保已经安装了Python和pip（Python的包管理工具）。然后，通过pip安装Django：

pip install django

安装完成后，可以创建一个新的Django项目：

django-admin startproject myproject

进入项目目录，启动开发服务器：

cd myproject python manage.py runserver

打开浏览器，访问http://127.0.0.1:8000/，应该能看到Django的欢迎页面，这意味着Django安装和配置成功。

2、创建应用程序

在Django中，一个项目可以包含多个应用程序。创建一个新的应用程序：

python manage.py startapp myapp

在myproject/settings.py中，将新创建的应用程序添加到INSTALLED_APPS列表中：

INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'myapp', ]

3、定义模型和视图

在Django中，模型定义了数据库的结构，视图负责处理用户请求并返回响应。在myapp/models.py中定义一个简单的模型：

from django.db import models
class Article(models.Model):
    title = models.CharField(max_length=100)
    content = models.TextField()

然后，生成并应用数据库迁移：

python manage.py makemigrations python manage.py migrate

在myapp/views.py中定义一个简单的视图：

from django.shortcuts import render
from .models import Article
def home(request):
    articles = Article.objects.all()
    return render(request, 'home.html', {'articles': articles})

4、配置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.home, name='home'),
]

创建一个模板文件myapp/templates/home.html，用于显示文章列表：

<!DOCTYPE html>
<html>
<head>
    <title>Home</title>
</head>
<body>
    <h1>Articles</h1>
    <ul>
        {% for article in articles %}
        <li>{{ article.title }}</li>
        {% endfor %}
    </ul>
</body>
</html>

此时，启动开发服务器并访问http://127.0.0.1:8000/，应该能看到文章列表。

二、使用Flask嵌入Python代码

1、安装和设置Flask

首先，通过pip安装Flask：

pip install Flask

创建一个新的Flask应用：

from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def home():
    articles = [
        {'title': 'Article 1', 'content': 'Content of article 1'},
        {'title': 'Article 2', 'content': 'Content of article 2'}
    ]
    return render_template('home.html', articles=articles)
if __name__ == '__main__':
    app.run(debug=True)

创建一个模板文件templates/home.html，用于显示文章列表：

<!DOCTYPE html>
<html>
<head>
    <title>Home</title>
</head>
<body>
    <h1>Articles</h1>
    <ul>
        {% for article in articles %}
        <li>{{ article.title }}</li>
        {% endfor %}
    </ul>
</body>
</html>

运行Flask应用：

python app.py

打开浏览器，访问http://127.0.0.1:5000/，应该能看到文章列表。

三、使用WebAssembly运行Python代码

WebAssembly（Wasm）是一种低级字节码格式，可以在浏览器中高效地运行。这种方法对于需要在浏览器中运行复杂计算的Python代码特别有用。

1、安装和设置Pyodide

Pyodide是一个将Python解释器编译成WebAssembly的项目。首先，下载并解压Pyodide：

wget https://github.com/iodide-project/pyodide/releases/download/0.18.1/pyodide-build-0.18.1.tar.bz2 tar -xvjf pyodide-build-0.18.1.tar.bz2

2、使用Pyodide在网页中运行Python代码

创建一个HTML文件，加载Pyodide并运行Python代码：

<!DOCTYPE html>
<html>
<head>
    <title>Pyodide Example</title>
    <script src="pyodide.js"></script>
    <script>
        async function main() {
            let pyodide = await loadPyodide();
            await pyodide.runPythonAsync(`
                import sys
                sys.version
            `);
            console.log(pyodide.runPython('print("Hello from Python!")'));
        }
        main();
    </script>
</head>
<body>
    <h1>Pyodide Example</h1>
</body>
</html>

打开这个HTML文件，应该能在浏览器控制台中看到Python代码的输出。

四、使用Brython运行Python代码

Brython是另一个将Python代码转换为JavaScript代码的项目，可以直接在浏览器中运行Python代码。

1、安装和设置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
        document <= "Hello from Python!"
    </script>
</body>
</html>