Эта статья синхронизирована в личном блогеshymean.comвверх, добро пожаловать, чтобы следовать
Недавно я разбирался с требованием, связанным с referer, и обнаружил, что в нем еще есть небольшой дорвей. Поэтому в этой статье я разобрал соответствующие точки знаний реферера, в основном связанные с анти-пиявкой картинок и тем, как обойти анти-пиявочные ограничения.
Ссылаться на:
использовать реферер
Referer
Это поле в заголовке HTTP-запроса, который содержит адрес исходной страницы текущей страницы запроса. Через данное поле мы можем обнаружить, откуда приходит посетитель.
Итак, что именно делает реферер?
Интерактивная оптимизация
При взаимодействии с некоторыми веб-приложениями в правом верхнем углу будет предоставлена кнопка «Назад», чтобы облегчить пользователю возврат на предыдущую страницу.
Его реализация, как правило, проще
<a href="javascript: history.back();"></a>
Проблема, скрытая в этом методе обработки, заключается в том, что если пользователь заходит непосредственно с других порталов, таких как обмен ссылками, он не может вернуться, нажав эту кнопку.
Поэтому, когда кнопка нажала, мы можем судитьdocument.referrer
Если существует ли он для оптимизации взаимодействия: если он существует, вернитесь на предыдущую страницу; если он не существует, вернитесь непосредственно на домашнюю страницу.
Следует отметить, что выше написаноreferer
, а в DOM, используяreferrer
, это связано с тем, что ссылка в заголовке запроса является опечаткой из-за исторических причин, и она была исправлена в спецификации DOM, что приводит к проблеме, что текущее написание не единообразно~
противоугонная цепь
Когда пользователь посещает веб-страницу, реферером является URL-адрес предыдущей веб-страницы; если это изображение, он обычно ссылается на веб-страницу, на которой находится изображение. Когда браузер отправляет запрос на сервер, реферер автоматически переносится в заголовок HTTP-запроса.
HTML-страница часто содержит множество ресурсов, эти ресурсы через теги, такие какscript
,img
,link
Такие формы вложены в HTML-документы, и для полной страницы часто требуется отправить несколько HTTP-запросов для загрузки ресурсов, прежде чем она сможет нормально отображаться. Поскольку сам HTML не ограничивает источник вложенных ресурсов, основанный на этом механизме,горячая ссылкастал средством.
Далее о хотлинкингеЭнциклопедия Байдуопределение
Хотлинкинг относится к контенту, который поставщик услуг не предоставляет услуги сам по себе, обходя другие выгодные интерфейсы конечного пользователя (например, рекламные объявления) с помощью технических средств и напрямую предоставляя контент услуг других поставщиков услуг конечным пользователям на своем собственном веб-сайте для обмана. Просмотры конечными пользователями и рейтинг кликов. Бенефициары не предоставляют или предоставляют очень мало ресурсов, а настоящие поставщики услуг ничего не получают.
Например: Веб-сайт А хранит на сервере свои собственные статические ресурсы, такие как изображения или видео. Веб-сайт Б использует изображения или видеоресурсы веб-сайта А и размещает их на своем веб-сайте без разрешения А. Поскольку ресурсы сервера стоят денег, сайт B крадет пространство и трафик сайта A, а A не получает никаких преимуществ, но несет плату за использование ресурсов. Поведение Б, присваивающего ресурсы А и помещающего их на свой собственный веб-сайт, является хотлинкингом.
Противоугонная цепочка обычно состоит из следующих методов
- Регулярно меняйте имена файлов или пути
- Через реферер ограничьте источник справочной страницы ресурса
- Аутентификация через файлы cookie, сеансы и т. д.
- Добавляйте водяные знаки и другие изображения
Здесь мы в основном ориентируемся на принцип реферальной противоугонной цепочки. Ниже приведена конфигурация nginx для защиты от пиявок.
location ~* \.(gif|jpg|png)$ {
valid_referers none blocked *.phptest.com;
if ($invalid_referer) {
return 403;
}
}
Этот метод добавляется в сегмент сервера или местоположения:valid_referers
. Эта директива основана на заголовке реферера как$invalid_referer
Назначение переменной, ее значение равно 0 или 1. еслиvalid_referers
В списке нет значения заголовка Referer,$invalid_referer
будет установлено значение 1.
Эта команда поддерживаетnone
а такжеblocked
,
- Среди них ни один не означает пустой источник, то есть прямой доступ, например открытие файла прямо в браузере,
- заблокированный означает маршрут, отмеченный брандмауэром, *..com означает все поддомены.
С помощью реферера мы можем судить об источнике запроса, чтобы определить, нормально ли сервер возвращает запрошенный ресурс, чтобы достичь цели управления запросом.
Следует отметить, что в некоторых случаях, даже если пользователь получает доступ к веб-странице или изображению в обычном режиме, реферер не будет перенесен, например, при непосредственном вводе URL-адреса ресурса в адресной строке браузера или при открытии страницы в новом окне браузера. и т.п. Такой доступ является нормальным.Если некоторые списки рефереров из белого списка принудительно обращаются к ресурсам, эта часть обычных пользователей может быть случайно ранена, поэтому некоторое обнаружение хотлинков позволяет заголовку реферера быть пустым для прохождения теста.
Что касается случая, если обращение с прятком, вы можете обойти ограничения претенциозного сечения сайта, давайте посмотрим, как добиться скрытых функций референтора.
скрыть реферера
Ссылаться на
- html отключить реферер
- Написать сервис анти-лича изображений со схемой Referer и внедрить «взлом» на веб-странице
Мы можем скрыть реферера при использовании некоторых ограничений против пиявки сайта, чтобы реферер был пустым, или мы просто не хотим, чтобы сервер знал источник доступа.
referrerPolicy
Раньше, когда браузер запрашивал ресурсы, он решал, добавлять ли Referrer в соответствии со своими собственными правилами по умолчанию. Позже W3C опубликовалReferrer-Policy
Проект, который позволяет разработчикам гибко управлять реферальной стратегией своего собственного веб-сайта. В основном включают следующие стратегии
- no-referrer: ни при каких обстоятельствах не отправлять информацию о Referrer;
- no-referrer-when-downgrade (по умолчанию): поведение браузера по умолчанию, когда политика не указана.
- origin: в любом случае в качестве реферера отправляется только источник файла
- origin-when-cross-origin: для запросов с одним и тем же источником полный URL-адрес будет отправлен в качестве ссылочного адреса, но для запросов с разными источниками будет отправлен только источник файла.
- То же самое происхождение: отправьте запрос на адрес ссылок гомологичный, но не отправлен на немологистую справочную информацию о запросе информации.
Выше перечислены только некоторые необязательные стратегии.MDN文档
.
Поэтому мы можем вручную указатьno-referrer
скрыть реферера
<!-- phptest2.com是我本地的一个测试域名, 下同 -->
<img src="http://phptest2.com/upload/1.png" width="200" referrerPolicy="no-referrer" alt="">
Или при создании объекта изображения указатьreferrerPolicy
Стратегия
const img = new Image()
img.referrerPolicy = 'no-referrer'
На этом этапе откройте инструмент разработчика, чтобы увидеть, что запрос на изображение больше не несет соответствующий реферер. Резюме, как правило, есть следующие способы установки политики Referer:
- Через поле Referrer-Policy в заголовке ответа http
- Через метатег имя является реферером
- Через атрибут referrerpolicy элементов a, area, img, iframe, link.
- Через атрибут rel=noreferrer элементов a, area и link.
Следует отметить, что в настоящее времяreferrerPolicy
Все еще на стадии проекта предложения, совместимость браузера не особенно хороша.
Изменить заголовки заголовка при запросе
Объект XMLHttpRequest предоставляетsetRequestHeader
Методы добавления или изменения полей для заголовков запроса. Можем ли мы вручную изменить
А как насчет поля реферера?
// 通过ajax下载图片
function loadImage(uri) {
return new Promise(resolve => {
let xhr = new XMLHttpRequest();
xhr.responseType = "blob";
xhr.onload = function() {
resolve(xhr.response);
};
xhr.open("GET", uri, true);
xhr.setRequestHeader("Referer", ""); // 通过setRequestHeader设置header不会生效
xhr.send();
});
}
// 将下载下来的二进制大对象数据转换成base64,然后展示在页面上
function handleBlob(blob) {
let reader = new FileReader();
reader.onload = function(evt) {
img.src = evt.target.result;
};
reader.readAsDataURL(blob);
}
const imgSrc = "http://phptest2.com/upload/1.png";
loadImage(imgSrc).then(blob => {
handleBlob(blob);
});
Когда приведенный выше код запустится, вы обнаружите, что консоль выводит сообщение об ошибке.
Refused to set unsafe header "Referer"
может видетьsetRequestHeader
настраиватьreferer
Заголовок ответа недействителен, это связано с тем, что браузеры не могут вручную установить некоторые зарезервированные поля из соображений безопасности, к сожалениюReferer
Просто один из зарезервированных полей, более ссылка на список информацииForbidden header name.
Поэтому, когда установка реферера через AJAX не удалась, мы можем загрузить изображение из браузера другим способом, например, попробовавFetch
Шерстяная ткань?
Fetch
Это совершенно новый интерфейс, предоставляемый браузером для доступа и управления частью конвейера HTTP.referrerPolicy
, поэтому его также можно использовать для работы с реферером.
function fetchImage(url) {
return fetch(url, {
headers: {
// "Referer": "", // 这里设置无效
},
method: "GET",
mode: "cors",
redirect: "follow",
referrer: "" // 将referer置空,此处写成no-referrer貌似会把路径替换成 host + 'no-referrer'字符串形式
}).then(response => response.blob());
}
loadImage(imgSrc).then(blob => {
handleBlob(blob);
});
Установив параметр конфигурацииredirect
Если бит пуст, вы можете видеть, что у этого запроса нет реферера.
Использовать iframe
Ниже приведен способ скрыть реферера через iframe, весь процесс немного волшебный. Примерно реализовано следующим образом
const putNoRefererImage = (() => {
let iframe
/*
src: 图片地址
wrap:需要加载图片的容器
*/
return function (src, wrap) {
if (iframe) {
iframe.remove()
}
let url = new URL(src);
let frameid = 'frameimg' + Math.random();
window.img = `<img id="tmpImg" width=400 src="${url}" alt="图片加载失败,请稍后再试"/> `;
// 构造一个iframe
iframe = document.createElement('iframe')
iframe.id = frameid
iframe.src = "javascript:parent.img;" // 通过内联的javascript,设置iframe的src
// 校正iframe的尺寸,完整展示图片
iframe.onload = function () {
var img = iframe.contentDocument.getElementById("tmpImg")
if (img) {
iframe.height = img.height + 'px'
iframe.width = img.width + 'px'
}
}
iframe.width = 200
iframe.height = 200
iframe.scrolling = "no"
iframe.frameBorder = "0"
wrap.appendChild(iframe)
}
})();
putNoRefererImage(imgSrc, document.body);
Как видно, запустив код, функция скрытия реферера также может быть реализована таким образом, поэтому она не поддерживается какreferrerPolicy
альтернатива.
В некоторых сценариях, которые не поддерживают встроенный запуск javascript, это решение также невозможно, например, в расширениях Chrome, из-заcontent_security_policy
, использование встроенного JavaScript сообщит об ошибке
Refused to execute JavaScript URL because it violates the following Content Security Policy directive: "script-src 'self' blob: filesystem: chrome-extension-resource:". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution.
резюме
В этой статье кратко изложена роль рефереров и настройка анти-личных ссылок с использованием рефереров. Так как конфигурация анти-лича на некоторых сайтах позволяет указать реферер пустым, вы можете использовать это, чтобы обойти анти-лич, скрыв реферер.
Затем вводятся несколько реализаций внешнего скрытого реферера.С технической точки зрения,referrerPolicy
является почти идеальным выбором и из-за ограничений совместимости может бытьfetch
илиiframe
и т. д. для достижения.
Поняв, что такое анти-пиявка и как ее обойти, мы сможем лучше обеспечить безопасность ресурсов нашего сайта. Помимо использования хотлинкинга реферера, мы также можем избежать хотлинкинга, приняв аутентификацию личности и регулярно изменяя пути к ресурсам. Наконец, чтобы закончить старую поговорку:
Когда вы смотрите в бездну, бездна тоже смотрит в вас.