Остановить HTML во введенном тексте

Question 1

Привет всем, я понимаю, что это то, что возникает часто, и я просмотрел множество разных сообщений и ответов, чтобы попытаться найти свой собственный ответ, прежде чем утруждать себя публикацией здесь, однако я действительно изо всех сил пытаюсь заставить работать следующее.

Я в процессе создания комнаты чата, если вы введете текст в текстовое поле, затем щелкните идентификатор ключа ввода 30, тогда сообщение будет отправлено (это нормальная функция). Однако, если вы должны ввести html в текстовое поле, тогда HTML будет иметь место при отправке сообщения. Это вызывает большие проблемы в развитии моего проекта. Есть много сообщений, в которых говорится, что использовать ...

htmlspecialchars();

Я обнаружил, что еще до того, как сообщения достигли моего файла PHP, HTML, введенный в текстовое поле, уже имел место при нажатии клавиши ввода. Теперь я пытаюсь найти что-то, что я могу сделать в разделе javascript, где я могу останавливать текст по мере его ввода и вносить изменения в текстовое поле, поэтому, если бы я должен был ввести следующий ключ ...

<   //which has the key ID of 60

Затем он заменит его в текстовом поле на / <или даже постоянно проверяет и заменяет символы html в текстовом поле, когда выполняется функция нажатия клавиши, а затем заменяет их. Это будет означать, что когда я затем вынимаю текст из текстового поля, он уже будет декодирован, и в сообщении не будет тегов html, которые затем остановят их действие в моей комнате чата.

Что-то вроде следующего кода ...

$("#messagearea").keydown(function{
    var replacementtext = this.replace() // html characters I'm not that familiar with        this function but I believe it is what I need to use.
    messagearea = replacementtext
}

Что-то вроде приведенного выше позволит мне проверять вводимые символы каждый раз, когда происходит нажатие клавиши, и предотвращать искажение html на моем сайте. Если бы кто-нибудь мог мне помочь в том, как это должно быть написано, или есть ли лучший способ сделать это? Это было бы большое спасибо.

javascript php jquery html

0

Nate 14 Окт 2013 в 15:52

Вам необходимо заменить их отображенными сущностями HTML. См .: w3schools.com/html/html_entities.asp

–

Akshay Khandelwal

14 Окт 2013 в 15:54

1

Как насчет this.replace(/<(?:.|\n)*?>/gm, '');

–

Amal Murali

14 Окт 2013 в 15:56

Answer

Ваша проблема настолько распространена, что отличные ребята из jQuery уже решили ее за вас.

var encodedText = $("#message-box").text();

Взгляните на документацию jQuery для более подробного обсуждения текстовой функции.

Хорошо, позвольте мне расширить свой ответ из-за комментариев Дэйва. Ультра простой пример того, как достичь того, что, я думаю, имел в виду Дейв.

Ваш HTML:

<!doctype html>
<html>
<head>
  <title>Chat</title>
  <style>.invalid{border:red}</style>
</head>
<body>
  <div id="chat">
    <p><span class="user">Foo:</span> Bar</p>
  </div>
  <form id="message-form" action="/chat.php" method="post">
    <textarea id="message" name="message" placeholder="Enter chat message ..." autofocus></textarea>
    <input type="submit" value="Send">
  </form>

Ваш jQuery:

$(function () {
  var $chat = $('#chat');
  var $messageForm = $('#message-form');
  $messageForm.$message = $('#message');
  $('#message-form').submit(function (e) {
    e.preventDefault();
    this.originalMessage = this.$message.val();
    this.$message.val('').prop('disabled', true);
    $.post('/chat.php', { json: true, message: this.originalMessage }, function (response) {
      if (response.error) {
        $messageForm.$message
          .val($messageForm.originalMessage)
          .addClass('invalid')
        ;
      }
      else {
        $chat.append('<p><span class="user">' + response.name + ':</span> ' + response.message + '</p>');
      }
      $messageForm.$message.prop('disabled', false).focus();
    }, 'json');
  });
});

Ваш PHP:

<?php

$json = filter_input(INPUT_POST, "json", FILTER_VALIDATE_BOOLEAN);

if (($message = filter_input(INPUT_POST, "message", FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW|FILTER_REQUIRE_SCALAR)) !== false) {
  session_start();
  $return = [
    "name" => $_SESSION["name"],
    "message" => htmlspecialchars($message, ENT_QUOTES|ENT_HTML5),
  ];
}
else {
  $return = [ "error" => true ];
}

if ($json === true) {
  header("content-type: application/json");
  exit(json_encode($return));
}

var_dump($return);

?>

2

Fleshgrinder 15 Окт 2013 в 01:44

1

Если, конечно, человек не просматривает страницы с отключенным javascript. гораздо лучше просто striptags () или что-то подобное в PHP.

–

Dave

14 Окт 2013 в 16:31

1

Определенно не проблема, потому что, если бы это была обычная форма с текстовым полем, любая отправка достигла бы PHP без изменений.

–

Fleshgrinder

14 Окт 2013 в 22:40

1

Именно поэтому ваша попытка проверки ввода на стороне клиента не сработает, и он вернется к исходной точке с тегами html, нарушающими его приложение. Их нужно анализировать через PHP каждый раз, когда кто-либо, использующий проверку javascript для чего-либо, кроме «заполнено ли это поле», должен быть удален, его слишком легко обойти.

–

Dave

15 Окт 2013 в 01:00

1

Вы, конечно, совершенно правы, я только что ответил, поскольку понял вопрос (как кодировать специальные символы HTML в jQuery). Я расширил свой ответ, чтобы он соответствовал вашим требованиям.

–

Fleshgrinder

15 Окт 2013 в 01:37

1

Намного лучше, хотя лично я по-прежнему предпочитаю просто удалить html все вместе и разрешить только такие вещи, как код bb (или настраиваемую пометку некоторого описания), таким образом мы устраняем все возможности для таких вещей, как XSS-атаки

–

Dave

15 Окт 2013 в 11:03

Question 2

Ваша проблема настолько распространена, что отличные ребята из jQuery уже решили ее за вас.

var encodedText = $("#message-box").text();

Взгляните на документацию jQuery для более подробного обсуждения текстовой функции.

Хорошо, позвольте мне расширить свой ответ из-за комментариев Дэйва. Ультра простой пример того, как достичь того, что, я думаю, имел в виду Дейв.

Ваш HTML:

<!doctype html>
<html>
<head>
  <title>Chat</title>
  <style>.invalid{border:red}</style>
</head>
<body>
  <div id="chat">
    <p><span class="user">Foo:</span> Bar</p>
  </div>
  <form id="message-form" action="/chat.php" method="post">
    <textarea id="message" name="message" placeholder="Enter chat message ..." autofocus></textarea>
    <input type="submit" value="Send">
  </form>

Ваш jQuery:

$(function () {
  var $chat = $('#chat');
  var $messageForm = $('#message-form');
  $messageForm.$message = $('#message');
  $('#message-form').submit(function (e) {
    e.preventDefault();
    this.originalMessage = this.$message.val();
    this.$message.val('').prop('disabled', true);
    $.post('/chat.php', { json: true, message: this.originalMessage }, function (response) {
      if (response.error) {
        $messageForm.$message
          .val($messageForm.originalMessage)
          .addClass('invalid')
        ;
      }
      else {
        $chat.append('<p><span class="user">' + response.name + ':</span> ' + response.message + '</p>');
      }
      $messageForm.$message.prop('disabled', false).focus();
    }, 'json');
  });
});

Ваш PHP:

<?php

$json = filter_input(INPUT_POST, "json", FILTER_VALIDATE_BOOLEAN);

if (($message = filter_input(INPUT_POST, "message", FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW|FILTER_REQUIRE_SCALAR)) !== false) {
  session_start();
  $return = [
    "name" => $_SESSION["name"],
    "message" => htmlspecialchars($message, ENT_QUOTES|ENT_HTML5),
  ];
}
else {
  $return = [ "error" => true ];
}

if ($json === true) {
  header("content-type: application/json");
  exit(json_encode($return));
}

var_dump($return);

?>

2

Fleshgrinder 15 Окт 2013 в 01:44

1

Если, конечно, человек не просматривает страницы с отключенным javascript. гораздо лучше просто striptags () или что-то подобное в PHP.

–

Dave

14 Окт 2013 в 16:31

1

Определенно не проблема, потому что, если бы это была обычная форма с текстовым полем, любая отправка достигла бы PHP без изменений.

–

Fleshgrinder

14 Окт 2013 в 22:40

1

Именно поэтому ваша попытка проверки ввода на стороне клиента не сработает, и он вернется к исходной точке с тегами html, нарушающими его приложение. Их нужно анализировать через PHP каждый раз, когда кто-либо, использующий проверку javascript для чего-либо, кроме «заполнено ли это поле», должен быть удален, его слишком легко обойти.

–

Dave

15 Окт 2013 в 01:00

1

Вы, конечно, совершенно правы, я только что ответил, поскольку понял вопрос (как кодировать специальные символы HTML в jQuery). Я расширил свой ответ, чтобы он соответствовал вашим требованиям.

–

Fleshgrinder

15 Окт 2013 в 01:37

1

Намного лучше, хотя лично я по-прежнему предпочитаю просто удалить html все вместе и разрешить только такие вещи, как код bb (или настраиваемую пометку некоторого описания), таким образом мы устраняем все возможности для таких вещей, как XSS-атаки

–

Dave

15 Окт 2013 в 11:03

Остановить HTML во введенном тексте

1 ответ

Похожие вопросы

Новые вопросы

javascript