The `safe` filter in Anqi CMS template, when and why to use it to cancel the default escaping of HTML content?

Mastering AnQi CMS template insafeFilter: Unlocking the correct rendering and security boundaries of HTML content

AnQiCMS as an enterprise-level content management system based on Go language, has adopted the syntax similar to Django template engine in template design, which provides great flexibility for content display.When building website content, we often need to display the information edited on the back-end on the front-end page.However, during this process, a mechanism named 'HTML escaping' quietly plays a crucial role in ensuring website security.safeThe filter used to manage its behavior is a skill that every AnQiCMS user, especially when dealing with rich text content, needs to master.

Understanding HTML Escaping: The Safe Default Barrier

What is HTML escaping, simply put, is to convert some special characters in HTML (such as</>/&/"/') is converted to their corresponding HTML entities (such as</>/&/"/'）。AnQi CMS template engine defaults to escaping all data output from the backend to the frontend. Why do this? The core reason is thatPrevent Cross-Site Scripting (XSS).

Imagine if a malicious user entered a piece of<script>alert('你被攻击了');</script>Such code, while the system did not escape it, this code will be executed in the browsers of other users accessing the page.This could lead to serious consequences such as user information being stolen and page content being tampered with.AnQiCMS adheres to the philosophy of 'making all websites in the world safe', the default HTML escaping is exactly to treat these potential malicious scripts as ordinary text, so that they can be displayed safely in the browser instead of being executed.This is like putting on a 'protection suit' for the data, ensuring the safety of the content output.

safeFilter: The Bridge of Trust and Presentation

However, in actual content operation, we often encounter such situations: we hope that the HTML content input in the background editor can be displayed as it is on the front end, such as a beautifully typeset article, an introduction containing pictures, or a table with special style design.In this case, the default HTML escaping mechanism may actually do more harm than good, displaying our carefully formatted HTML code as raw text strings, causing layout chaos on the page.

At this time,safeThe filter comes into play.Its role is to explicitly tell the AnQiCMS template engine: 'I know this content is safe, please do not HTML encode it, output it directly as HTML code.'|safeWe can cancel the default escaping behavior, allowing the browser to correctly parse and render the HTML content we expect.

For example, in the AnQi CMS template, when we want to display the full text of an article, if the content of the text is edited by a rich text editor, we usually use it like this:

<div>
    {%- archiveDetail articleContent with name="Content" %}
    {{articleContent|safe}}
</div>

Here{{articleContent|safe}}EnsuredarticleContentHTML code contained in variables such as<b>/<img>/<p>etc