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

В скриптах Дуси есть специальное действие «HTTP запрос», с помощью которого можно получать данные с любого сайта, а потом делать с ними что-то полезное.

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

В статье я покажу на примере одного из скриптов, как использовать CSS селекторы и возможности Дуси по работе с массивами данных.

Что такое CSS селекторы

piece of html code printed on paper

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

CSS — это каскадные стили. С их помощью описывается, как ваша страничка должна выглядеть. То есть где какой шрифт, какие отступы и так далее.

CSS селектор — это выражение, которое говорит парсеру страницы, какие тэги нужно «вытащить» со страницы. Например, селектор div.my-class вытащит из страницы все тэги div, у которых есть CSS класс my-class.

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

Как это использовать в скриптах

Действие «HTTP запрос» умеет делать запросы на любой URL. А потом сохранить полученный контент в нескольких переменных. К примеру $http_content будет хранить весь ответ — то есть нашу HTML страничку.

Также, это действие позволяет написать один CSS селектор, ,который автоматически вытащит текст нужного тэга в переменную $http_html_text. Будет вытащен текст именно из первого найденного элемента.

Но с версии 1.5.3 можно вытаскивать тексты нескольких тэгов, а также их атрибутов. Как это делается — посмотрим на примере. 

Пример

logo_otzovik.com

Есть такой прекрасный сайт otzovik.com — на нем можно написать и найти отзывы на что-угодно; Давайте посмотрим, как можно создать очень полезный скрипт, который по запросу будет находить на этом сайте страничку с отзывами нужного нам товара (или даже не товара) и сразу открывать браузер на этой страничке.

С чего начать

Для начала нужно посмотреть, как вообще работает сайт.

результаты поиска отзывов

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

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

Какой URL

Смотрим в адресную сточку нашего браузера и видим URL странички

http://otzovik.com/?search_text=айпад

Это значит, что нам просто нужно в нашем скрипте создать действие «HTTP запрос» и написать URL вида

http://otzovik.com/?search_text=$Text

Что будем парсить

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

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

Для этого будем использовать CSS селекторы.

Изучаем страничку

В браузере Chrome кликнем правой кнопкой мыши на первом товаре в списке и выберем «Просмотреть код». Сразу откроется панель с кодом на нужном нам HTML тэге.Chrome

Как видно. нужная нам ссылка идет самой первой под тэгом td, у которого есть CSS класс nprods. Там же (под тэгом h3) находится полное название товара.

Пишем CSS селекторы

Вытащим название товара сразу в переменную $http_html_text. Для этого в настройках действия «HTTP запрос» пропишем CSS селектор

td.nprods > h3

Это значит, что будет вытащен текст из самого первого элемента h3 под самым первым тэгом td, у которого есть класс nprods. Теперь наша переменная $http_html_text будет содержать название товара.

А переменная $http_html_texts будет содержать названия всех товаров, найденных по запросу. Но в нашем скрипте они не нужны.

Теперь эту переменную можно смело прописать в действии «Сказать» — и Дуся будет произносить название товара, для которого сейчас откроется страничка отзывов.

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

А именно — функцией «fattr» — она принимает имя атрибута («href»), строчку с CSS селектором («a.arev») и собственно тот ответ от сервера, который нужно парсить («$http_content»). И возвращает текст самого первого найденного элемента. В нашем случае это будет строка типа «/reviews/apple_ipad_2/».

fattr("href", "a.arev", $http_content)

Пропишем это в действии «Сохранить переменную» и дадим переменной какое-нибудь имя, например «href».

Все готово!

Прекрасно! Теперь остается только открыть на этой страничке браузер. Создадим действие «Intent», в качестве действия интента выберем стандартное действие VIEW, а в поле data пропишем адрес

http://otzovik.com$href

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

В результате

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

исследование CSS селекторы и функции attr, fattr, css и fcss — это те инструменты в арсенале скриптов Дуси, которые позволяют реализовывать такого рода функции без особого труда. Между тем любой парсинг страницы — это в первую очередь исследование ее исходного кода. Не забывайте об этом — и тогда ваши скрипты будут по-настоящему полезными!

20 thoughts on “Как парсить сайты в скриптах

    1. Можете заглянуть в Скрипты — Условия. Там перечислены функции. Get — как раз та самая функция для работы с массивами и ассоциативными массивами.

        1. Читайте внимательнее — там же написан порядок аргументов. Сперва индекс, потом массив.
          И да — если вам нужен четвертый элемент, то нужно передавать естественно 3 — так как нужно указать индекс. А индекс в массиве начинается с 0.

          1. Спасибо, после того как написал, попробовал поменять аргументы — ПОЛУЧИЛОСЬ! То, что надо! Ну и про 0 тоже тупанул

  1. Подскажите как решить проблему с кодировкой. Результат парсинга не показывает кириллицу

  2. Добрый вечер!
    Прошу подсказать, как парсить следующие данные:

    Средняя продажа:
    0,362 грн

    Средний курс рассчитан как медиана курсов из 2218 объявлений, опубликованных за последние 12 часов. Заявки с завышенным или заниженным курсом не учитываются. Обновляется каждые 15 минут.

    Отсюда мне нужна именно цифра 0,362.
    Как записать её в переменную?

  3. Чтобы не было вышеописанной проблемы, приходится использовать ключевое слово для активации. Как уже сказал автор, оно не должно быть коротким. Это в разы понижает удобство использования, ведь я как-то уже привык, что ночью достаточно сказать просто «открой окно» или «включи компьютер» без всяких прелюдий в виде «умный дом». При этом моё привычное необязательное обращение по имени «Вика» слишком короткое.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *