将自定义标记转换为HTML


Convert custom markdown to HTML?

挑战:我们的用户可以访问一个"contentEditable"div, JS库会在其中插入HTML。以下是我们认为HTML应该在contentitable:

中显示的方式
<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,在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...

为什么:这保证了我们安全地处理了用户生成的内容,同时将用户生成的标记保留在contenttedable "pretty" (" style -blue-button"类)中。

如果您有任何建议使整个过程更简单,我们愿意改变我们的降价格式。

非常感谢!

您可以像这样使用正则表达式:

$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'