How to use the `autoescape` tag to control the automatic escaping of HTML content in AnQiCMS templates?

It is crucial to understand and effectively control the escaping behavior of HTML content during AnQiCMS template development.This concerns not only the correct display of page content, but also has a direct impact on the security of the website, especially in preventing cross-site scripting (XSS) attacks.autoescapeTags play a core role.

Understand the necessity of HTML content escaping

In dynamic websites, we often need to output content from databases or other sources.If this content includes HTML tags or JavaScript code (such as user submitted comments, article content, etc.), and is directly rendered to the browser without processing, it may pose security risks.<script>Tags to execute arbitrary JavaScript code, steal user information, or destroy the page.

The essence of HTML content escaping is to convert special characters in HTML (such as</>/&/"/') to their corresponding HTML entities (such as</>/&/"/')。Thus, the browser will not parse these special characters as HTML structure or executable scripts, but will display them as plain text.

AnQiCMS's template system follows the principle of security first by default, and will automatically escape HTML for all content passed through{{ 变量 }}This means that even if variables contain<script>alert('xss');</script>Such code will also be displayed on the page<script>alert('xss');</script>Thus, it effectively avoids potential XSS attacks.

autoescapeThe use of tags

Although automatic escaping is the default and recommended behavior, there may be certain specific scenarios where we may need to temporarily disable it, such as when you are sure that the content you are outputting is completely trustworthy and strictly reviewed HTML code. In such cases, you can useautoescapeThe tag is used to finely control the escaping behavior.

autoescapeThe tag can turn on or off the automatic HTML escaping within the template code block. It is followed by{% autoescape on %}turning on,{% autoescape off %}turning off, and it needs to be followed by{% endautoescape %}end.

1. Disable automatic escaping ({% autoescape off %})

When you need to ensure that all variables within a code block are output directly as HTML without escaping, you can useautoescape off.

{# 默认情况下，以下代码会被转义 #}
<p>默认输出: {{ "<p>这是一个<strong>安全的</strong>段落。</p>" }}</p>
{# 实际页面输出: <p>默认输出: &lt;p&gt;这是一个&lt;strong&gt;安全的&lt;/strong&gt;段落。&lt;/p&gt;</p> #}

{% autoescape off %}
{# 在此块内，自动转义被禁用 #}
<p>禁用转义输出: {{ "<p>这是一个<strong>不转义的</strong>段落。</p>" }}</p>
{# 实际页面输出: <p>禁用转义输出: <p>这是一个<strong>不转义的</strong>段落。</p></p> #}
{% endautoescape %}

<p>块外再次默认输出: {{ "<p>又是一个<strong>安全的</strong>段落。</p>" }}</p>
{# 实际页面输出: <p>块外再次默认输出: &lt;p&gt;又是一个&lt;strong&gt;安全的&lt;/strong&gt;段落。&lt;/p&gt;</p> #}

Please note that disabling automatic escaping poses a security risk, please make sure that all the content within this code block is completely trusted and verified.

2. Enforce automatic escaping ({% autoescape on %})

autoescape onThe tag is used to force HTML escaping within its code block, even if escaping may be disabled in the external environment or parent template.This helps to ensure that the code in a specific area remains secure.

{% autoescape off %}
    {# 外部环境禁用转义 #}
    <p>外部禁用转义：{{ "<b>Hello World!</b>" }}</p> {# 输出: <b>Hello World!</b> #}

    {% autoescape on %}
        {# 在此块内，强制开启转义 #}
        <p>内部强制转义：{{ "<b>Hello World!</b>" }}</p> {# 输出: &lt;b&gt;Hello World!&lt;/b&gt; #}
    {% endautoescape %}

    <p>回到外部禁用转义：{{ "<b>Hello Again!</b>" }}</p> {# 输出: <b>Hello Again!</b> #}
{% endautoescape %}

withsafeCollaboration of the filter

exceptautoescapeTags, AnQiCMS also providessafeA filter used to mark the content of a single variable as 'safe', indicating to the template engine not to HTML-escape it.

safeThe usage of the filter is very simple: add it after the variable that needs to be output|safe.

{% set trusted_html_content = "<h2>这是后台编辑的<i>可信</i>HTML标题</h2>" %}
{% set user_input_comment = "<p>用户评论：<script>alert('危险！');</script></p>" %}

<p>原始输出 (默认转义):</p>
{{ trusted_html_content }}
{{ user_input_comment }}

<p>使用 `safe` 过滤器输出 (不转义):</p>
{{ trusted_html_content|safe }}

<p>即使使用 `safe`，但如果内容本身不安全，后果自负:</p>
{{ user_input_comment|safe }}

autoescapewith the tag andsafeThe difference between filters:

• Scope of action: autoescapeThe tag controls a Code blockThe escape behavior inside it takes effect on the output of all variables.safeThe filter only acts ona single variableoutput.
• Flexibility: safeFilters provide finer control