第一段引用上面的摘要：
本文档将指导您如何使用 Flask 框架在 HTML 页面中显示 TXT 文件的内容。我们将演示如何从 Python 后端读取文件内容，并将其传递到 HTML 模板中，最终在网页上呈现出来。通过学习本文，您将掌握 Flask 框架中数据传递的基本方法，并能灵活应用于其他类似场景。
步骤详解：
-
Python 后端 (app.py):
立即学习“前端免费学习笔记（深入）”；
首先，在 Python 后端代码中，你需要读取 TXT 文件的内容。这里我们使用 open() 函数打开文件，并使用 readline() 方法读取文件的第一行。当然，你也可以使用 readlines() 读取所有行，或者使用其他更复杂的方式来处理文件内容。
from flask import Flask, render_template app = Flask(__name__) # 读取 TXT 文件内容 try: with open("costs.txt", "r") as file1: line = file1.readline() except FileNotFoundError: line = "File not found: costs.txt" # 处理文件不存在的情况 @app.route('/') def home(): return render_template('index.html', Line=line) if __name__ == '__main__': app.run(debug=True)代码解释：
- with open("costs.txt", "r") as file1:: 使用 with 语句打开文件，确保文件在使用完毕后自动关闭，避免资源泄漏。 "r" 表示以只读模式打开文件。
- line = file1.readline(): 读取文件的第一行并将其赋值给变量 line。
- except FileNotFoundError:: 处理 costs.txt 文件不存在的情况，避免程序崩溃。
- return render_template('index.html', Line=line): 将变量 line 传递给 index.html 模板。Line 是一个变量名，可以在 HTML 模板中使用。
-
HTML 前端 (index.html):
接下来，在 HTML 模板中，你需要使用 Flask 的模板引擎 (Jinja2) 来显示从 Python 后端传递过来的数据。使用双大括号 {{ ... }} 将变量包裹起来，即可在 HTML 页面中显示其值。
<!DOCTYPE html> <html> <head> <title>Displaying TXT Content</title> </head> <body> <h1>My buggy editor</h1> <div class="spacer"> <a href="/new" class="button">Make buggy</a> <a href="/buggy" class="button">Show buggy</a> <a href="/json" class="button">Get buggy JSON</a> </div> <p> Use this editor to specify a racing buggy. The editor saves it in its little database and generates JSON data for the buggy. This is the data you need to supply when you log into the <strong><a href="{{ server_url }}">race server</a></strong> and enter your buggy into the next race. </p> <p> Remember that if your data is not accepted by the race server, your buggy will be disqualified from that race... so make sure you program your editor correctly. </p> <h2>TXT File Content:</h2> <p>{{ Line }}</p> <!-- 显示 TXT 文件内容 --> </body> </html>代码解释：
- {{ Line }}: Jinja2 模板语法，用于显示从 Python 后端传递过来的 Line 变量的值。
-
运行程序:
确保 costs.txt 文件与 app.py 在同一目录下，然后运行 app.py。在浏览器中访问 http://127.0.0.1:5000/ (或者 Flask 启动时显示的地址)，你就可以看到 costs.txt 文件的第一行内容显示在网页上了。
注意事项:
- 文件路径: 确保 open() 函数中指定的文件路径是正确的。 如果文件不在当前目录下，需要提供完整的文件路径。
- 编码问题: 如果 TXT 文件使用特定的编码格式（例如 UTF-8），需要在 open() 函数中指定编码方式。例如：open("costs.txt", "r", encoding="utf-8")。
- 安全性: 如果 TXT 文件内容来自用户输入，需要进行适当的过滤和转义，以防止跨站脚本攻击 (XSS)。
总结:
通过以上步骤，你已经成功地将 TXT 文件的内容显示在了 HTML 页面上。这个过程涉及了 Python 后端的文件读取和数据传递，以及 HTML 前端的模板渲染。掌握了这些基本技巧，你就可以灵活地处理各种数据展示的需求。 记住，根据实际情况调整文件读取方式、数据处理逻辑和 HTML 模板，以满足你的具体需求。
