我有外部程序，如 ffmpeg 和 gstreamer 在后台运行并写入日志文件。我想用我的 Flask 应用程序显示此日志的内容，以便用户可以像tail -f job.log在终端中一样观看日志更新。
我尝试使用<object data="/out.log" type="text/plain">指向日志文件，但未能显示数据，或者浏览器告诉我我需要一个插件。
如何在 HTML 页面中嵌入和更新日志文件？
显示更新的日志文件的内容
IT技术
javascript
python
flask
stream
2021-02-09 00:40:37
3个回答
使用 Flask 视图永远连续读取文件并流式传输响应。使用 JavaScript 从流中读取并更新页面。此示例发送整个文件，您可能希望在某个时候截断它以节省带宽和内存。此示例在读取之间休眠以减少无限循环中的 CPU 负载并允许其他线程有更多活动时间。
from time import sleep
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/stream')
def stream():
def generate():
with open('job.log') as f:
while True:
yield f.read()
sleep(1)
return app.response_class(generate(), mimetype='text/plain')
app.run()
<pre id="output"></pre>
<script>
var output = document.getElementById('output');
var xhr = new XMLHttpRequest();
xhr.open('GET', '{{ url_for('stream') }}');
xhr.send();
setInterval(function() {
output.textContent = xhr.responseText;
}, 1000);
</script>
这几乎与这个答案相同，它描述了如何流式传输和解析消息，尽管从外部文件中读取永远是新颖的，足以成为它自己的答案。这里的代码更简单，因为我们不关心解析消息或结束流，只是永远拖尾文件。
我正在使用frontailnpm 中的包。
npm i frontail -g
frontail /var/log/syslog
访问http://127.0.0.1:9001查看日志
来源：https : //github.com/mthenw/frontail
这可能不是问题的确切答案（嵌入 html 页面），但它解决了许多专门针对以下问题的用户的问题
显示更新的日志文件的内容
对我来说@davidism 解决方案（接受的答案）仅适用于 Firefox。它在 Chrome、Brave、Vivaldi 中不起作用。也许后端和前端循环中存在某种不同步？我不知道。
无论如何，我使用了更简单的解决方案，后端没有循环，前端没有 javascript 循环。也许它“更丑”并且可能会导致一些很长的日志出现问题，但至少它适用于我使用的每个浏览器。
@app.route('/stream')
def stream():
with open("job.log", "r") as f:
content = f.read()
# as you see, file is loaded only once, no loop here, (loop is on frontend side)
return app.response_class(content, mimetype='text/plain')
<!DOCTYPE html>
<html>
<head>
<!-- page auto-refresh every 10 seconds -->
<meta http-equiv="refresh" content="10">
<title>Some title</title>
</head>
<body>
<h1>Log file ...</h1>
<script>
// function for adjusting iframe height to log size
function resizeIframe(obj) {
obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
}
</script>
<!-- iframe pulls whole file -->
<iframe src="{{ url_for('stream') }}" frameborder="0" style="overflow:hidden;width:100%" width="100%" frameborder="0" scrolling="no" onload="resizeIframe(this)"></iframe>
</body>
</html>
如您所见，唯一的 javascript 代码用于将 iframe 高度调整为当前文本大小。
其它你可能感兴趣的问题