清理字符串以避免 php 生成的特殊字符中断 javascript

Question

我有一个 php 'search' 脚本，它在 MySQL 数据库中查找请求的数据并打印 table。 table 的每一行都可以通过单击图标进行修改或删除。当您单击这些图标之一时，将调用显示显示的 javascript 函数。

这是一段代码：

      while ($row = mysqli_fetch_row($result)) {
            // Define $id
            $id = $row[7];

            // Sanitize output
            $user = htmlentities($row[0]);
            $name = htmlentities($row[1]);
            $surnames = htmlentities($row[2]);
            $email = htmlentities($row[3]);
            $role = htmlentities($row[4]);
            $access = htmlentities($row[5]);
            $center = htmlentities($row[6]);

            $message .= "<tr>
                    <td>" . $user . "</td>" .
                    "<td>" . $name . "</td>" .
                    "<td>" . $surnames . "</td>" .
                    "<td>" . $email . "</td>" .
                    "<td>" . $role . "</td>" .
                    "<td>" . $access . "</td>" .
                    "<td>" . $center . "</td>" .
                    "<td>" .
                        "<input type='image' src='../resources/edit.png' id='edit_" . $user . "' class='edit' onclick=edit_user(\"$user\",\"$name\",\"$surnames\",'$email','$role','$access',\"$center\",'$id') title='Editar'></button>" . 
                    "</td>" .
                    "<td>" .
                        "<input type='image' src='../resources/delete.png' id='delete_" . $user . "' class='delete' onclick=delete_user(\"$user\",'$role') title='Eliminar'></button>" . 
                    "</td>
                </tr>";
        }

这只是我生成的 table 的一部分。毕竟，我用 json_encode 对 table 进行编码并回显它。回声由 ajax 函数捕获，该函数对其进行解码 (JSON.parse) 并将其放入 div.

table 已正确呈现，并且所有内容都可以正常使用普通字符，但我发现如果我有引号、斜杠和其他有意义的字符，我可能会遇到一些问题。字符串在 table 中显示正确，因此 php 没有问题，但生成的 javascript 不适用于某些字符串。

比如我介绍一下：

</b>5'"

或：

<b>5'6"</b><br><div

作为用户，当我单击编辑或删除图标时，javascript 控制台出现一些错误：

未捕获的语法错误：无效的正则表达式：缺少/ home.php:1 Uncaught SyntaxError: missing ) after argument list

未捕获的语法错误：参数列表后缺少 )

未捕获的语法错误：意外的令牌非法

我尝试了 addslash、replace、htmlentites、htmlspecialchars 的几种组合...但我找不到正确的组合。

为了避免任何问题，正确的处理方法是什么？

谢谢。

编辑：

我已经对此进行了探索，它似乎有效：

在php中我使用了这个函数：

function javascript_escape($str) {
$new_str = '';

$str_len = strlen($str);
for($i = 0; $i < $str_len; $i++) {
    $new_str .= '\x' . dechex(ord(substr($str, $i, 1)));
}

return $new_str;
}

然后我使用类似

的东西

$('<textarea />').html(user).text()

在 javascript 中解码字符串。

这对 XSS 攻击安全吗？

Answer 1

首先，创建数组的 HTML-安全 JSON 字符串并修改您的代码以使用数据属性，如下所示：

      while ($row = mysqli_fetch_row($result)) {
            // Define $id
            $id = $row[7];

            // Sanitize output
            $user = htmlentities($row[0]);
            $name = htmlentities($row[1]);
            $surnames = htmlentities($row[2]);
            $email = htmlentities($row[3]);
            $role = htmlentities($row[4]);
            $access = htmlentities($row[5]);
            $center = htmlentities($row[6]);

            $json_str_edit = htmlentities(json_encode(array($row[0], $row[1], $row[2], $row[3], $row[4], $row[5], $row[6], $id)));
            $json_str_delete = htmlentities(json_encode(array($row[0], $row[4])));

            $message .= "<tr>
                    <td>" . $user . "</td>" .
                    "<td>" . $name . "</td>" .
                    "<td>" . $surnames . "</td>" .
                    "<td>" . $email . "</td>" .
                    "<td>" . $role . "</td>" .
                    "<td>" . $access . "</td>" .
                    "<td>" . $center . "</td>" .
                    "<td>" .
                        "<input type=\"image\" src=\"../resources/edit.png\" id=\"edit_$user\" class=\"edit\" data-user=\"$json_str_edit\" title=\"Editar\"></button>" . 
                    "</td>" .
                    "<td>" .
                        "<input type=\"image\" src=\"../resources/delete.png\" id=\"delete_$user\" class=\"delete\" data-user=\"$json_str_delete\" title=\"Eliminar\"></button>" . 
                    "</td>
                </tr>";
        }

然后创建一个事件侦听器以在 JS 中捕获关联的点击事件，如下所示：

function edit_user(user, name, surnames, email, role, access, center, id) {
    // `this` will refer to the html element involved in the event

    }

function delete_user(user, role) {
    // `this` will refer to the html element involved in the event

    }

document.addEventListener('click', function(event) {
    if(event.target.hasAttribute('data-user')) {
        switch(event.target.className) {
            case 'edit':
                edit_user.apply(event.target, JSON.parse(event.target.dataset.user));
                break;
            case 'delete':
                delete_user.apply(event.target, JSON.parse(event.target.dataset.user));
                break;
            }
        }
    }, false);

或者从 addEventListener 方法，你可以简单地将这个 onclick 事件监听器直接添加到元素，就像这样（我真的认为在这种情况下这不重要）：

onclick="edit_user.apply(this, JSON.parse(this.dataset.user))"

仅供参考，更常见的做法是在脚本中使用单引号以避免必须转义双引号字符。让事情变得更干净、更标准化。

清理字符串以避免 php 生成的特殊字符中断 javascript

Sanitize strings to avoid special characters break javascript generated by php

javascript

php

sanitization

special-characters