一、问题描述
HTML文件里面写了中文然后出现编码报错：UnicodeDecodeError: ‘utf-8‘ codec can‘t decode byte 0xce in position 1587: invalid continuation byte。
二、问题原因
html文件没有设置编码为UTF-8，未设置之前代码如下：
{% extends base_template %} {% load i18n xadmin_tags %} {% block bodyclass %}dashboard{% endblock %} {% block breadcrumbs %}{% endblock %} {% block nav_title %} {% if icon %}<i class="{{icon}}"></i>{%endif%} {{ title }} {% endblock %} {% block nav_toggles %} {% include "xadmin/includes/toggle_menu.html" %} {% if has_add_widget_permission %} <a title="{% trans "Add Widget" %}" href="{{ add_widget_url }}" class="navbar-toggle pull-right"> <i class="fa fa-plus"></i></a> {% endif %} {% endblock %} {% block nav_btns %} {% if has_add_widget_permission %} <a title="{% trans "Add Widget" %}" href="{{ add_widget_url }}" class="btn btn-primary"> <i class="fa fa-plus"></i> <span>{% trans "Add Widget" %}</span></a> {% endif %} {% endblock %} {% block content %} <head> <meta charset="utf-8"> </head> <style> .home .home_data ul li { float: left; width: 298px; height: 92px; text-align: center; line-height: 92px; background-color: white; margin-right: 15px; margin-top: 2px; } ul,li { list-style: none; } .home .home_title { width: 100%; height: 42px; border-bottom:1px solid #e7e7e7; text-align: left; line-height: 42px; padding:0 15px; border-radius:2px 2px 0px 0px; } .home { width: 100%; height: 160px; background-color: #F8F8F8; } .home .home_data { margin-left: -25px; } .home .home_data ul li a:link { text-decoration: none; } </style> <div class="home"> <div class="home_title" >‘我‘</div> <div class="home_data" > <ul> <li> <a href="#"> <p> <cite>Coming soon</cite> </p> </a> </li> <li><a href="#">Coming soon</a></li> <li><a href="#">Coming soon</a></li> <li><a href="#">Coming soon</a></li> <li><a href="#">Coming soon</a></li> </ul> </div> </div> <div class="dashboard row"> {% for c in columns %} <div class="{{ c.0 }} column"> {% for widget in c.1 %} {{ widget.widget|safe }} {% endfor %} </div> {% endfor %} </div> <input type=‘hidden‘ id=‘_portal_key‘ value=‘{{ portal_key }}‘ /> {% endblock %}
三、解决方案
将整个代码放在html中，并设置编码为utf-8即可解决该问题，设置后的代码：
<!DOCTYPE html> {% extends base_template %} {% load i18n xadmin_tags %} <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> {% block bodyclass %}dashboard{% endblock %} {% block breadcrumbs %}{% endblock %} {% block nav_title %} {% if icon %}<i class="{{icon}}"></i>{%endif%} {{ title }} {% endblock %} {% block nav_toggles %} {% include "xadmin/includes/toggle_menu.html" %} {% if has_add_widget_permission %} <a title="{% trans "Add Widget" %}" href="{{ add_widget_url }}" class="navbar-toggle pull-right"> <i class="fa fa-plus"></i></a> {% endif %} {% endblock %} {% block nav_btns %} {% if has_add_widget_permission %} <a title="{% trans "Add Widget" %}" href="{{ add_widget_url }}" class="btn btn-primary"> <i class="fa fa-plus"></i> <span>{% trans "Add Widget" %}</span></a> {% endif %} {% endblock %} {% block content %} <style> .home .home_data ul li { float: left; width: 298px; height: 92px; text-align: center; line-height: 92px; background-color: white; margin-right: 15px; margin-top: 2px; } ul,li { list-style: none; } .home .home_title { width: 100%; height: 42px; border-bottom:1px solid #e7e7e7; text-align: left; line-height: 42px; padding:0 15px; border-radius:2px 2px 0px 0px; } .home { width: 100%; height: 160px; background-color: #F8F8F8; } .home .home_data { margin-left: -25px; } .home .home_data ul li a:link { text-decoration: none; } </style> <div class="home"> <div class="home_title" >数据统计</div> <div class="home_data" > <ul> <li> <a href="#"> <p> <cite>用户数</cite> </p> </a> </li> <li><a href="#">任务数</a></li> <li><a href="#">BUG数</a></li> <li><a href="#">代码行数</a></li> <li><a href="#">接口数</a></li> </ul> </div> </div> <div class="dashboard row"> {% for c in columns %} <div class="{{ c.0 }} column"> {% for widget in c.1 %} {{ widget.widget|safe }} {% endfor %} </div> {% endfor %} </div> <input type=‘hidden‘ id=‘_portal_key‘ value=‘{{ portal_key }}‘ /> {% endblock %} </body> </html>