如何在不重新加載 Flask 頁面的情況下顯示閃爍的消息？
[英]How to display flashing message without reloading the page in Flask?
問題描述
我正在使用 Python 中的 Flask 開發一個 Web 應用程序。
我的應用程序中有一個小函數，可以在后台計算一些值並通過閃爍的消息在網頁上顯示結果。
一切都顯示和工作正常，但需要重新加載頁面才能獲得閃爍的消息。
我想在不重新加載頁面的情況下顯示消息。
我聽說我可以用 js 做到這一點，但我對 js 不熟悉。
如果您有任何想法或建議，我將不勝感激。
我的代碼可以更好地了解我正在做的事情。
這是我的應用程序和主 html 文件之間的渲染器
{% macro render_field(field) %} <dt> {{ field.label }} <dd> {{ field(**kwargs)|safe }} {% if field.errors %} <ul class=errors> {% for error in field.errors %} <li>{{ error }}</li> {% endfor %} </ul> {% endif %} </dd> {% endmacro %}
這是我想顯示閃爍消息的 html 文件：
<div class="container-fluid" style="min-height:100%"> {% with messages = get_flashed_messages() %} {% if messages %} {% for message in messages %} <div class="alert alert-warning alert-dismissible" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span> </button> {{message}} </div> {% endfor %} {% endif %} {% endwith %} </div>
3 個解決方案
解決方案1
11 2016-12-03 19:42:28
以下是Flask Web 開發：使用 Python 開發 Web 應用程序（第 46-48 頁）對消息閃爍的評論：
有時在請求完成后向用戶提供狀態更新很有用。 這可能是確認消息、警告或錯誤。 一個典型的例子是，當您向網站提交登錄表單時出錯，服務器通過再次呈現登錄表單並在其上方顯示一條消息作為響應，通知您您的用戶名或密碼無效。 Flask 將此功能作為核心功能包含在內。 例 4-6 顯示了如何為此使用flash()函數。
例 4-6。 hello.py：閃現的消息
@app.route('/', methods=['GET', 'POST'])
def index():
form = Nameform()
if form.validate_on_submit():
old_name = session.get('name')
if old_name is not None and old_name != form.name.data:
flash('Looks like you have changed your name!')
session['name'] = form.name.data
form.name.data = ''
return redirect(url_for('index'))
return render_template('index.html', form=form, name=session.get('name'))
form = form, name = session.get('name'))
在此示例中，每次提交名稱時，都會將其與存儲在用戶會話中的名稱進行比較，該名稱會在之前提交相同表單時放在那里。 如果這兩個名稱不同，則調用flash()函數並在下一個發送回客戶端的響應中顯示一條消息。
調用flash()不足以顯示消息； 應用程序使用的模板需要呈現這些消息。 呈現閃現消息的最佳位置是基本模板，因為這將在所有頁面中啟用這些消息。 Flask 為模板提供了一個get_flashed_messages()函數來檢索消息並呈現它們，如例 4-7 所示。
例 4-7。 模板/base.html：Flash 消息呈現
{% block content %}
<div class="container">
{% for message in get_flashed_messages() %}
<div class="alert alert-warning">
<button type="button" class="close" data-dismiss="alert">×</button>
{{ message }}
</div>
{% endfor %}
{% block page_content %}{% endblock %}
</div>
{% endblock %}
在此示例中，消息使用 Bootstrap 的警報 CSS 樣式來呈現警告消息（如圖 4-4 所示）。
圖 4-4。 閃現的消息
使用循環是因為可能有多個消息排隊等待顯示，在前一個請求周期中每次調用flash()有一個消息。 從get_flashed_messages()檢索的消息將不會在下次調用此函數時返回，因此閃現的消息僅出現一次，然后被丟棄。
解決方案2
5 2016-12-03 17:44:15
在不重新加載頁面的情況下，這是不可能通過 Python 實現的。 您必須在 javascript 中執行此操作。 我建議使用display: none和display: block CSS 樣式。 這是一個例子。
1) Python 代碼，這應該放在你的app.py或flask.py文件中。
app.route('/flash/<message>')
def flash(message):
return render_template('flash.html', msg=message)
這將呈現名為flash.html的 HTML 頁面。 傳入的 URL 還會有另一個參數， <message>這是會閃爍的消息。 像這樣的 URL， localhost:80/flash/Hello%20World! 將閃爍消息“Hello World！” 在你的屏幕上。
還有另一種傳遞消息的方法，這是將參數。 代碼是這樣的。
app.route('/flash')
def flash():
message = request.args.get("msg")
return render_template("flash.html", ,msg=message)
這使用燒瓶的請求參數。 所以像這樣的 URL， localhost:80/flash?msg=Hello%20World! 將給出一條閃爍的消息，說“Hello World！”。 如果要使用此方法，請確保在導入語句中包含 import 語句， from flask import request 。
2) Html 代碼，這是模板文件夾中名為flash.html的單獨文件。
<body>
<h1 id="header">{{ message }}</h1>
<script>
var heading = $("#header");
setInterval(function() {
if (heading.style.display == "block") { heading.style.display = "none"; }
else if (heading.style.display == "none") { heading.style.display = "block"; }
}, 1000);
</script>
</body>
setInterval 中的1000是毫秒。 所以標題會每 2 秒閃爍一次。
解決方案3
1 2017-12-13 05:11:27
您可能需要考慮改用Toastr 。 我遇到了與 Flask 的 Flash 功能相同的障礙，而 Toastr 是純 JS。 您可以像代碼中的控制台日志行一樣使用它
toastr.info("Here's a message to briefly show to your user");
如何在不刷新頁面的情況下自動重裝Flask中的Jinja 2數據？
[英]How to do auto-reloading of jinja 2 data in Flask without refreshing page?
瀏覽器重新加載頁面時，如何從chrome擴展程序（無需單擊）向flask發送POST請求？
[英]How to send POST request from chrome extension (without clicking) to Flask when browser is reloading the page?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.