将自定义降价转换为HTML？

Question

挑战：我们的用户可以访问“ contentEditable” DIV，其中JS库在其中插入HTML。 这就是我们认为HTML应该显示在contentEditable中的方式：

<span class="stylish-blue-button">

   <span style="display:none;">[data-user="12345" data-userId="678910"]</span>

     John Smith

   <span style="display:none;">[/]</span>

</span>

...Blablabla some other text...

我们将此HTML移交给PHP，在其中执行strip_tags（）。 这应该给我们：

[data-user="12345" data-userId="678910"]John Smith[/] ...Blablabla some other text...

问题：在页面上呈现文本时，我们想知道是否存在一种安全/可靠的方法来将上述自定义降价转换为（在将其交给Handlebars.js之前）：

<span class="stylish-blue-button" data-user="12345" data-userId="678910">John Smith</span> ...Blablabla some other text...

原因：这可以确保我们安全处理了用户生成的内容，同时将用户生成的markdown保留在contentEditable“ pretty”（“ stylish-blue-button”类）中。

如果您有什么建议可以简化整个流程，我们欢迎您更改markdown的格式。

非常感谢！

Answer 1

您可以使用以下正则表达式：

$string = '<span class="stylish-blue-button">

   <span style="display:none;">[data-user="12345" data-userId="678910"]</span>

     John Smith

   <span style="display:none;">[/]</span>

</span>

...Blablabla some other text...';
echo preg_replace('~\[(data-user="\d+")\h+(data-userId="\d+")\]\s*(.+?)\s*\[/\]\s*(.*)~s', '<span $1 $2>$3</span>$4', trim(strip_tags($string)));

这是一个regex101演示，准确解释了该regex在做什么。 如果您有特定问题，请询问。

输出：

<span data-user="12345" data-userId="678910">John Smith</span>...Blablabla some other text...

一些正则表达式快速注意事项。

*是一个量词，表示零个或多个前一个字符。
+是一个量词，表示一个或多个（又是必需的）前一个字符。
\\s是一个空格字符。
\\h是一个水平空间。
. 是任何单个字符。
\\d是单个数字（0-9）。
()正在按照找到顺序将其捕获到$1 ， $2等中的捕获组。

再次查看该正则表达式有一个简短的注释：此\\[/\\]读为文字[/] 。 反斜杠转义了[] ，否则将创建一个字符类（这意味着只允许/字符）。

多实例：

$string = '<span class="stylish-blue-button">

   <span style="display:none;">[data-user="12345" data-userId="678910"]</span>

     John Smith

   <span style="display:none;">[/]</span>

</span>

...Blablabla some other text...
<span class="stylish-blue-button">

   <span style="display:none;">[data-user="12345" data-userId="678910"]</span>

     John Smith

   <span style="display:none;">[/]</span>

</span>

...Blablabla some other text...
<span class="stylish-blue-button">

   <span style="display:none;">[data-user="12345" data-userId="678910"]</span>

     John Smith

   <span style="display:none;">[/]</span>

</span>

...Blablabla some other text...';
echo preg_replace('~\s*\[(data-user="\d+")\h+(data-userId="\d+")\]\s*(.+?)\s*\[/\]\s*~s', '<span $1 $2>$3</span>', trim(strip_tags($string)));

输出：

<span data-user="12345" data-userId="678910">John Smith</span>...Blablabla some other text...<span data-user="12345" data-userId="678910">John Smith</span>...Blablabla some other text...<span data-user="12345" data-userId="678910">John Smith</span>...Blablabla some other text...

对于较宽松的ID，只需将\\d+更改为[a-zA-Z0-9 ]+ 。

所以：

preg_replace('~\s*\[(data-user="\d+")\h+(data-userId="[a-zA-Z0-9 ]+")\]\s*(.+?)\s*\[/\]\s*~s'