sanic支持jinja2模板
如果想使用flash和get_flashed_messages，首先需要設置會話。
當前，app和request被掛載到jinja模板中，因此可以直接在模板中使用它們。
而且，從版本0.3.0開始，enable_async默認為True。如果您需要同步功能，請使用jinja.render_sync，jinja.render_string_sync
Python3.5不支持新的異步語法，所以0.5.0禁用異步，抱歉。
BUG：請求不應該設置為全局環境，因此您需要使用request ['flash']而不是jinja.flash，並且需要傳request去渲染來使用get_flashed_messages。
#!/usr/bin/env python3 # -*- coding: utf-8 -*- from sanic import Sanic from sanic_session import InMemorySessionInterface from sanic_jinja2 import SanicJinja2 app = Sanic() jinja = SanicJinja2(app) ＃把app傳進去實例化jinja對象 session = InMemorySessionInterface(cookie_name=app.name, prefix=app.name) @app.middleware('request') async def add_session_to_request(request): # before each request initialize a session # using the client's request await session.open(request) @app.middleware('response') async def save_session(request, response): # after each request save the session, # pass the response to set client cookies await session.save(request, response) @app.route('/') async def index(request): request['flash']('success message', 'success') request['flash']('info message', 'info') request['flash']('warning message', 'warning') request['flash']('error message', 'error') request['session']['user'] = 'session user' return jinja.render('index.html', request, greetings='Hello, sanic!') #可以直接渲染模板 if __name__ == '__main__': app.run(host='0.0.0.0', port=8000, debug=True) #debug＝True的時候，會顯示sanic的圖標
相應的 html:
<!DOCTYPE html> <html> <head> <!-- Standard Meta --> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> <!-- Site Properties --> <title>{% block title %}{% endblock %} | Website title</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.7/semantic.min.js" integrity="sha256-flVaeawsBV96vCHiLmXn03IRJym7+ZfcLVvUWONCas8=" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.7/semantic.min.css" integrity="sha256-wT6CFc7EKRuf7uyVfi+MQNHUzojuHN2pSw0YWFt2K5E=" crossorigin="anonymous" /> <style> body { background-color: #FFFFFF; } .ui.menu .item img.logo { margin-right: 1.5em; } .main.container { margin-top: 7em; } .wireframe { margin-top: 2em; } .ui.footer.segment { margin: 5em 0em 0em; padding: 5em 0em; } </style> </head> <body> <div class="ui fixed inverted menu"> <div class="ui container"> <a href="#" class="header item"> Project Name </a> <a href="#" class="item">Home</a> <div class="ui simple dropdown item"> Dropdown <i class="dropdown icon"></i> <div class="menu"> <a class="item" href="#">Link Item</a> <a class="item" href="#">Link Item</a> <div class="divider"></div> <div class="header">Header Item</div> <div class="item"> <i class="dropdown icon"></i> Sub Menu <div class="menu"> <a class="item" href="#">Link Item</a> <a class="item" href="#">Link Item</a> </div> </div> <a class="item" href="#">Link Item</a> </div> </div> </div> </div> <div class="ui main container"> {% for cat, msg in get_flashed_messages(with_categories=true) %} <div class="ui {{ cat }} message"><p>{{ msg }}</p></div> {% endfor %} <h1 class="ui header">Semantic UI Fixed Template</h1> <p>This is a basic fixed menu template using fixed size containers.</p> <p>A text container is used for the main container, which is useful for single column layouts</p> <h1 class="ui header">{{ greetings }}</h1> <h3>Session in templates: {{ session.user }}</h3> </div> <div class="ui inverted vertical footer segment"> <div class="ui center aligned container"> <div class="ui stackable inverted divided grid"> <div class="three wide column"> <h4 class="ui inverted header">Group 1</h4> <div class="ui inverted link list"> <a href="#" class="item">Link One</a> <a href="#" class="item">Link Two</a> <a href="#" class="item">Link Three</a> <a href="#" class="item">Link Four</a> </div> </div> <div class="three wide column"> <h4 class="ui inverted header">Group 2</h4> <div class="ui inverted link list"> <a href="#" class="item">Link One</a> <a href="#" class="item">Link Two</a> <a href="#" class="item">Link Three</a> <a href="#" class="item">Link Four</a> </div> </div> <div class="three wide column"> <h4 class="ui inverted header">Group 3</h4> <div class="ui inverted link list"> <a href="#" class="item">Link One</a> <a href="#" class="item">Link Two</a> <a href="#" class="item">Link Three</a> <a href="#" class="item">Link Four</a> </div> </div> <div class="seven wide column"> <h4 class="ui inverted header">Footer Header</h4> <p>Extra space for a call to action inside the footer that could help re-engage users.</p> </div> </div> <div class="ui inverted section divider"></div> <div class="ui horizontal inverted small divided link list"> <a class="item" href="#">Site Map</a> <a class="item" href="#">Contact Us</a> <a class="item" href="#">Terms and Conditions</a> <a class="item" href="#">Privacy Policy</a> </div> </div> </div> <script> $('.message .close') .on('click', function() { $(this) .closest('.message') .transition('fade') ; }) ; </script> </body> </html>