Мониторь! Мониторь меня полностью!
Возникла интересная задачка: вывести манагерам (и себе) разные данные на 42" телек. Ключевой подвох - данные разные.
ВНИМАНИЕ! Перед тем, как начать что-то делать, прочитайте до конца и подумайте, а надо ли оно вам?.. ВНИМАНИЕ!
Для начала, решил определиться с мат.частью. Если с телеком всё было очень просто: находим более-менее приличное что-то за 10к руб. (было от Супры), то вот отдельную пеку заряжать под вывод картинки - роскош. Решено было заказывать с алишки stick-PC. Поиски довольно быстро явили мне изделие с Atom`ным сердцем от конторы BBEN. Почему они так себя назвали - хз. HDMI, 2 порта usb, питание через micro-usb (но нужен БП; есть в комплекте), wifi и даже слот для micro-SD -карточек - всё, что нужно для уверенного старта в неизвестность (как обычно). Ах, да: при заказе можно выбрать, что тебе туда с завода засетапят: винды или бубунту. Я выбрал бубунту. Итого где-то 18 килорублей, не считая бенза для поездить.
МАТ.ЧАСТЬ
Подождав недельки полторы, я заполучил на почте заветный пакет. Внутри была скромная коробочка, которую "почта россии" даже не сломала. Коробочка сделана добротно, нашла своё применение как нычка под кофейные пакетики 3-в-1. А пока...
1. Анбоксинг. Пока что всё стильно, но скромно. В самый раз!
Девайс палёным пластиком не воняет, на ощупь норм.
[Из коробки были добыты ТТХ, кому интересно - см.пойлер]
Продолжим рассматривать добычу.
2. Масштабируем на среднестатистической руке.
На устройстве всего одна кнопка. Больше ему, в принципе, и не надо. Есть отверстия под вентиляцию. Но ожидать форсажных характеристик от этого гномика - не стоит.
3. В комплекте так же идёт удлинитель HDMI (пригодился), БП и паспорт качества на китайском. К счастью, язык системы они выставили по-дефолту английский.
Увы, клава и мышь блютусные не успели приехать в срок. И приехали несколько позже. Однако, мне не терпелось запустить дивайс.
4. Процесс пошёл!
Я уже опущу, что пришлось для железки прокидывать 220V - это очень просто, если вы заморочились задачкой такого уровня - 100% умеете электрику намутить. Да, ещё пришлось докупить eth-to-usb -адаптер, ибо вафля там плохо тянула, видео с такими раскладами фризится или лаг великоват. Да, кстати, там есть кулер! Я серьёзно! -в этом гноме есть маленький крутилятор и он тихонечно жужжит.
Короче, потом я уехал в отпуск, потом болты и прочие метизы разных калибров... в общем, допилил я задачку только сейчас. А она оказалась занятной!
И, да, когда комплект клава+мышь приехал... они оказались такими шлаковыми... в общем, лучше б клаву с тачем от логитеха купил за 1,5к. Она хоть красивая...
ПОСТАНОВКА ЗАДАЧИ
Вкратце, что же надо было сделать: есть два стула видеорегистратора, оба умеют отдавать поток в rtsp. Нужно вывести камеры на экран. Есть Яндекс.Метрика, нужно вывести недельную статистику и хиты за месяц со счётчика на экран. И есть [экспериментально, ещё внедряю] гуглотабличка с объектами, на которых ведутся работы. Тоже, как вы понимаете - вывести на...
VENI, VIDI...
Собственно, для начала я решил забодать камеры. В качестве платформы размещения решил использовать гуглохром. Ибо в браузерах теперь можно многое.
Но беда в том, что я не прогер. Я всего лишь любопытный и упёртый упоротый админ. Опять же, имело смысл пободаться. Узнал, что такое iframe. Прикольно. Запихнул самое простое: jpeg-поток (с автообновлялкой) от старой камеры, которую для теста поставил себе дома. Чтобы было веселее, да.
Но у меня rtsp. Его нужно неким образом в плеер пихнуть. Разбираться со стримером типа red5 или wowza мне не хотелось и времени не было. Да и не надо. Ага, вы мне ещё hls предложите...
После двух неправильных вариантов с nginx и ffmpeg был найден простой и правильный варик на ffserver + ffmpeg. То есть, я сделал рестример. Анон, не делай так!
Вкратце о том, как это работает (и перейдём к конфигу):
DVR ---rtsp---> [FFserver+FFmpeg] ---flv---> [swf-player + браузер] <---файлик плеера и страничка--- lighttpd
Ниажидал, да? -нам ещё пека понадобится. Ну или виртуалка :))
Отвлекусь, чтобы обозначить парочку немаловажных моментов: у нас в конторе стоят регики RVi. У них есть нормальные DVR, где указываешь при записи ссылки на канал admin:password, а есть ненормальные, где логин:пароль (именно через двоеточие) нужно шифровать в base64. Я заманался догадываться, что это было. Но узнал и узрел. В мане - ни слова, предполагается, что админ дебил и будет использовать дефолтные admin:admin. Пздц... >_<
Я использовал дебиан на виртуалке. Самый сок для данной задачи. Естественно, без гуя. В общем, тебе понадобятся пакеты ffmpeg и lighttpd. Начнём с них. Как установить их в своём , ты, скорее всего, знаешь. Далее, лезем в /etc/ffserver.conf (засейвив старый и сделав пустой новый) и пишем там всякое:
# Порт, на котором будет работать ffserver
Port 12345
# Адрес, на котором будет работать ffserver.
# Если указать 0.0.0.0 то будут использованы все доступные адреса
BindAddress 0.0.0.0
# Максимальное количество обслуживаемых соединений
MaxHTTPConnections 2000
# Максимальное количество клиентов
MaxClients 1000
# Максимальная используемая полоса (в килобитах)
MaxBandwidth 1000
# Файл журнала. Формат подобен формату лога apache
CustomLog /var/log/ffserver-access.log
# Описываем источник
# Временный файл для хранения промежуточных данных
File /tmp/webcam.ffm
# Максимальный размер файла с промежуточными данными
FileMaxSize 3M
# Команда для запуска источника.
# Адрес для отправки данных источником автоматически будет добавлен в конец этой строки
Launch ffmpeg -s 640x480 -f video4linux2 -i /dev/video0
# С каких адресов может обращаться источник
ACL allow 127.0.0.1
ACL allow 192.168.xxx.1 255.255.255.0
# Описываем первый поток. Это будет поток в формате flv
# Источник потока
Feed webcam.ffm
# Используемый формат
Format flv
# Используемый кодек
VideoCodec flv
# Частота кадров
VideoFrameRate 30
# Размер буфера
VideoBufferSize 80000
# Битрейт
VideoBitRate 200
# Минимальное и максимальное качество
VideoQMin 1
VideoQMax 5
# Размер видео. Дожно совпадать с размером видео на источнике
VideoSize 640x480
# Время ожидания перед началом отправки данных клиенту (в секундах)
PreRoll 1
# Звук мы транслировать не будем
NoAudio
# Второй поток. Это SWF-файл с FLV-потоком внутри
# Всё остальное по аналогии
Feed webcam.ffm
Format swf
VideoCodec flv
VideoFrameRate 30
VideoBufferSize 80000
VideoBitRate 200
VideoQMin 1
VideoQMax 5
VideoSize 640x480
PreRoll 1
NoAudio
# При обращении к индексной страницы ffserver будем отображать текущий статус сервера
Format status
Камеры ты сюда напишешь свои, тут всё просто элементарнейше. Запускается вся эта балалайка командой ffserver -f /etc/ffserver.conf
Лайф-хак: поскольку ффсервер - это не служба, его надо как-то держать запущенным и вообще запускать при старте тачки. Через rc.d он у меня "не взлетел". Где наша не пропадала? -написал в кронтаб 5-минутную пиналку. Сразу две задачи решаем: запуск через 5 минут после загрузки ОСи + поддержание работоспособным процесса, если тот вдруг соизволит уйти в отвал. Если проц запущен и работает - он просто продолжит работу дальше. Изи, ваще... Кстати, у ффсервера есть веб-мордочка:
5. Веб-морда ffserver`а. Служит для мониторинга и подключения к файлам-источникам.
Вы уже поняли, да, что теперь нужен плеер? -в качестве наиболее простого и понятного решения был выбран flv-mp3. Здесь можно собрать и скачать, а вот тут инструкция.
Код плеера вставляется iframe`ом. Но об этом - чуточку ниже, у нас же ещё метрика!..
...BELLUM...
Нет! Нельзя просто взять и сделать кнопочку "сгенерировать код для вставки"! Нееет, яндекс - это же русская компания. Значит, его клиенты должны страдать.
Ребят, серьёзно: вам нужен ещё и веб-сервер, который будет держать пыхоскрипты для работы с метрикой и отрисовки графиков. А ты-то думал, зачем же ставить лайти?!.
Сваяем первый пыхоскрипт, который показывает разную активность на сайте, вроде визитов, просмотров и посетителей. За неделю.
/////////////////////////////////
///// ПАРАМЕТРЫ GET-ЗАПРОСА /////
/////////////////////////////////
$url = 'https://api-metrika.yandex.ru/stat/v1/data';
$params = [
'ids' => 'айди давай',
'oauth_token' => 'сюда токен подставляй да',
'metrics' => 'ym:s:visits,ym:s:pageviews,ym:s:users',
'dimensions' => 'ym:s:date',
'date1' => '7daysAgo',
'date2' => 'yesterday',
'sort' => 'ym:s:date',
];
/////////////////////////////////////////////////////////
///// ПОЛУЧИМ ДАННЫЕ В JSON И ПЕРЕВЕДЁМ ИХ В МАССИВ /////
/////////////////////////////////////////////////////////
$json = file_get_contents( $url . '?' . http_build_query($params) );
$data = json_decode($json, true)['data'];
///////////////////////////////////////////////////////////////
///// ПРЕОБРАЗУЕМ ДАННЫЕ ДЛЯ ЛИНЕЙНОГО ГРАФИКА HIGHCHARTS /////
///////////////////////////////////////////////////////////////
$tmpdata = [];
foreach($data as $item) {
$tmpdata['visits'][] = $item['metrics'][0];
$tmpdata['pageviews'][] = $item['metrics'][1];
$tmpdata['users'][] = $item['metrics'][2];
$tmpdata['categories'][] = $item['dimensions'][0]['name'];
}
//////////////////////////////////////////////////////////
///// ВЕРНЁМ JSON С НУЖНОЙ СТРУКТУРОЙ ДЛЯ HIGHCHARTS /////
//////////////////////////////////////////////////////////
$categories = json_encode($tmpdata['categories'], JSON_UNESCAPED_UNICODE);
$series = json_encode([
[ 'name' => 'Визиты', 'data' => $tmpdata['visits'] ],
[ 'name' => 'Просмотры', 'data' => $tmpdata['pageviews'] ],
[ 'name' => 'Посетители', 'data' => $tmpdata['users'] ]
], JSON_UNESCAPED_UNICODE);
/////////////////////////////////////////////////////////
///// ВЫВЕДЕМ HTML-КОД И ПОСТРОИМ ГРАФИК HIGHCHARTS /////
/////////////////////////////////////////////////////////
echo <<
HTML;
//endВсё? -авотфигушки! Давай ещё скрипт запилим, только другой. Он хиты покажет. За месяц.
/////////////////////////////////////////////////////////
///// ПАРАМЕТРЫ GET-ЗАПРОСА ДЛЯ КОНКРЕТНОЙ СТРАНИЦЫ /////
/////////////////////////////////////////////////////////
$url = 'https://api-metrika.yandex.ru/stat/v1/data';
$params = [
'ids' => 'айди-дай',
'oauth_token' => 'токен-чпокен',
'metrics' => 'ym:pv:pageviews',
'dimensions' => 'ym:pv:date',
'filters' => rawurldecode("ym:pv:URL=='http://сайт подставь/'"),
'date1' => '30daysAgo',
'date2' => 'yesterday',
'sort' => 'ym:pv:date',
];
/////////////////////////////////////////////////////////
///// ПОЛУЧИМ ДАННЫЕ В JSON И ПЕРЕВЕДЁМ ИХ В МАССИВ /////
/////////////////////////////////////////////////////////
$json = file_get_contents( $url . '?' . http_build_query($params) );
$data = json_decode($json, true)['data'];
/////////////////////////////////////////////////////////////
///// ПРЕОБРАЗУЕМ ДАННЫЕ ДЛЯ ЛИНЕЙНОГО ГРАФИКА AMCHARTS /////
/////////////////////////////////////////////////////////////
$tmpdata = [];
foreach ($data as $item) {
$tmpdata[] = [
'category' => $item['dimensions'][0]['name'],
'column-1' => $item['metrics'][0],
];
}
////////////////////////////////////
///// ВЕРНЁМ JSON ДЛЯ AMCHARTS /////
////////////////////////////////////
$dataProvider = json_encode($tmpdata);
///////////////////////////////////////////////////////
///// ВЫВЕДЕМ HTML-КОД И ПОСТРОИМ ГРАФИК AMCHARTS /////
///////////////////////////////////////////////////////
echo <<
HTML;
//endНу, вот ты сделал пыхоскрипты. Надеюсь, они у тебя работают. Шучу, не работают. Потому, что надо пыху поставить и cgi. Пыха сейчас 7я актуальна. Как пыху поставить в своём дистрибе ОС, думаю, вы знаете. Как проинициализировать модули, думаю, найдёте в гугле. И службу лайти перезапусти! Собственно, пихаете пыхоскрипты в веб-корень сервера /var/www/html и пытаетесь их запустить через http:///myscript.php, чтобы что-то отрисовалось. Ну, да, отрисовывает. Оси. А знаешь, почему? -потому, что ты тупо скопипастил код. А там есть важные пометочки. Вооот, балда, теперь давай ниже читай...
Для начала, вот раз и два маны по метрике. Официальные. Там много всякого говна, из него нужно знать только как создать токен и вообще зарегать своё приложение, а так же - как токен активировать вручную. При регистрации важна одна деталь: Callback URL. Это адрес пыхоскрипта вида http:///myscript.php. Просто заполни это поле сразу, чтобы потом волов не сношать.
Если вы прошли кружок ада с регистрацией, добро пожаловать в активацию. Для этого понадобится ID, который выдали при регистрации (это циферки). Его надо подпихнуть вот в сюда:
https://oauth.yandex.ru/authorize?response_type=token&client_id=<идентификатор приложения>
и зайти туда браузером. Да, кстати, при реганье надо было ввести колбэк-юэрэл. Ты же сделал это, да? ;)
В результате, яндекс в ответке выдаст токен (он для каждого пыхоскрипта должен быть свой) и вообще, наконец-то, покажет наполненный смыслом болью и тленом низкой посещаемости график. Да-да-да, если у тебя, как у меня, два графика и разные скрипты под них - будь добр, регни два приложения. А ниже я расскажу, где токены нужны. Шучу, не ниже они нужны. А выше, смотри кодЪ.
И, да, имейте в виду, яндекс - это русская компания и не все её решения можно объяснить логически.
У токенов есть expiration time.
То есть, они протухают.
...
Зочем? -во славу Сотоны, конечно! :D
6. Кумамон одобряэ!
...VICI!
А теперь вкусняшки! Лезем в онлайн-редактор, ибо поставить notepad++ тебе западло и ваяем с мгновенной отрисовкой результата желаемое. Я код покажу для скриншота, который ниже. Но, как уже понятно, это будет не конец...
Всё это надо сохранить в хтмл-страницу и её сунуть в корень сайта.
Как видишь, ничего сложного. Почти. А знаешь, почему? -потому, что в офф.мане гугла не написано, что параметр chrome=false задается через &, а widget=false& становится фолсом именно так и как в мане не работает. Почему? -да шут их знает!.. Да, совсем забыл, мы ж гуглотабличку вставили. И ячейки замерджили вертикально. Если ты ещё не понял, тут таблица зафигачена, как структурообразующая основа. Вооот!..
7. Ура!
Но на скриншоте ты только что упустил одну очень важную деталь. Где интерфейс? -подсказываю хак: гугл надо запускать в режиме инкогнито и киоска
# google-chrome --kiosk --inkognito http://192.168.xxx.xxx/твоя_страничка.html
Зачем: чтобы не сохранялись данные сеанса и можно было скриптом грузить при запуске оболочки. Вот, кстати, об оболочке! Чтобы не сношаться с консолью, пытаясь прописать что-то в автозагрузку, вызови это:
# sudo gnome-session-properties &
Там можно спокойно присать команду запуска гугла. А ещё нужно поставить плагин, который будет автообновлять страничку, скажем. каждые 5 минут, во избежание фризов видео. Искать в расширениях по слову autorefresh. Чтобы корректно её настроить, запусти google-chrome --inkognito http://192.168.xxx.xxx/твоя_страничка.html и сетапь плагин. Так же, не обойди вниманием и надоедающее сообщение про связку ключей. Открывай консоль, вводи seahorse, далее действуй по мануалу.
Что называется, "я кончил и закурил" (с). Как тут не вспомнить "Арию Пимена" из "Бориса Годунова" (который опера), где он изрекает "Окончен труд, завещанный от Бога...".
Так что, дорогой читатель, специально для тебя я мало того, что написал ман, я ещё и ссылочек собрал. Так что, тебе не придётся тратить человеко-часы, чтобы повторить всё это.
Гордись, что либо подписан на меня, либо умеешь искать инфу яндексом/гуглом.
P.S.: не шикуйте с кэшем видосов, виртуалка может и повеситься. И гипервизор повесить. Если платформа слабая. Да, это всё - велосипед на костылях. Но работает же!
СИЛ:
ВНИМАНИЕ! Перед тем, как начать что-то делать, прочитайте до конца и подумайте, а надо ли оно вам?.. ВНИМАНИЕ!
Для начала, решил определиться с мат.частью. Если с телеком всё было очень просто: находим более-менее приличное что-то за 10к руб. (было от Супры), то вот отдельную пеку заряжать под вывод картинки - роскош. Решено было заказывать с алишки stick-PC. Поиски довольно быстро явили мне изделие с Atom`ным сердцем от конторы BBEN. Почему они так себя назвали - хз. HDMI, 2 порта usb, питание через micro-usb (но нужен БП; есть в комплекте), wifi и даже слот для micro-SD -карточек - всё, что нужно для уверенного старта в неизвестность (как обычно). Ах, да: при заказе можно выбрать, что тебе туда с завода засетапят: винды или бубунту. Я выбрал бубунту. Итого где-то 18 килорублей, не считая бенза для поездить.
МАТ.ЧАСТЬ
Подождав недельки полторы, я заполучил на почте заветный пакет. Внутри была скромная коробочка, которую "почта россии" даже не сломала. Коробочка сделана добротно, нашла своё применение как нычка под кофейные пакетики 3-в-1. А пока...
1. Анбоксинг. Пока что всё стильно, но скромно. В самый раз!
Девайс палёным пластиком не воняет, на ощупь норм.
[Из коробки были добыты ТТХ, кому интересно - см.пойлер]
Продолжим рассматривать добычу.
2. Масштабируем на среднестатистической руке.
На устройстве всего одна кнопка. Больше ему, в принципе, и не надо. Есть отверстия под вентиляцию. Но ожидать форсажных характеристик от этого гномика - не стоит.
3. В комплекте так же идёт удлинитель HDMI (пригодился), БП и паспорт качества на китайском. К счастью, язык системы они выставили по-дефолту английский.
Увы, клава и мышь блютусные не успели приехать в срок. И приехали несколько позже. Однако, мне не терпелось запустить дивайс.
4. Процесс пошёл!
Я уже опущу, что пришлось для железки прокидывать 220V - это очень просто, если вы заморочились задачкой такого уровня - 100% умеете электрику намутить. Да, ещё пришлось докупить eth-to-usb -адаптер, ибо вафля там плохо тянула, видео с такими раскладами фризится или лаг великоват. Да, кстати, там есть кулер! Я серьёзно! -в этом гноме есть маленький крутилятор и он тихонечно жужжит.
Короче, потом я уехал в отпуск, потом болты и прочие метизы разных калибров... в общем, допилил я задачку только сейчас. А она оказалась занятной!
И, да, когда комплект клава+мышь приехал... они оказались такими шлаковыми... в общем, лучше б клаву с тачем от логитеха купил за 1,5к. Она хоть красивая...
ПОСТАНОВКА ЗАДАЧИ
Вкратце, что же надо было сделать: есть два стула видеорегистратора, оба умеют отдавать поток в rtsp. Нужно вывести камеры на экран. Есть Яндекс.Метрика, нужно вывести недельную статистику и хиты за месяц со счётчика на экран. И есть [экспериментально, ещё внедряю] гуглотабличка с объектами, на которых ведутся работы. Тоже, как вы понимаете - вывести на...
VENI, VIDI...
Собственно, для начала я решил забодать камеры. В качестве платформы размещения решил использовать гуглохром. Ибо в браузерах теперь можно многое.
Но беда в том, что я не прогер. Я всего лишь любопытный и упёртый упоротый админ. Опять же, имело смысл пободаться. Узнал, что такое iframe. Прикольно. Запихнул самое простое: jpeg-поток (с автообновлялкой) от старой камеры, которую для теста поставил себе дома. Чтобы было веселее, да.
Но у меня rtsp. Его нужно неким образом в плеер пихнуть. Разбираться со стримером типа red5 или wowza мне не хотелось и времени не было. Да и не надо. Ага, вы мне ещё hls предложите...
После двух неправильных вариантов с nginx и ffmpeg был найден простой и правильный варик на ffserver + ffmpeg. То есть, я сделал рестример. Анон, не делай так!
Вкратце о том, как это работает (и перейдём к конфигу):
DVR ---rtsp---> [FFserver+FFmpeg] ---flv---> [swf-player + браузер] <---файлик плеера и страничка--- lighttpd
Ниажидал, да? -нам ещё пека понадобится. Ну или виртуалка :))
Отвлекусь, чтобы обозначить парочку немаловажных моментов: у нас в конторе стоят регики RVi. У них есть нормальные DVR, где указываешь при записи ссылки на канал admin:password, а есть ненормальные, где логин:пароль (именно через двоеточие) нужно шифровать в base64. Я заманался догадываться, что это было. Но узнал и узрел. В мане - ни слова, предполагается, что админ дебил и будет использовать дефолтные admin:admin. Пздц... >_<
Я использовал дебиан на виртуалке. Самый сок для данной задачи. Естественно, без гуя. В общем, тебе понадобятся пакеты ffmpeg и lighttpd. Начнём с них. Как установить их в своём , ты, скорее всего, знаешь. Далее, лезем в /etc/ffserver.conf (засейвив старый и сделав пустой новый) и пишем там всякое:
# Порт, на котором будет работать ffserver
Port 12345
# Адрес, на котором будет работать ffserver.
# Если указать 0.0.0.0 то будут использованы все доступные адреса
BindAddress 0.0.0.0
# Максимальное количество обслуживаемых соединений
MaxHTTPConnections 2000
# Максимальное количество клиентов
MaxClients 1000
# Максимальная используемая полоса (в килобитах)
MaxBandwidth 1000
# Файл журнала. Формат подобен формату лога apache
CustomLog /var/log/ffserver-access.log
# Описываем источник
# Временный файл для хранения промежуточных данных
File /tmp/webcam.ffm
# Максимальный размер файла с промежуточными данными
FileMaxSize 3M
# Команда для запуска источника.
# Адрес для отправки данных источником автоматически будет добавлен в конец этой строки
Launch ffmpeg -s 640x480 -f video4linux2 -i /dev/video0
# С каких адресов может обращаться источник
ACL allow 127.0.0.1
ACL allow 192.168.xxx.1 255.255.255.0
# Описываем первый поток. Это будет поток в формате flv
# Источник потока
Feed webcam.ffm
# Используемый формат
Format flv
# Используемый кодек
VideoCodec flv
# Частота кадров
VideoFrameRate 30
# Размер буфера
VideoBufferSize 80000
# Битрейт
VideoBitRate 200
# Минимальное и максимальное качество
VideoQMin 1
VideoQMax 5
# Размер видео. Дожно совпадать с размером видео на источнике
VideoSize 640x480
# Время ожидания перед началом отправки данных клиенту (в секундах)
PreRoll 1
# Звук мы транслировать не будем
NoAudio
# Второй поток. Это SWF-файл с FLV-потоком внутри
# Всё остальное по аналогии
Feed webcam.ffm
Format swf
VideoCodec flv
VideoFrameRate 30
VideoBufferSize 80000
VideoBitRate 200
VideoQMin 1
VideoQMax 5
VideoSize 640x480
PreRoll 1
NoAudio
# При обращении к индексной страницы ffserver будем отображать текущий статус сервера
Format status
Камеры ты сюда напишешь свои, тут всё просто элементарнейше. Запускается вся эта балалайка командой ffserver -f /etc/ffserver.conf
Лайф-хак: поскольку ффсервер - это не служба, его надо как-то держать запущенным и вообще запускать при старте тачки. Через rc.d он у меня "не взлетел". Где наша не пропадала? -написал в кронтаб 5-минутную пиналку. Сразу две задачи решаем: запуск через 5 минут после загрузки ОСи + поддержание работоспособным процесса, если тот вдруг соизволит уйти в отвал. Если проц запущен и работает - он просто продолжит работу дальше. Изи, ваще... Кстати, у ффсервера есть веб-мордочка:
5. Веб-морда ffserver`а. Служит для мониторинга и подключения к файлам-источникам.
Вы уже поняли, да, что теперь нужен плеер? -в качестве наиболее простого и понятного решения был выбран flv-mp3. Здесь можно собрать и скачать, а вот тут инструкция.
Код плеера вставляется iframe`ом. Но об этом - чуточку ниже, у нас же ещё метрика!..
...BELLUM...
Нет! Нельзя просто взять и сделать кнопочку "сгенерировать код для вставки"! Нееет, яндекс - это же русская компания. Значит, его клиенты должны страдать.
Ребят, серьёзно: вам нужен ещё и веб-сервер, который будет держать пыхоскрипты для работы с метрикой и отрисовки графиков. А ты-то думал, зачем же ставить лайти?!.
Сваяем первый пыхоскрипт, который показывает разную активность на сайте, вроде визитов, просмотров и посетителей. За неделю.
/////////////////////////////////
///// ПАРАМЕТРЫ GET-ЗАПРОСА /////
/////////////////////////////////
$url = 'https://api-metrika.yandex.ru/stat/v1/data';
$params = [
'ids' => 'айди давай',
'oauth_token' => 'сюда токен подставляй да',
'metrics' => 'ym:s:visits,ym:s:pageviews,ym:s:users',
'dimensions' => 'ym:s:date',
'date1' => '7daysAgo',
'date2' => 'yesterday',
'sort' => 'ym:s:date',
];
/////////////////////////////////////////////////////////
///// ПОЛУЧИМ ДАННЫЕ В JSON И ПЕРЕВЕДЁМ ИХ В МАССИВ /////
/////////////////////////////////////////////////////////
$json = file_get_contents( $url . '?' . http_build_query($params) );
$data = json_decode($json, true)['data'];
///////////////////////////////////////////////////////////////
///// ПРЕОБРАЗУЕМ ДАННЫЕ ДЛЯ ЛИНЕЙНОГО ГРАФИКА HIGHCHARTS /////
///////////////////////////////////////////////////////////////
$tmpdata = [];
foreach($data as $item) {
$tmpdata['visits'][] = $item['metrics'][0];
$tmpdata['pageviews'][] = $item['metrics'][1];
$tmpdata['users'][] = $item['metrics'][2];
$tmpdata['categories'][] = $item['dimensions'][0]['name'];
}
//////////////////////////////////////////////////////////
///// ВЕРНЁМ JSON С НУЖНОЙ СТРУКТУРОЙ ДЛЯ HIGHCHARTS /////
//////////////////////////////////////////////////////////
$categories = json_encode($tmpdata['categories'], JSON_UNESCAPED_UNICODE);
$series = json_encode([
[ 'name' => 'Визиты', 'data' => $tmpdata['visits'] ],
[ 'name' => 'Просмотры', 'data' => $tmpdata['pageviews'] ],
[ 'name' => 'Посетители', 'data' => $tmpdata['users'] ]
], JSON_UNESCAPED_UNICODE);
/////////////////////////////////////////////////////////
///// ВЫВЕДЕМ HTML-КОД И ПОСТРОИМ ГРАФИК HIGHCHARTS /////
/////////////////////////////////////////////////////////
echo <<
HTML;
//endВсё? -авотфигушки! Давай ещё скрипт запилим, только другой. Он хиты покажет. За месяц.
/////////////////////////////////////////////////////////
///// ПАРАМЕТРЫ GET-ЗАПРОСА ДЛЯ КОНКРЕТНОЙ СТРАНИЦЫ /////
/////////////////////////////////////////////////////////
$url = 'https://api-metrika.yandex.ru/stat/v1/data';
$params = [
'ids' => 'айди-дай',
'oauth_token' => 'токен-чпокен',
'metrics' => 'ym:pv:pageviews',
'dimensions' => 'ym:pv:date',
'filters' => rawurldecode("ym:pv:URL=='http://сайт подставь/'"),
'date1' => '30daysAgo',
'date2' => 'yesterday',
'sort' => 'ym:pv:date',
];
/////////////////////////////////////////////////////////
///// ПОЛУЧИМ ДАННЫЕ В JSON И ПЕРЕВЕДЁМ ИХ В МАССИВ /////
/////////////////////////////////////////////////////////
$json = file_get_contents( $url . '?' . http_build_query($params) );
$data = json_decode($json, true)['data'];
/////////////////////////////////////////////////////////////
///// ПРЕОБРАЗУЕМ ДАННЫЕ ДЛЯ ЛИНЕЙНОГО ГРАФИКА AMCHARTS /////
/////////////////////////////////////////////////////////////
$tmpdata = [];
foreach ($data as $item) {
$tmpdata[] = [
'category' => $item['dimensions'][0]['name'],
'column-1' => $item['metrics'][0],
];
}
////////////////////////////////////
///// ВЕРНЁМ JSON ДЛЯ AMCHARTS /////
////////////////////////////////////
$dataProvider = json_encode($tmpdata);
///////////////////////////////////////////////////////
///// ВЫВЕДЕМ HTML-КОД И ПОСТРОИМ ГРАФИК AMCHARTS /////
///////////////////////////////////////////////////////
echo <<
HTML;
//endНу, вот ты сделал пыхоскрипты. Надеюсь, они у тебя работают. Шучу, не работают. Потому, что надо пыху поставить и cgi. Пыха сейчас 7я актуальна. Как пыху поставить в своём дистрибе ОС, думаю, вы знаете. Как проинициализировать модули, думаю, найдёте в гугле. И службу лайти перезапусти! Собственно, пихаете пыхоскрипты в веб-корень сервера /var/www/html и пытаетесь их запустить через http:///myscript.php, чтобы что-то отрисовалось. Ну, да, отрисовывает. Оси. А знаешь, почему? -потому, что ты тупо скопипастил код. А там есть важные пометочки. Вооот, балда, теперь давай ниже читай...
Для начала, вот раз и два маны по метрике. Официальные. Там много всякого говна, из него нужно знать только как создать токен и вообще зарегать своё приложение, а так же - как токен активировать вручную. При регистрации важна одна деталь: Callback URL. Это адрес пыхоскрипта вида http:///myscript.php. Просто заполни это поле сразу, чтобы потом волов не сношать.
Если вы прошли кружок ада с регистрацией, добро пожаловать в активацию. Для этого понадобится ID, который выдали при регистрации (это циферки). Его надо подпихнуть вот в сюда:
https://oauth.yandex.ru/authorize?response_type=token&client_id=<идентификатор приложения>
и зайти туда браузером. Да, кстати, при реганье надо было ввести колбэк-юэрэл. Ты же сделал это, да? ;)
В результате, яндекс в ответке выдаст токен (он для каждого пыхоскрипта должен быть свой) и вообще, наконец-то, покажет наполненный смыслом болью и тленом низкой посещаемости график. Да-да-да, если у тебя, как у меня, два графика и разные скрипты под них - будь добр, регни два приложения. А ниже я расскажу, где токены нужны. Шучу, не ниже они нужны. А выше, смотри кодЪ.
И, да, имейте в виду, яндекс - это русская компания и не все её решения можно объяснить логически.
У токенов есть expiration time.
То есть, они протухают.
...
Зочем? -во славу Сотоны, конечно! :D
6. Кумамон одобряэ!
...VICI!
А теперь вкусняшки! Лезем в онлайн-редактор, ибо поставить notepad++ тебе западло и ваяем с мгновенной отрисовкой результата желаемое. Я код покажу для скриншота, который ниже. Но, как уже понятно, это будет не конец...
Всё это надо сохранить в хтмл-страницу и её сунуть в корень сайта.
Как видишь, ничего сложного. Почти. А знаешь, почему? -потому, что в офф.мане гугла не написано, что параметр chrome=false задается через &, а widget=false& становится фолсом именно так и как в мане не работает. Почему? -да шут их знает!.. Да, совсем забыл, мы ж гуглотабличку вставили. И ячейки замерджили вертикально. Если ты ещё не понял, тут таблица зафигачена, как структурообразующая основа. Вооот!..
7. Ура!
Но на скриншоте ты только что упустил одну очень важную деталь. Где интерфейс? -подсказываю хак: гугл надо запускать в режиме инкогнито и киоска
# google-chrome --kiosk --inkognito http://192.168.xxx.xxx/твоя_страничка.html
Зачем: чтобы не сохранялись данные сеанса и можно было скриптом грузить при запуске оболочки. Вот, кстати, об оболочке! Чтобы не сношаться с консолью, пытаясь прописать что-то в автозагрузку, вызови это:
# sudo gnome-session-properties &
Там можно спокойно присать команду запуска гугла. А ещё нужно поставить плагин, который будет автообновлять страничку, скажем. каждые 5 минут, во избежание фризов видео. Искать в расширениях по слову autorefresh. Чтобы корректно её настроить, запусти google-chrome --inkognito http://192.168.xxx.xxx/твоя_страничка.html и сетапь плагин. Так же, не обойди вниманием и надоедающее сообщение про связку ключей. Открывай консоль, вводи seahorse, далее действуй по мануалу.
Что называется, "я кончил и закурил" (с). Как тут не вспомнить "Арию Пимена" из "Бориса Годунова" (который опера), где он изрекает "Окончен труд, завещанный от Бога...".
Так что, дорогой читатель, специально для тебя я мало того, что написал ман, я ещё и ссылочек собрал. Так что, тебе не придётся тратить человеко-часы, чтобы повторить всё это.
Гордись, что либо подписан на меня, либо умеешь искать инфу яндексом/гуглом.
P.S.: не шикуйте с кэшем видосов, виртуалка может и повеситься. И гипервизор повесить. Если платформа слабая. Да, это всё - велосипед на костылях. Но работает же!
СИЛ:
- http://www.seostop.ru/sozdanie-saita/html-css/tablichnaja-verstka.html
- http://www.seostop.ru/sozdanie-saita/html-css/frejmy.html
- http://aleksandr-krylov.ru/page/kak-vstavit-stranicu-s-drugogo-sajta-v-svoj-izmeniv-ejo-masshtab
- https://tech.yandex.ru/metrika/
- https://html-online.com/editor/
- http://flv-mp3.com/ru/flv/manual/
- http://zenway.ru/page/ffserver
- https://denisyuk.by/all/yandex-metrika-api/
- https://www.base64encode.org/
- http://theory.phphtml.net/attr/rowspan.html
- https://wp-glogin.com/2014/08/embedding-google-spreadsheets-with-more-control-over-appearance/
- https://www.sanglyb.ru/article/kak-izbavitsya-ot-okna-razblokirovki-svyazki-klyuchey-v-ubuntu
- https://host-consult.ru/svyazki-klyuchey-pri-zapuske-chrome/