Передача переменных из колбы в JavaScript
Я просмотрел похожие форумы, но не смог заставить работать ни одно из решений. Я пытаюсь передать переменные из фляги в мой файл сценария Java. Эти значения затем будут использоваться для PubNub из моего файла JavaScript.
Вот часть моего кода Python:
@app.route("/mysettings/")
def user_settings():
return render_template('Settings.html', project_name = session['project_name'] , publish_key = session['publish_key'] , subscribe_key = session['subscribe_key'] )
Вот часть моего кода JavaScript (app.js):
var settings = {
channel: {{project_name}},
publish_key: {{publish_key}},
subscribe_key: {{subscribe_key}}
};
этот код работает, если я использую его в своем файле Settings.html, но не в файле app.js.
6 ответов
Ответы mobiusklein довольно хорошие, но есть "взлом", который вы должны рассмотреть. Определите свой метод Javascript для получения параметров и отправки данных в качестве параметров вашей функции.
main.py
@app.route('/')
def hello():
data = {'username': 'Pang', 'site': 'stackru.com'}
return render_template('settings.html', data=data)
app.js
function myFunc(vars) {
return vars
}
settings.html
<html>
<head>
<script type="text/javascript" {{ url_for('static', filename='app.js')}}></script>
<script type="text/javascript">
myVar = myFunc({{vars|tojson}})
</script>
</head>
</html>
Простой способ передачи переменных из представления в колбе в шаблон в файл javascript на простом примере, упомянутом @mauro.
main.py
@app.route('/')
def hello():
data = {'username': 'Pang', 'site': 'stackru.com'}
return render_template('settings.html', data=data)
settings.html
<html>
<head>
<script type="text/javascript">
var username = {{ data.username }}
var site = {{ data.site }}
</script>
<script type="text/javascript" src="app.js"></script>
</head>
</html>
app.js
function myFunc() {
return username + site
}
<script type="text/javascript">
var username ='{{ data.username }}'
var site ='{{ data.site}}'
<script>
Причина в том, что jinja2
должен использоваться для выполнения подстановки, что, по-видимому, из вашего кода не происходит.
Скорее всего, вы служите app.js
как статический файл, что означает, что он никогда не просматривается механизмом шаблонного движка, а просто подается как есть.
Вы можете выполнить то, что вы описываете, служа app.js
с URL, который связан с действием, которое передает содержимое app.js
через колбу render_template
функция, выполняющая jinja2
замены и вся другая информация о настройке, но это означает, jinja2
должен проанализировать весь файл, который может быть дорогим.
Вы можете попытаться передать эти переменные, используя запрос AJAX, на который отвечает действие, которое отправляет те же данные в JSON. Это гораздо более распространенная практика, и она имеет дополнительную ценность, делая эти данные видимыми для других ресурсов.
В этом случае вам фактически не нужно отправлять свои данные с помощью render_template(), потому что ваши данные уже сохранены в вашем сеансе. Данные вашего сеанса уже доступны для шаблона jinja2. (Возможно, вам не удастся импортировать его из app.js. Возможно, вам потребуется явно включить весь код в «Settings.html».)
main.py
@app.route("/mysettings/")
def user_settings():
return render_template('Settings.html')
настройки.html
<script type="text/javascript">
var settings = {
channel: {{ session.project_name }},
publish_key: {{ session.publish_key }},
subscribe_key: {{ session.subscribe_key }}
};
</script>
У меня возникли проблемы при попытке передать списки Python из моего приложения Flask в мой внешний файл Javascript (приложение Python / Flask -> HTML -> Javascript).
Вот как я заставил это работать ...
app.py
from flask import Flask, render_template, request, redirect, json
@app.route("/login", methods=["POST"])
def login():
max = 400
bar_labels = ['JAN', 'FEB', 'MAR', 'APR',
'MAY', 'JUN', 'JUL', 'AUG',
'SEP', 'OCT', 'NOV', 'DEC']
bar_values = [967.67, 1190.89, 1079.75, 1349.19,
2328.91, 2504.28, 2873.83, 4764.87,
4349.29, 6458.30, 9907, 16297]
return render_template('profile.html',
labels=json.dumps(bar_labels),
values=json.dumps(bar_values),
headings=headings, data=data)
profile.html
.
.
.
<script type="text/javascript"> window.max = JSON.parse({{ max | tojson }});
window.values = JSON.parse({{ values | tojson }});
window.labels = JSON.parse({{ labels | tojson }})</script>
<script src="{{url_for('static', filename='main.js')}}"></script>
.
.
.
main.js
window.onload=function(){
console.log(max)
console.log(labels)
console.log(values)
};