Недавно столкнулся с проблемой, когда пользователям было разрешено изменять src тэг элементов страницы.

Всё в больших размерах, взаимодействие с веб-сервисами становится более гибким и расширенным. На некоторых проектах доступно редактирование/добавление html элементов на страницу. Такие элементы, как:
<img> <script> <audio> <video>
и другие, могут наследовать аттрибут src, который указывает на адрес файла. Так же и css стили могут наследовать url.

Проблема кроется в том, что пользователи могут добавить невалидный src, либо «обрушить» https:// протокол сайта, указав http:// в аттрибуте src. Так же пользователи могут указать ссылку вовсе не на ожидаемое аудио или картинку, а на свой сервер, который будет логировать ip адреса клиентов сайта. «Анонимность?», — До свидания.

Итак, рассмотрим парочку практических примеров недобросовестного применения src:

  • «Обрушение» https:
    Если ресурс работает с протоколом https, то это можно легко нарушить, например, добавив изображение с http протоколом
    <img src="http://foo.com/image.jpg" />

    Интересно, даже habr сбросил https и показывает предупредительный значок

    image

    Мелочь, но лучше бы был протокол https без подобных предупреждений.
  • «Логгинг айпи»:
    Суть в том, что в src указываем адрес на свой сайт, который выводит ip адреса, с которых идут запросы. А запросы идти будут от клиентов сайта, когда мы разместим в src свою ссылку.

    Простейшее приложение на Node.js фреймворке — Express

    const express = require("express");
    const app = express();
    
    app.get("/", (req, res) => {
      console.log(req.headers["x-forwarded-for"]);
      res.send(req.headers["x-forwarded-for"]);
    });
    
    app.listen(80);
    

    Стартуем, проксируем через ngrok (для windows ngrok.exe http 80) и ставим ссылку в src. Всё, теперь ip каждого клиента, попавшего на страницу с этим элементом будет «пойман». Я считаю, что это частично деанонимизирует клиентов и такое нужно предотвращать.
  • XSS уязвимости:
    Эта тема обсуждалась много где, писать много от себя не вижу смысла, предлагаю почитать статьи, но приведу один простейший пример

    <img src="javascript:alert('javascript код выполнился');">

Чтобы избежать подобных уязвимостей, не рекомендую позволять пользователям указывать ссылки на изображения, файлы. Есть несколько способов этого избежать:

  1. Тщательно фильтровать ввод пользователя
  2. Избежать принятия от пользователя ссылок на сторонние источники, а принимать только файлы и данные, а в свою очередь размещать их на своём сервере, либо cdn

HTML src
CSS url
XSS