Flask從入門到精通之自定義錯誤界面


  如果你在瀏覽器的地址欄中輸入了不可用的路由,那么會顯示一個狀態碼為404 的錯誤頁面。現在這個錯誤頁面太簡陋、平庸,而且樣式和使用了Bootstrap 的頁面不一致。

  像常規路由一樣,Flask 允許程序使用基於模板的自定義錯誤頁面。最常見的錯誤代碼有兩個:404,客戶端請求未知頁面或路由時顯示;500,有未處理的異常時顯示。為這兩個錯誤代碼指定自定義處理程序的方式如下:

@app.errorhandler(404)
def page_not_found(e):
    return render_template('404.html'),404

@app.errorhandler(500)
def internal_server_error(e):
    return render_template('500.html'),500

  和視圖函數一樣,錯誤處理程序也會返回響應。它們還返回與該錯誤對應的數字狀態碼。錯誤處理程序中引用的模板也需要編寫。這些模板應該和常規頁面使用相同的布局,因此要有一個導航條和顯示錯誤消息的頁面頭部。編寫這些模板最直觀的方法是復制templates/user.html,分別創建templates/404.html 和templates/500.html,然后把這兩個文件中的頁面頭部元素改為相應的錯誤消息。但這種方法會帶來很多重復勞動。

  Jinja2 的模板繼承機制可以幫助我們解決這一問題。Flask-Bootstrap 提供了一個具有頁面基本布局的基模板,同樣,程序可以定義一個具有更完整頁面布局的基模板,其中包含導航條,而頁面內容則可留到衍生模板中定義。一下實例 展示了templates/base.html 的內容,這是一個繼承自bootstrap/base.html 的新模板,其中定義了導航條。這個模板本身也可作為其他模板的基模板,例如templates/user.html、templates/404.html 和templates/500.html

{%extends "bootstrap/base.html"%}

{%block title %}Flask{% endblock %}

{%block navbar %}
<div class="navbar navbar-inverse" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle"
            data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="/">Flasky</a>
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="/">Home</a></li>
            </ul>
        </div>
    </div>
</div>

{% endblock %}
{% block content %}
<div class="container">
    <div class="page-header">
        {% block page_content %}{% endblock %}
    </div>
</div>
{% endblock %}

  這個模板的content 塊中只有一個<div> 容器,其中包含了一個名為page_content 的新的空塊,塊中的內容由衍生模板定義。現在,程序使用的模板繼承自這個模板,而不直接繼承自Flask-Bootstrap 的基模板。通過繼承templates/base.html 模板編寫自定義的404 錯誤頁面很簡單

{% extends "base.html" %}
{% block title %}Flasky - Page Not Found{% endblock %}
{% block page_content %}
<div class="page-header">
    <h1>Not Found</h1>
</div>
{% endblock %}

  500錯誤界面定義如下:  

{% extends "base.html" %}
{% block title %}Flasky - internal server error{% endblock %}
{% block page_content %}
<div class="page-header">
    <h1>internal server error</h1>
</div>
{% endblock %}

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM