В первой и второй частях этой серии из трех частей мы увидели, как разложить структуру шаблона в приложении на основе Flask с использованием Jinja2 модульным способом и как создавать собственные обработчики контекста, фильтры и макросы в Jinja2.
В этой части мы рассмотрим, как реализовать расширенное форматирование даты и времени на уровне шаблона в Jinja2 с помощью moment.js .
Начиная
Форматирование даты и времени — сложная задача для веб-приложений. Обработка их на уровне Python с использованием библиотеки datetime увеличивает накладные расходы и является довольно сложной, когда речь идет о правильной обработке часовых поясов. Мы должны стандартизировать метки времени в формате UTC, когда они хранятся в базе данных, но тогда метки времени нужно обрабатывать каждый раз, когда они должны быть представлены пользователям по всему миру.
Разумно отложить эту обработку на сторону клиента, то есть на браузер. Браузер всегда знает текущий часовой пояс пользователя и сможет правильно выполнять манипуляции с датой и временем. Кроме того, это снимает необходимые накладные расходы с наших серверов приложений.
Как и любая библиотека JS, Moment.js может быть включен в наше приложение следующим образом. Нам просто нужно поместить файл JS, moment.min.js , в папку static/js . Затем это можно использовать в нашем HTML-файле, добавив следующий оператор вместе с другими библиотеками JS:
|
1
|
<script src=»/static/js/moment.min.js»></script>
|
Основное использование Moment.js показано в следующем коде. Это можно сделать в консоли браузера для JavaScript:
|
1
2
3
4
5
6
|
>>> moment().calendar();
«Today at 9:37 PM»
>>> moment().endOf(‘day’).fromNow();
«in 2 hours»
>>> moment().format(‘LLLL’);
«Wednesday, January 27, 2016 9:38 PM»
|
Чтобы использовать Moment.js в нашем приложении, лучше всего написать оболочку на Python и использовать ее через переменные среды jinja2 . Обратитесь к этому runnable для большего количества фона. Добавьте файл с именем momentjs.py на том же уровне, что и my_app.py .
flask_app / momentjs.py
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
|
from jinja2 import Markup
class momentjs(object):
def __init__(self, timestamp):
self.timestamp = timestamp
# Wrapper to call moment.js method
def render(self, format):
return Markup(«<script>\ndocument.write(moment(\»%s\»).%s);\n</script>» % (self.timestamp.strftime(«%Y-%m-%dT%H:%M:%S»), format))
# Format time
def format(self, fmt):
return self.render(«format(\»%s\»)» % fmt)
def calendar(self):
return self.render(«calendar()»)
def fromNow(self):
return self.render(«fromNow()»)
|
Добавьте следующую строку в flask_app/my_app.py после инициализации app . Это добавит класс momentjs к переменным окружения momentjs .
|
1
2
|
# Set jinja template global
app.jinja_env.globals[‘momentjs’] = momentjs
|
Теперь момент.js можно использовать для форматирования даты и времени в шаблонах следующим образом:
|
1
2
3
4
5
|
<p>Current time: {{ momentjs(timestamp).calendar() }}</p>
<br/>
<p>Time: {{momentjs(timestamp).format(‘YYYY-MM-DD HH:mm:ss’)}}</p>
<br/>
<p>From now: {{momentjs(timestamp).fromNow()}}</p>
|
Вывод
В этом уроке мы рассмотрели основы шаблонизации Jinja2 с точки зрения Flask. Мы начали с самых основ Jinja2 и узнали о лучших методах построения структуры шаблона и использования шаблонов наследования.
Затем мы создали несколько пользовательских контекстных процессоров, фильтров и макросов, которые очень полезны в расширенных шаблонах. В последнем уроке рассказывалось о том, как moment.js можно использовать вместе с Jinja2 для создания очень гибкого и мощного форматирования даты и времени.