Golang html/template库自动裁剪空格换行致ASCII艺术显示异常

安全阿岳

2026-8-27

问题根因

这个空白丢失的问题和Go标准库html/template的空白裁剪功能一点关系都没有，本质是浏览器默认的HTML渲染规则导致的：
按照HTML原生规范，普通文档流里的所有连续空白字符——不管是半角空格、制表符、换行还是回车——不管连了多少个，渲染的时候都会被折叠成1个半角空格显示，只有预格式化场景下才会原封不动保留所有空白格式。
你现在可以直接在显示异常的页面右键点「查看页面源代码」，搜你生成的ASCII内容，就能看到你传进去的所有空格、换行都完完整整躺在输出的HTML里，根本没被模板删掉，只是浏览器渲染的时候给折叠了。
你之前了解的{{-/-}}模板空白裁剪语法，只会删模板标签相邻的、你写在模板文件本身里的静态空白，绝对碰不到你通过Conv函数生成、动态传入模板的字符串内容，完全不是这个问题的诱因。

解决方法

两个方案都能完美解决显示问题，优先选第一个就行：

方案1：用预格式化标签<pre>包裹ASCII内容
<pre>是HTML原生的预格式化标签，默认会保留内部所有空白格式，而且默认加载等宽字体，刚好适配ASCII艺术的显示需求，把模板里原来的p标签替换掉就行：
```
<pre style="color:blueviolet;">{{range .Text}}{{.}}{{"\n"}}{{end}}</pre>
```
方案2：给现有标签加white-spaceCSS属性
要是不想换标签，给原来的<p>标签加个white-space样式属性，就能实现和pre标签一样的空白保留效果：
```
<p style="color:blueviolet; font-family:monospace; white-space: pre-wrap;">{{range .Text}}{{.}}<br>{{end}}</p>
```
这里pre-wrap值会在保留所有空白的基础上，允许内容超出容器宽度时自动折行，移动端显示体验更好；不需要自动折行的话把值换成pre就可以。