Как работает браузер с поисковой системой

Обновлено: 07.07.2024

Для того, чтобы найти ту или иную информацию в интернете, мы пользуемся поисковыми системами. Но откуда поисковик все знает?

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

Сайт попадает в поисковую систему двумя способами: если найдет новый сайт по ссылке с других или же владелец сам добавляет свой ресурс в поисковик через специальный личный кабинет.

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

1. Поисковый робот

Также его называют «краулер» (Crawler — ползающее насекомое). Приходит на сайт, переходит по страницам и загружает информацию к себе на сервера.

Работа его похожа на работу паука, который ползает по паутине — в этом случае, он переходит по ссылкам внутри сайта и загружает к себе тот контент, который содержится на странице.

Такой робот буквально «живет» на сайтах. Как только поисковому счетчику (Метрика от Яндекса, аналитика от Google или же браузеру со встроенным поиском) станет известно о новой странице, робот тут же приходит на сайт, чтобы получить новую информацию. Все что просканировано, попадает уже к следующему роботу — индексатору.

2. Робот индексатор

Самая сложная часть поисковой системы, которая анализирует страницы, который нашел краулер и создает по ним индекс для поиска, а самое главное определяет порядок ранжирования того или иного сайта.

Ранжирование, если простыми словами объяснять, является местом в выдаче по определенному поисковому запросу, оно вычисляется для каждой страницы исходя из нескольких сотен факторов ранжирования, а также сравнивается с другими сайтами-конкурентами.

На ранжирование сайта и (или) конкретной страницы может влиять: уникальность текста, скорость работы сайта, качество контента, цитируемость сайта, поведение посетителя и еще много много различных факторов. Данные факторы подталкивают владельцу сайта к развитию и улучшению своего проекта.

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

3. Сам поисковик

Который обеспечивает выдачу результатов поиска исходя из запроса пользователя, учитывая язык запросов и различные параметры — тип устройства (смартфон или компьютер), геолокацию и так называемый «пузырь фильтров». Например, если вы посещали ранее какой-либо сайт, то поисковик может вам помочь найти его быстрее.

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

Стоит понимать, что поисковая система не может 100% гарантировать индексацию сайта и информации, а еще она обязана подчиняться закону и удалять ссылки, которые противоречат законодательству.

Просто объяснил? Думаю да.

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

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

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

Chrome и lynx

Браузер — это движок рендеринга. Его работа заключается в том, чтобы загрузить веб-страницу и представить её в понятном для человека виде.

Хоть это и почти преступное упрощение, но пока это все, что нам нужно знать на данный момент.

Пользователь вводит адрес в строке ввода браузера.
Браузер загружает «документ» по этому URL и отображает его.

Например, lynx — это легкий текстовый браузер, работающий из командной строки. В основе lynx лежат те же самые принципы, которые вы найдете в любых других «мейнстримных» браузерах. Пользователь вводит веб-адрес (URL), браузер скачивает документ и отображает его — единственное отличие состоит в том, что lynx использует не движок графического рендеринга, а текстовый интерфейс, благодаря которому такие сайты, как Google, выглядят так:

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

Что делает браузер?

Короче говоря, работа браузера в основном состоит из

Разрешение DNS

Давайте разберем запрос построчно:

Воу, на этот раз довольно много информации, которую нужно переварить. Сервер сообщает нам, что запрос был выполнен успешно (200 OK) и добавляет к ответу несколько заголовков, из которых например, можно узнать, какой именно сервер обработал наш запрос (Server: gws), какова политика X-XSS-Protection этого ответа и так далее и тому подобное.

Рендеринг

Последним по счёту, но не последним по значению идет процесс рендеринга. Насколько хорош браузер, если единственное, что он покажет пользователю, это список забавных символов?

В теле ответа сервер включает представление запрашиваемого документа в соответствии с заголовком Content-Type. В нашем случае тип содержимого был установлен на text/html, поэтому мы ожидаем HTML-разметку в ответе — и именно ее мы и находим в теле документа.

Это как раз тот момент, где браузер действительно проявляет свои способности. Он считывает и анализирует HTML-код, загружает дополнительные ресурсы, включенные в разметку (например, там могут быть указаны для подгрузки JavaScript-файлы или CSS-документы) и представляет их пользователю как можно скорее.

Еще раз, конечным результатом должно стать то, что доступно для восприятия среднестатистического Васи.

Если вам нужно более детально объяснение того, что действительно происходит, когда мы нажимаем клавишу ввода в адресной строке браузера, я бы предложил прочитать статью «Что происходит, когда…», очень дотошную попытку объяснить механизмы, лежащие в основе этого процесса.

Вендоры

4 самых популярных браузера принадлежат разным вендорам:

Chrome от Google
Firefox от Mozilla
Сафари от Apple
Edge от Microsoft

W3C является краеугольным камнем разработки стандартов, но браузеры нередко разрабатывают свои собственные функции, которые в конечном итоге превращаются в веб-стандарты, и безопасность тут не является исключением.

Например, в Chrome 51 были введены файлы cookie SameSite — функция, которая позволила веб-приложениям избавиться от определенного типа уязвимости, известной как CSRF (подробнее об этом позже). Другие производители решили, что это хорошая идея, и последовали ее примеру, что привело к тому, что подход SameSite стал веб-стандартом: на данный момент Safari является единственным крупным браузером без поддержки файлов cookie SameSite.

Это говорит нам о двух вещах:

Похоже, что Safari недостаточно заботится о безопасности своих пользователей (шучу: файлы cookie SameSite будут доступны в Safari 12, который, возможно, уже был выпущен к моменту прочтения этой статьи)
исправление уязвимости в одном браузере не означает, что все ваши пользователи в безопасности

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

В нашем случае, если мы решим, что будем нейтрализовывать атаки CSRF только с помощью файлов cookie SameSite, мы должны знать, что мы подвергаем риску наших пользователей Safari. И наши пользователи тоже должны это знать.

И последнее, но не менее важное: вы должны помнить, что вы можете решить, поддерживать ли версию браузера или нет: поддержка каждой версии браузера будет непрактичной (вспомните хпро Internet Explorer 6). Несмотря на это, уверенная поддержка нескольких последних версий основных браузеров — как правило, хорошее решение. Однако, если вы не планируете предоставлять защиту на какой-то определенной платформе, очень желательно, чтобы ваши пользователи об этом знали.

Совет для профи: вы никогда не должны поощрять своих пользователей использовать устаревшие браузеры или активно поддерживать их. Даже если вы приняли все необходимые меры предосторожности, другие веб-разработчики этого не сделали. Поощряйте пользователей использовать последнюю поддерживаемую версию одного из основных браузеров.

Вендор или стандартный баг?

Тот факт, что обычный пользователь обращается к нашему приложению благодаря помощи стороннего клиентского программного обеспечения (браузера), добавляет еще один уровень, усложняющий путь к удобному и безопасному просмотру веб-страниц: сам браузер может быть источником уязвимости безопасности.

Вендоры, как правило, предоставляют вознаграждения (также известные как баг-баунти) исследователям безопасности, которые могут искать уязвимость в самом браузере. Эти ошибки связаны не с вашим веб-приложением, а с тем, как браузер самостоятельно управляет безопасностью.

Например, программа поощрений Chrome позволяет исследователям безопасности обращаться к команде безопасности Chrome, чтобы сообщить об обнаруженных ими уязвимостях. Если факт наличия уязвимости подтвердится, будет выпущено исправление и, как правило, опубликовано уведомление о безопасности, а исследователь получит (обычно финансовое) вознаграждение от программы.

Такие компании, как Google, инвестируют достаточно солидный капитал в свои программы Bug Bounty, поскольку это позволяет компаниям привлекать множество исследователей, обещая им финансовую выгоду в случае обнаружения ими каких-либо проблем с тестируемым программным обеспечением.

В программе Bug Bounty выигрывают все: поставщику удается повысить безопасность своего программного обеспечения, а исследователям платят за их находки. Мы обсудим эти программы позже, так как я считаю, что инициативы Bug Bounty заслуживают отдельного раздела в ландшафте аспектов безопасности.

Джейк Арчибальд (Jake Archibald) — разработчик-"адвокат" в Google, который обнаружил уязвимость, затрагивающую несколько браузеров. Он задокументировал свои усилия по ее обнаружению, процесс обращения к различным вендорам, затронутым уязвимостью, и реакцию представителей вендоров в интересном блог-посте, который я рекомендую вам прочитать.

Браузер для разработчиков

В приведенном выше примере мы запросили документ по адресу localhost:8080/, и локальный сервер успешно на него ответил.

Примерно та же информация доступна в популярных браузерах посредством их DevTools.

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

в ходе перевода, я старался вычленять из статьи ПОНЯТИЯ, т.е. текстовые единицы которые несут специальный (технический) смысл. В переводе эти понятия выделены по особенному — во первых понятия предваряются символом звёздочки, во-вторых в них вместо пробела используется тире. Например: *браузер-процесс, *сайто-изоляция. При переводе понятий, приоритет отдавался не красоте перевода, а желанию выделить, акцентировать, то что мы имеем дело с ПОНЯТИЕМ, а не с фигурой речи.
также, некоторые слова переведены неверно с точки зрения русского языка, в жаргонном стиле, например пайплайн, продакшен. У "технарей" такой перевод не вызовет затруднений, у остальных читателей прошу прощения.

Рассмотрим простой пример использования веб-браузера: вы вводите URL в браузере, затем браузер извлекает данные из интернета и отображает страницу. В этой заметке мы остановимся на той части, где пользователь запрашивает сайт, а браузер готовится к отображению страницы — также известной как навигация.

Как мы описывали в первой части, все, что находится вне вкладки, обрабатывается *браузер-процессом. *Браузер-процесс имеет такие потоки, как *UI-поток (UI thread), который рисует кнопки и поля ввода браузера, *сетевой-поток (network thread), который имеет дело с сетевым стеком для получения данных из Интернета, *поток-хранения (storage thread), который контролирует доступ к файлам и многие другие. Когда вы вводите URL в адресную строку, ваш ввод обрабатывается *UI-потоком *браузер-процесса.

Рисунок 1: Интерфейс браузера вверху, схема *браузер-процесса с *UI-потоком, *сетевым-потоком и *потоком-хранения внутри внизу

= Шаг 1. Обработка ввода

Рисунок 1-bis: *UI-поток спрашивает, является ли входной запрос поисковым или URL-адресом

= Шаг 2. Старт навигации

Когда пользователь нажимает Enter, *UI-поток инициирует сетевой вызов для получения контента сайта. В углу вкладки отображается анимация загрузки, и *сетевой-поток проходит через соответствующие протоколы, такие как DNS поиск и создание TLS соединения для запроса.

= Шаг 3. Чтение ответа

Как только тело ответа (payload, полезная нагрузка) начинает поступать, *сетевой-поток при необходимости смотрит на первые несколько байт данных. В заголовке ответа 'Content-Type' должно быть указано, какой это тип данных, но так как он может отсутствовать или быть неправильным, то в данном случае выполняется прослушивание MIME-типа. Это "сложное дело", прокомментировано в исходном коде. Вы можете прочитать эти комментарии исходного кода, чтобы посмотреть, как разные браузеры обращаются с парами 'content-type/payload'

Рисунок 3: Заголовок ответа, содержащий Content-Type и полезную нагрузку, которая является фактическими данными

Если ответ является HTML-файлом, то следующим шагом будет передача данных в *рендер-процесс, но если это zip-файл или какой-либо другой файл, то это означает, что это запрос на загрузку, поэтому он будет передан в менеджер загрузок.

Рисунок 4: *Сетевой-поток спрашивает, являются ли данные ответа HTML данными с безопасного сайта

Здесь также выполняется проверка SafeBrowsing. Если домен и ответные данные, похоже совпадают с известным вредоносным сайтом, то *сетевой-поток предупреждает показом предупреждающей страницы. Кроме того, выполняется проверка Cross Origin Read Blocking (CORB), чтобы убедиться, что конфиденциальные межсайтовые данные не попадают в *рендер-процесс.

= Шаг 3. Поиск *рендер-процесса

После того, как все проверки завершены и *сетевой-поток уверен, что браузер может перейти к запрашиваемому сайту, *сетевой-поток сообщает *UI-потоку, что данные готовы. Затем *UI-поток ищет *рендер-процесс для продолжения рендеринга веб-страницы.

Рисунок 5: *Сетевой-поток, просящий *UI-поток предоставить *рендер-процесс

Поскольку сетевой запрос на получение обратного ответа может занять несколько сотен миллисекунд, применяется оптимизация для ускорения этого процесса. Когда *UI-поток посылает URL запрос в *сетевой-поток на шаге 2, он уже знает, к какому сайту он обращается. *UI-поток пытается проактивно найти или запустить *рендер-процесс параллельно с сетевым запросом. Таким образом, если все пойдет как ожидалось, *рендер-процесс уже будет находиться в режиме ожидания, к моменту когда *сетевой-поток получил данные. Этот резервный процесс может быть не использован, если навигация будет перенаправлена на другой сайт, в этом случае может потребоваться другой процесс.

= Шаг 4. Реализация перехода

Теперь, когда данные и *рендер-процесс готовы, выполняется IPC запрос из *браузер-процесса в *рендер-процесс для реализации перехода. Также передается стрим данных, для того чтобы *рендер-процесс мог продолжать получать HTML-данные. Как только *браузер-процесс получает подтверждение того, что в *рендер-процессе всё выполнено, навигация завершается и начинается фаза загрузки документа.

Рисунок 6: IPC между *браузер-процессом и *рендер-процессом, запрос на рендеринг страницы

= Дополнительный шаг. Завершение начальной загрузки

После реализации навигации *рендер-процесс продолжает загрузку ресурсов и рендеринг страницы. Подробнее о том, что происходит на этом этапе, мы расскажем в следующем посте. Как только *рендер-процесс "финиширует" рендеринг, он посылает IPC запрос обратно в *браузер-процесс (это происходит после того, как все события загрузки сработали на всех фреймах страницы и закончили своё выполнение). На этом этапе *UI-поток останавливает анимацию индикатора загрузки страницы.

Я пишу "финиширует" в кавычках, потому что JavaScript на стороне клиента все равно может загрузить дополнительные ресурсы и вывести новые представления после этого момента.

Рисунок 7: IPC-запрос от *рендер-процесса к *браузер-процессу для уведомления о том, что страница "загружена".

Простая навигация была завершена! Но что случится, если пользователь снова поместит другой URL в адресную строку? Что ж, процесс браузера пройдет те же самые этапы, что и при переходе на другой сайт. Но перед тем, как это сделать, ему нужно проверить для текущего отрисованного сайта, волнует ли его событие beforeunload.

beforeunload может создавать высплыавющее предупреждение "Покинуть этот сайт?" при попытке навигации наружу или закрытии вкладки. Все внутренние вкладки, включая ваш JavaScript код, обрабатывается *рендер-процессом, поэтому *браузер-процесс должен свериться с текущим *рендер-процессом, когда приходит новый навигационный запрос.

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

Рисунок 8: IPC-запрос от *браузер-процесса к *рендер-процессу, говорящий ему, что он собирается перейти на другой сайт

Если навигация была инициирована из *рендер-процесса (например, пользователь нажал на ссылку или JavaScript на стороне клиента запустил window.location = "https://newsite.com" ), то *рендер-процесс сначала проверяет обработчики beforeunload . Затем он проходит через тот же процесс, что и процесс запуска навигации. Единственное отличие состоит в том, что запрос на навигацию запускается от *рендер-процесса к *браузер-процессу.

Когда новая навигация осуществляется на сайт, отличный от текущего, вызывается отдельный *рендер-процесс для обработки новой навигации, в то время как текущий *рендер-процесс продолжается для обработки таких событий, как выгрузка. Для получения более подробной информации смотрите обзор состояния жизненного цикла страницы и то, как вы можете подключаться к событиям с помощью Page Lifecycle API.

Рисунок 9: 2 IPC-запроса от *браузер-процесса к новому *рендер-процессу, говорящему отрисовать страницу и говорящему старому *рендер-процессу выгрузить страницу

Одним из недавних изменений в процессе навигации является введение service worker. *Сервис-воркер — это способ написания сетевого прокси в коде вашего приложения; позволяющий веб-разработчикам иметь больше контроля над тем, что кэшировать локально а когда получать новые данные из сети. Если *сервис-воркер настроен на загрузку страницы из кэша, то нет необходимости запрашивать данные из сети.

Важно помнить, что *сервис-воркер — это JavaScript-код, который запускается в *рендер-процессе. Но когда приходит запрос на навигацию, как *браузер-процессу узнать что у сайта есть *сервис-воркер?

Рисунок 10: Сетевой-поток в процессе просмотра браузером скоупа \сервис-воркера

Рисунок 11: *UI-поток в *браузер-процессе запускает *рендер-процесс для работы с *сервис-воркерами; поток *сервис-воркера в *рендер-процессе затем запрашивает данные из сети

Рисунок 12: *UI-поток в *браузер-процессе, запускающий *рендер-процесс для обработки *сервис-воркера с параллельным запуском сетевого запроса

Со временем возникло большое недоразумение по поводу этих двух терминов, , которые используются почти каждый день или почти каждый раз, когда мы используем Интернет либо через компьютер или мобильный телефон Важно отметить, что эти два инструмента необходимы для правильного пользования Интернетом. Однако оба они совершенно разные, несмотря на то, что их путают друг с другом.

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

Два термина, которые используются во всем мире и которые большинство пользователей часто путают и часто дают одинаковое значение обоим. Вот почему здесь мы собираемся показать вам, что это такое и какова функция каждого из них , а также основные различия между ними. Таким образом, вы сможете правильно идентифицировать каждого из них во время входа в Интернет со своего компьютера или смартфона.

Что такое интернет-браузер? Типы и примеры

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

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

В этом смысле, чтобы иметь возможность пользоваться этим браузером на компьютерах или смартфонах , необходимо установить программу или приложение, которое позволяет вам перемещаться по Интернету . где на рынок пришли разные приложения, позволяющие просматривать.

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

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

Итак, мы покажем вам некоторые из доступных на рынке браузеров и другие, которые уже прекратили свое существование:

Microsfot Edge (ранее Internet Explorer)
Mozilla Firefox
Google Chrome
Safari
Opera
Maxthon
Flock
поэтапный отказ
Avant
Netscape (первый браузер)

Что такое поисковая система или браузер? Типы и примеры

Когда мы говорим о поисковой системе, мы просто ссылаемся на поисковую систему . Это делается с помощью компьютерной системы, хранящейся на веб-серверах, которые работают благодаря веб-пауку или пауку. Другими словами, они также считаются руководством для пользователей . , который доставит их куда угодно.

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

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

Этот инструмент является неотъемлемой частью Интернета, , поскольку без них пребывание в сети было бы совершенно хаотичным, поскольку это заставило бы пользователей точно знать веб-страницы, которые они хотят посетить, что невозможно. Таким образом, здесь мы покажем вам некоторые из поисковых систем, которые вы найдете в Интернете и которые вы можете использовать быстро и легко.

Помните, что сегодня в сети их насчитывается миллионы, вот список некоторых доступных и других, которые прекратили свое существование:

Google
Yahoo
Ask
Baidu
Yandex
Dogpile
Duckduckgo
Ecosia
Exalead
Factbites
Bing
AltaVista
Terra
Прямые хиты
Biwe
Go
Tarantula

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

Основные различия между функциями браузера и поисковой системой в Интернете

Как только вы знаете определение каждого из них, вы можете начать искать различия между ними, многие из которых очень очевидны. И, как мы уже говорили, каждый из них выполняет совершенно другую роль . Таким образом, здесь мы покажем, каковы основные различия между веб-браузером и поисковой системой.

Читайте также: