30 секунд в день ⏱ Арестуем вместе

JavaScript
30 секунд в день ⏱ Арестуем вместе

Введение

Безопасность, инъекционные атаки, XSS

13-летнюю школьницу арестовали за публикацию кода бесконечного цикла JavaScript.

Эта новость от2019年3月10日Многие студенты смахивали по экрану, чтобы беглым взглядом увидеть следующее сообщение, но не понимали, что это за код и как предотвратить эту проблему. После инцидента, в знак протеста против действий японской полиции и абсурдности криминализации такого поведения, разработчик из Токио Кимиказу Като создал на GitHub приложение под названиемLet's Get Arrested(来逮捕我们)Склад также является происхождением имени этой статьи.

for ( ; ; ) {
window.alert(" ∧_∧ ババババ\n( ・ω・)=つ≡つ\n(っ ≡つ=つ\n`/  )\n(ノΠU\n何回閉じても無駄ですよ~ww\nm9(^Д^)プギャー!!\n byソル (@0_Infinity_)")
}

что

Профессиональное название этого кода для студенток -JavaScript 注入攻击. В ежедневной разработке мы часто получаем различные данные от пользователей, такие как окно поиска, окно комментариев, содержание статьи и так далее. Обычно все по умолчанию считают, что пользователь будет нормально оперировать вводимым текстом, но задумывались ли вы когда-нибудь, что пользователь также может вводить скрипт, тогда, когда страница отображает эти脚本будет казнен.

Этот код для студенток просто используетсяalertа такжеfor(;;)Не особо вредно выводить подсказку в бесконечной петле. ИспользованиеJavaScript 注入攻击Он может даже украсть значения файлов cookie из браузеров других пользователей, что ужасно, если данные содержат конфиденциальную информацию, такую ​​как пароли учетных записей.

Как сделать

Vue.jsОфициальная документация находится наШаблоны > Интерполяция > Необработанный HTMLЕсть следующий отрывок:

Произвольный HTML, отображаемый динамически на вашем сайте, может быть очень опасным, так как легко может привести к XSS-атакам. Пожалуйста, используйте интерполяцию HTML только для надежного контента, а не для контента, предоставленного пользователями.

На самом деле многие фреймворки сейчас помогают нам это сделать, но многие не задумываются почему,Vue.jsВ использовании{{}}Когда грамматика выводит текст, связанные с html теги в<,>,',",&будет соответственно преобразован в&lt;,&gt;,&#39;,&quot;,&amp;чтобы содержимое не отображалосьJavaScript 注入攻击.

Если вы используете фреймворк, который не помогает достичь этой функции, вы можете использовать обычные и приведенные выше правила для достижения преобразования html-гаджетов:

const escapeHTML = str =>
    str.replace(/[&<>'"]/g, tag => ({
        '&': '&amp;',
        '<': '&lt;',
        '>': '&gt;',
        "'": '&#39;',
        '"': '&quot;'
    }[tag] || tag));

Конечно, вот еще небольшой инструмент для восстановления html:

const unescapeHTML = str =>
    str.replace(/&amp;|&lt;|&gt;|&#39;|&quot;/g,tag => ({
        '&amp;': '&',
        '&lt;': '<',
        '&gt;': '>',
        '&#39;': "'",
        '&quot;': '"'
    }[tag] || tag));

В дополнение к обработке выходного сигнала, задний конец также может выполнять преобразование HTML при хранении и вывода данных. Неожиданно обнаружил, что я собираюсь стать хеднищем сейчасXDD?

Расти вместе

В запутанном городе неизбежно идти бок о бок伙伴Давайте расти вместе.

  • Если вы хотите, чтобы статью увидело больше людей, укажите点赞.
  • Если вы хотите мотивировать второго ребенка, вы можете перейти кGithubдать小星星.
  • Если вы хотите больше общаться с Xiaoer, добавьте WeChatm353839115.

微信公众号

Оригинал статьи изPushMeTop