使用 python 脚本更新 Flask 网页

Gus*_*ros 5 python flask

程序描述:我已经有一个在控制台窗口上运行的功能程序,但我想在本地托管的网页上显示其输出。该程序包括通过向 Spotify 的 API 发出请求来获取当前播放歌曲的歌词。我将当前歌词存储在“lyrics.txt”文件中。

我想要的是:

当检测到歌曲已更改时,从正在运行的歌词程序更改网页。

[编辑:]

有没有办法让 Flask 页面显示一个变量,该变量由歌词应用程序的 python request.post 更新到 Flask url,并以更新的变量作为数据?

我拥有的:

我使用 Flask 作为框架,因为它是一个本地网页。

import os, io
from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def test():
    '''reads the current lyrics file and passes it to the web page
    manually reload the page to update lyrics'''
    with io.open('lyrics.txt', 'r') as f:
        HEAD = f.readline().strip("\n")
        BODY = f.read().split('\n')

    lyrics = {"HEAD": HEAD, "BODY": BODY}
    return render_template("home.html", lyrics=lyrics)


if __name__ == "__main__":
    app.run(debug=1)
Run Code Online (Sandbox Code Playgroud)

链接到歌词应用程序 github

fur*_*ras 4

您需要JavaScript/AJAX定期发送新内容请求的页面,并且 Flask 应该从文件发送当前内容。


在此示例中,我使用jQuery.get()向服务器发送请求,并setTimeout()定期重复该请求。

Flask发送当前时间以显示不同的内容。

import datetime
from flask import Flask, render_template_string

app = Flask(__name__)

@app.route("/")
def index():
    return render_template_string("""<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>Test</title>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>

<script type="text/javascript">
function updater() {
  $.get('/data', function(data) {
    $('#time').html(data);  // update page with new data
  });
};

setInterval(updater, 1000);  // run `updater()` every 1000ms (1s)
</script>

</head>

<body>
Date & Time: <span id="time"><span>
</body>

</html>""")


@app.route('/data')
def data():
    """send current content"""
    return datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')

if __name__ == "__main__":
    app.run(debug=True)
Run Code Online (Sandbox Code Playgroud)

编辑:

相同的使用标准,fetch()无需外部库。

代码必须在之后<span>

import datetime
from flask import Flask, render_template_string

app = Flask(__name__)

@app.route("/")
def index():
    return render_template_string("""<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>Test</title>
</head>

<body>

Date & Time: <span id="time"><span>

<script type="text/javascript">
var time_span = document.getElementById("time");

function updater() {
  fetch('/data')
  .then(response => response.text())
  .then(text => (time_span.innerHTML = text));  // update page with new data
}

setInterval(updater, 1000);  // run `updater()` every 1000ms (1s)
</script>

</body>

</html>""")


@app.route('/data')
def data():
    """send current content"""
    return datetime.datetime.now().strftime('%Y-%m-%d %H:%M:%S')

if __name__ == "__main__":
    app.run(debug=True)
Run Code Online (Sandbox Code Playgroud)