OpenDevCast

Что там нового в вебе?

2020-01-03T15:10:24.049Z

Приближение нового года натолкнуло меня на мысль составить список наиболее интересных рюшечек в вебе. После ленивого серфинга интернета, наткнулся на блог Google Chrome. Эти то ребята шарят, как изнасиловать пожесче и так замученный веб. У них есть удобный список публикаций по месяцам, а самое интересное — посты из серии "Что нового в версии XX". Все это безобразие вот тут.

Chrome 80 еще нет в stable релизе, но описание DevTools выходит раньше. Вот что добавили: поддержка переопределений let и class в консоли, улучшения для отладки WebAssembly, цепочки инициаторов запроса в network, ну и прочие плюхи, про которые можно почитать тут.

Chrome 79 / 2019.12

https://developers.google.com/web/updates/2019/12/nic79

Maskable Icons

Для PWA под Android

Все дело в том, что начиная с Oreo после добавления PWA приложения вокруг иконки появлялся раздражающий белый кружок. Ну вот ребята и добавили поддержку Maskable Icons.

Web XR

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

Wake Lock

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

Остальное

Также добавили атрибут rendersubtree. Новая игрушка для любителей оптимизации. Атрибут сообщает браузеру, что он может пропустить рендеринг поддерева. Сами почитаете, короче...

В DevTools фичи для печенек, имитации prefers-color-scheme/prefers-reduced-motion, улучшения в code coverage и стек вызовов JS в network. Подробнее почитать можно тут: https://developers.google.com/web/updates/2019/10/devtools

Chrome 78 / 2019.10

https://developers.google.com/web/updates/2019/10/nic78

Fresher service workers

О МОЙ БОГ, неужели больше не придется менять URL для обновления скриптов service workers?! Говорят, теперь побайтовая проверка как у Лисы и Сафари.

Native File System

Нативная поддержка ФС, долгожданное и ужасающее обновление. Можете теперь работать с файловой системой без загрузки на сервер, что очень расширяет возможности PWA. Вроде как запрашивает разрешение у пользователей, но я всё равно жду криптолокер под веб.

SMS Receiver

С SMS Receiver API можно будет получать код из смс сразу в после ввода. Все как у взрослых ребят из нативных приложений.

Остальное

Ещё есть про кастомные свойства CSS с API'шкой, может кому это будет интересно. По мне еще большее усложнение исходников и CSS.

В DevTools добавили ещё улучшений в панели аудита, отладчик для Payment Handler, LCP в производительности и еще по мелочи. Ссылка: https://developers.google.com/web/updates/2019/09/devtools

Chrome 77 / 2019.09

https://developers.google.com/web/updates/2019/09/nic77

Largest Contentful Paint

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

New forms capabilities

const form = document.querySelector('form');
form.addEventListener('formdata', ({formData}) => {  
  formData.append('teamled', 'Лошара');
});

Событие formdata, которое позволит влиять на процесс отправки данных из формы. Вы же хотели больше неявных логик? Получайте! Зато теперь не нужен скрытый input для CSRF токена.

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

Native lazy loading

Нативно и всего одним атрибутом loading="lazy", жалко что пока все равно придется писать js для всех старых версий...

Остальное

Добавили в триалы Contact Picker API, новые единицы измерения в intl.

В DevTools добавили автопереключение темки из вашей ОС, в панели Network показывается prefetch cache, показ приватных свойств объекта при инспектировании в консоле, нотификации и пуши и что-то еще. Ссылка: https://developers.google.com/web/updates/2019/07/devtools

Chrome 76 / 2019.07

https://developers.google.com/web/updates/2019/07/nic76

PWA Omnibox Install Button

В омнибокс добавили кнопульку для PWA. Мелочь, а приятно. Все потому что ранее эту технологию сделали доступной для десктопа. Даже на Linux робит (см. Chrome 70). Правда, мне всё равно, я на dwm сижу.

Теперь можно подменять mini-infobar с предложением установки на свой кастомный. Обязательно сделайте крестик очень маленьким.

Faster updates to WebAPKs

Теперь манифест будет проверяться на предмет изменений каждый день. Раньше было каждые 3 дня.

Dark mode

@media (prefers-color-scheme: dark) {
  body {
    background-color: black;
    color: white;
  }
}

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

Остальное

Также Promise.allSettled, новые методы text(), arrayBuffer(), stream() для работы с BLOB, поддержка изображений в async clipboard API.

В DevTools добавили новый UI для панели Network, HAR теперь содержит сообщения WS, наконец-то использование памяти в реалтайме и еще много интерестного. Посмотрите сами: https://developers.google.com/web/updates/2019/05/devtools#HAR

Chrome 75 / 2019.06

https://developers.google.com/web/updates/2019/06/nic75

Web Share API

Позволяет использовать нативные сервисы шаринга контента из OS, что очень полезно для мобильных устройств. Уже поддерживает шаринг аудиофайлов, изображений, видео и текстовых документов. Свойство navigator.canShare в помощь.

Numeric separators

В числовые литералы добавили нижнее подчеркивание (_, U+005F) как разделитель для читабельности, теперь он будет игнорируется при математических операциях. Ну фиг знает кому это удобно.

Остальное

Добавили desynchronized hint для canvas.

В DevTools, в основном, добавили мелкие, но полезные улучшения интерфейса. Подробнее тут: https://developers.google.com/web/updates/2019/04/devtools

Chrome 74 / 2019.04

https://developers.google.com/web/updates/2019/04/nic74

Private class fields

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

Пользователь не хочет анимаций

Медиа запрос prefers-reduced-motion, который сообщает нам о том, что пользователь не хочет всех этих ваших анимаций. Говорят, некоторых действительно подташнивает от параллаксов.

CSS transition events

Добавили события для отслеживания и изменения поведения при выполнении transition.

Остальное

Обновления в Feature policies, которые позволяют выборочно включать, отключать и изменять поведение определенных функций и API в браузере.

В DevTools добавили Lighthouse v4 в аудите, выделение DOM объектов, к которым применяется выбранное CSS правило, улучшенный просмотр бинарных сообщений в WS, скриншоты выделенных областей, фильтры для service workers, улучшения для анализа профилирования, и еще по мелочи. Смотреть тут: https://developers.google.com/web/updates/2019/03/devtools

Chrome 73 / 2019.3

https://developers.google.com/web/updates/2019/03/nic73

Progressive Web Apps work everywhere

Добавили поддержку PWA для MacOS, теперь работает на всех популярных настольных платформах. И это очень даже классно.

Signed HTTP Exchanges (SXG)

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

Я думаю, это важная часть развития AMP, так как решает проблему с отображением в адресной строке другого домена. Также технология может помочь распространению Web Packaging в режиме p2p.

Это технология явно заслуживает отдельной статьи в новом году.

Остальное

Constructable style sheets, метод matchAll() и еще несколько мелочей.

В DevTools добавили Logpoints для отладки кода в панели без console.log, экспорт информации о code coverage и еще много интерестного. Больше тут: https://developers.google.com/web/updates/2019/01/devtools

Chrome 72 / 2019.01

Public class fields

Еще один шаг к ООП в JS, возможность объявлять публичные методы класса без кода в конструкторе. Продолжение этих идей вы уже видели в 74й версии.

User Activation API

User Activation v2, которая призвана стать стандартом во всех браузерах.

Localizing lists of things with `Intl.format`

const opts = {type: 'disjunction'};
const lf = new Intl.ListFormat('fr', opts);
lf.format(['chien', 'chat', 'oiseau']);
// → 'chien, chat ou oiseau'
lf.format(['chien', 'chat', 'oiseau', 'lapin']);
// → 'chien, chat, oiseau ou lapin'

Добавлен новый метод .format(), который упрощает работу со списками.

Остальное

В DevTools добавили визуализацию метрик производительности и по мелочам: https://developers.google.com/web/updates/2018/11/devtools

Показалось мне интересным:

https://developers.google.com/web/updates/2019/08/get-started-with-gpu-compute-on-the-web

https://developers.google.com/web/updates/2019/07/chrome-75-media-updates

https://developers.google.com/web/updates/2019/06/layoutNG

https://developers.google.com/web/updates/2019/05/desynchronized

https://developers.google.com/web/updates/2019/02/lit-element-and-lit-html

https://developers.google.com/web/updates/2019/01/rtcquictransport-api

https://developers.google.com/web/updates/2019/01/emscripten-npm

https://developers.google.com/web/updates/2018/11/signed-exchanges

https://developers.google.com/web/updates/2018/10/wasm-threads

k8s at home for fun and leisure

2019-10-15T15:10:02.006Z

Потому что могу

У домашнего кластера на Kubernetes может быть несколько применений - от файлохранилки до хостинга личного блога. Но главным из них, безусловно, является оттачивание навыков. Теперь не только ваша команды \ клиенты зависят от надежности и производительности, но и лично вы. Других стимулов, кроме “я смог это сделать” не стоит ждать (см. IKEA effect).

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

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

Вопросы разворачивания на одной машине (будет не так интересно) или использования Raspberry Pi для кластера (для них потребуются имаджи для другой архитектуры) оставим вне рамок этой статьи.

Поделки из желудей и пластилина

Итак, есть некоторое количество оборудования, которое требуется объединить в кластер. В моем случае:

ноутбук Lenovo x240 с 8 ГБ памяти, 250 Гб SSD для корневого диска и 500 Гб HDD для данных
старый десктоп в формате mini-ITX, 8 Гб RAM и Athlon времен взятия Очакова, 250 Гб SSD для корня и 500 Гб HDD

На обе машины была установлена Fedora Atomic 29. Выбор ОС - дело каждого, в моем случае привычнее скачивать апдейты в оффлайне и иметь возможность откатится на прошлую версию (эти и другие преимущества описаны тут)

Дистрибутивом Kubernetes был выбран OpenShift по принципу “выбирай тот который использует ближайший к тебе отзывчивый эксперт”. В наличии только 2 машины, потому приходится пользоваться релизом OKD 3.11 вместо OCP 4.

Наш человек в Гаване

Мой провайдер запрещает внешние коннекты к портам 80 и 22, потому для внешнего доступа нам потребуется виртуальная машина в публичном хостинге с хорошей репутацией. В моем случае это Fedora CoreOS на Digital Ocean.

Она служит как промежуточный хост для reverse ssh tunnel - из машины в кластере (bmo.vrutkovs.eu) устанавливается ssh соединение в сокет /run/bmo.sock на машине в DO (do.vrutkovs.eu). Таким образом, если послать данные в сокет bmo.sock они попадут на нужный порт в машине bmo.

Для этого достаточно запустить autossh:

/usr/bin/docker run --name %n -it  \
  -v /root/.ssh/vrutkovs.pem:/id_rsa:z \
  -e SSH_HOSTNAME=vrutkovs.eu \
  -e SSH_TUNNEL_REMOTE=/run/bmo.sock \
  -e SSH_TUNNEL_HOST=172.17.0.1 \
  -e SSH_TUNNEL_LOCAL=443 \
  jnovack/autossh

Теперь на do.vrutkovs.eu мы может перенаправлять запросы на внутренний сервер с помощью haproxy. Часть конфига:

frontend https
    bind *:443
    mode tcp
    default_backend bmo

backend bmo
    mode tcp
    server bmo /run/bmo.sock

Кроме того do.vrutkovs.eu может служить как машина для почтового сервера и получения Let’s Encrypt сертификатов. Для простоты обслуживания проще получить wildcard сертификат, который затем будет применять роутер опеншифта.

Сердце тьмы

Основой всего будет OpenShift, потому нам потребуется развернуть его на внутренних серверах с помощью openshift-ansible.

Процесс установки довольно специфичен и сложен, да и объяснить его лучше документация сложно. Вот несколько рекомендаций

Научит роутер применять наши LetsEncrypt сертификаты:

openshift_master_overwrite_named_certificates: true
openshift_master_named_certificates:
- certfile: "{{ inventory_dir }}/vrutkovs.eu.crt"
  keyfile: "{{ inventory_dir }}/vrutkovs.eu.key"
  names:
    - "vrutkovs.eu"
  cafile: "{{ inventory_dir }}/letsencrypt.ca.crt"

Все роуты будут получать поддомен автоматически:

openshift_master_default_subdomain: vrutkovs.eu

OpenShift рекомендуется запускать на машинах с 16 Гб памяти, поэтому:

openshift_disable_check: memory_availability

После установки консоль будет доступна по адресу https://console.vrutkovs.eu

Always Own Your Platform

Что с этим кластером теперь делать? Я следую принципу Always Own Your Platform. Потому необходимыми для меня приложениями являются:

gitea - git сервер
nextcloud - сервер синхронизации файлов, RSS-читалка и многое другое
transmission - битторрент клиент (только чтобы скачивать linux дистрибутивы)
jackett - API для битторрент серверов
sonarr - информация о сериалах
lidarr - информация о музыке
этот блог

Некоторые другие вещи (например Matrix сервер или Mastodon) пока приходится отложить из-за низкой скорости интернета.

Другие полезные идеи для приложений можно почерпнуть awesome-selfhosted

Домашние заготовки

Некоторые полезные вещи для домашнего кластера:

скрипт для сохранения состояния кластера (oc get --export объектов и создание коммита во внутреннем репозитории)
tekton для CI - например, автоматического импорта свежих изменений в ImageStream
local provisioner - для выделения локальных каталогов подам
nfs provisioner - для выделения NFS каталогов подам
alertmanager-bot - Telegram бот для событий из Alertmanager
nightshift - бот для управления деплойментами по календарю
conumser - Telegram бот для обработки вебхуков
blackbox exporter - для мониторинга инфры и доступности сайтов

Выводы

Одомашенный Kubernetes - это совсем не страшно, главное найти полезное применения старому оборудованию и внимательно следить за алертами из мониторинга.

Топ тупых лазеек для исследования конкурентов: .git для всех

2019-09-12T12:15:11.008Z

Мое лицо когда получил 200 ОК на запрос /.git/config

Введение

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

А всего-то можно с самого начала закрыть доступ ко всем файлам с точки и забыть об этом.

Репозиторий git в вебе

Пожалуй, одно из самого страшного и тупого что может произойти с проектом. Любой, кто знаком с GIT, сразу догадается, что с этим можно сделать. Проверить очень просто: введите в браузер http(s)://example.com/.git/config, и если вы получили содержимое, то... ну вот, в принципе, и все, делаете wget --mirror или берете любую поделку типа GitTools.

Слишком просто

Получаете репозиторий с исходниками и историей коммитов. При такой квалификации команды разработки наверняка ещё и конфиги с паролями. Если же нет, то поиск уязвимостей будет намного проще. Только нужно ли оно вам? Только если задефейсить ради смеха.

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

Это занимает достаточно времени...

После того, как выкачаем репозиторий, можно восстановить файлы. Вполне возможно, что вам хватит простого git reset --hard. Давай посмотрим, что у нас там внутри. Но для начала сделаем копию tar -zcvf repo.tgz repo , не хочу опять тратить 20 минут на выкачивание если что-то сломаю.

Хм, похоже, это Битрикс с кучей самописного кода сомнительного качества.

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

А вот и доступы к iiko, почему то мне стыдно за это.

Отлично, вот пароль от БД, директория с phpMyAdmin сразу же нашлась в .gitignore, даже искать не придется...

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

Я человек простой, использую tor

Отлично, теперь можно поиграться с API iiko.

Спустя 40 минут (вы уж простите, репозиторий выкачивался 20) мы уже знаем всех клиентов, кол-во заказов, средний чек, зарплаты и многое другое. Намного эффективнее и точнее классического бизнес анализа, правда?

Итог

Из-за желания сэкономить на разработчиках — найм неквалифицированных кадров. Банальное раздолбайство на все самые простые правила разработки и безопасности. В итоге весь бизнес поставлен под угрозу. Статья получилась довольно скучной. Наверное, это самое глупое, что можно допустить в плане безопасности вашего продукта. Несмотря на это, я всегда начинаю с проверки доступности GIT, Mercurial, Docker Registry.

Топ тупых лазеек для исследования конкурентов: mobile API

2019-09-11T11:59:08.472Z

Введение

Почему-то последнее время я все чаще встречаюсь с тем что бэкенд разработчики не особо парятся об своих мобильных API. Может быть они считают что никто туда не полезет? Если вы считаете так же, то зря.

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

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

Пока я сидел и тихо офигевал от увиденного, один мой друг написал, что очень бы хотел базу фильмов (ну как у Кинопоиска, ага). Почему бы и нет? Так как у меня было всего 2 банки сидра, пачка сигарет, тупенький ноут, телефон не лучше и приблежающаяся ночь за окном... Я решил что рассказ об этом будет куда интереснее и взялся за дело! Под катом я расскажу как можно получить эти данные и не возится с парсингом HTML.

Классика MITM атаки

Само название подхода (man-in-the-middle) говорит само за себя. Грубо говоря, мы просто вклиниваемся в общение между приложением и API на сервере. Так как сейчас не 2007, и все уже научились устанавливать Let’s Encrypt, то нам понадобится добавить наш сертификат на устройство как доверенный, чтобы проксировать HTTP(S) трафик.

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

Для таких "интимных дел" мой люибый инструмент это mitmproxy. Качаем, ставим и поднимаем свой прокси. Да еще и сертификаты генерит! Что еще нужно? А когда-то я со squid'ом мучался... Кстати, после запуска сертификаты будут в ~/.mitmproxy, их нужно поставить на ваше устройство. Для андроида мне понадобится mitmproxy-ca-cert.cer. Перекидываем любым известным вам способом и добавляем в доверенные.

Подключаемся к одной сети с обоих устройств, вписываем IP адрес (порт не забудьте) нашего компютера. Теперь HTTP(S) запросы будут проходит через наш прокси, и мы легко сможем их мониторить\копировать и все такое. Вот мы и готовы к поискам золота и приключений.

Мониторим запросы

Открываем интересующие нас приложения, в моем случае это кинопоиск. Года 2 назад я уже игрался с ним, за это время они поменяли версию API и ключ.

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

Смотрим запрос на информацию о фильме. Что это тут у нас? Инкрементальные id. Божечки, как я люблю инкрементальные id. Пытаемся повторить запрос.

Получаем 403, вы же не думали что будет просто? Анализируя заголовки понимаем что каждый запрос подписывается некой сигнатурой. При помощи простых наблюдей приходим к выводу что в подписи участвует timestamp, т.е. подпись меняется от времени запроса.

Отметил красными точками

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

Разбираем APK

Качаем apk файл этого приложения с любого более менее нормального сайта, найденного в гугле по запросу "download apk".

Вот этот вроде ничего, сойдет

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

Распаковываем apk, и получаем древо директорий с декомпилированным и поэтому обфусцированным кодом. Вроде как декомпиляторы для Java не очень стабильные (может кто расскажет больше?), и некоторые части могут быть с ошибками или не восстановлены или восстановленны не верно. Что порождает кучи мусора.

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

grep -r "getKPFilmDetailView" ./unpack/sources/

Отлично! Что-то нашли. Открываем и смотрим, что там...

Ага, список методов. Беглый осмотр соседних файлов не дал никаких результатов. А раз не дал, значит, мы не нашли место формирования запроса. Что же, мы зашли немного не туда, но эта ситуация подсказыват нам следующий шаг. Грепаем по request в уже интиресующей нас директории.

grep -r "request" ./unpack/sources/ru/

Среди всего мусора находим что-то интересное. Я, конечно, не эксперт, но это похоже на функцию подписи URL запроса.

grep -r "UrlSigner" ./unpack/sources/ru/

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

Ну явно что-то полезное...

Ага, вот и наш сигнер, еще и стратегии есть, неплохо. Смотрим дальше.

Код надо понять. Компилятором. Я его дам. Запрос нужно подписать Ключом. Ключ я не дам.

Ага это явно то что мы искали. Сначала я испугался множеств кривых операций, и хотел подключить этот метод из jar файла. Но потом поработав с Procyon и CFR, все встало на свои места. Не буду расскрывать какой секретный ключ, намекну лишь что если вы знаете некоторые известные алгоритмы и немного увлекались необратимым хэшированием, то быстро поймете что делать.

Кстати, javadecompilers.com вам в помщь, там есть все основные инструменты и даже ничего не нужно ставить.

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

Мы были правы в функции генерации подписи участвуют URL запроса с GET параметрами, timestamp и ключ. Проверяем:

Кто сказал что php ни на что не годен?

Подпись совпадает с подписью из запроса! Это хороший знак. Давайте проверим это в действии. Так как время уже позднее, то мне лень писать код. Воспользуемся возможностями Postman и напишем небольшой "Pre-request script". Поместим необходимые параметры в переменные и используем их в заголовках. Кусок с URL просто захардкодим, и так сойдет.

В комментарии метод генерации md5 скопированный с stackoverflow

Расскажите потом как вам фильм (:

Чтож это победа. Ключ подходит, методом тыка можно исключить кучу не влияющих на ответ заголовков. Что касается параметра uuid, я сгенерировал пару случайных, и ничего не изменилось. Перебрал парочку ID фильмов, все хорошо работает. Теперь можно писать скрипт для обхода и собирать свою базу фильмов. А я пожалуй пойду спать.

Топ тупых лазеек для исследования конкурентов: source map

2019-09-10T10:31:32.062Z

Введение

Инструменты и подходы из этой серии маленьких статьей вроде уже достаточно давно известны и расписаны, но я все равно встречаю такие лазейки один-два раза в неделю. На 1 из 10 проектов до сих пор находятся чемпионы, у которых открыт и .git с конфигами к БД и phpMyAdmin, бери не хочу.

Я часто присматриваюсь к конкурентам, продуктам и компаниям, в которых есть интерес к покупке (или реализации своими силами). Чтобы оценивать техническую составляющую, или подготовится к переговорам о слиянии, я всегда сам исследую интересующий продукт. Моя задача — понять насколько крутой в технологическом плане конкурент или проект, который мы могли бы купить. Но не стоит даже и переговоров начинать без минимального представления о состоянии "чужого храма". Иногда мне просто интересно кого-то "поковырять".

Я уж точно не являюсь профессионалом в пентестинге и уже тем более куллхакерцом, но с древних времен предпочитаю исследовать все ручками. Мне немного чужды инструменты комплексного сканирования (например, Metasploit), для меня пропадает вся интрига и атмосфера.

Source map для всех

Какое-то время назад верстальщикам стало скучно, ребята на JQuery тоже приуныли, и вот в один неизвестный день они собрались вместе и сказали – «Хватит! Мы тоже хотим писать много кода», и придумали современный фронтенд стек. Рынок сказал — «Супер, еще большее разделение труда!», и нехило так подогрел зарплаты фронтендеров и жопы некоторых бэкендеров.

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

Вам же, наверняка, будет не очень удобно дебажить сжатый и обфусцированный код в браузере, тут на помощь нам приходят Source Map файлы. Если же вы можете получить к ним доступ, то, скорее всего, сможете восстановить изначальный код фронта и его конфигов (если они не .env, респект этим ребятам) и иногда даже с комментариями. Грешат этим многие, например мой любимый Яндекс.

Давйте приступим!

Открываем исходную страничку, ищем подключенные js файлы, а в них упоминание файла с расширением js.map, и проверяем их доступность. Обычно в React.js это app.js с кодом приложения и vendor.js с подключенными пакетами. Если source map доступны, начинаем нашу экспедицию.

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

const path = require('path'), fs = require('fs'), mf = process.argv[2], dir = 'unpack', 
{sources:s = [], sourcesContent:sc = []} = JSON.parse(fs.readFileSync(mf, {encoding: 'utf8'}));
s.forEach((uri, i) => (fpath = `./${dir}/${uri}`
.replace('webpack:///', ''), fdir = path.dirname(fpath)) 
&& (fs.existsSync(fdir) || fs.mkdirSync(fdir, { recursive: true })) 
&& fs.writeFileSync(fpath, sc[i]) || console.log(`-> ${fpath}`));

После распаковки получаем древо со всеми файлами фронт проекта, теперь можно искать интересные роуты, перенимать опыт и т.д.

Полезная штука, надо бы сохронить

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

Еженедельная история изменений Яндекс Еды

Итог

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

Если у вас есть фронт, разработанный на React/Angular или других фреймворках, и вам не пофиг, то советую проверить ваши js.map, возможно ваши матюги в комментариях уже кто-то читает.

Самый быстрый способ скрыть их от лишних глаз, добавить конфиг в nginx на закрытие файлов по маске *.map.

location ~ \.map$ { # Hide js.map, css.map and others *.map files
    error_page 404; # Send 404
    # deny all;     # Send 403
}

Зависимые типы

2019-09-05T17:53:06.020Z

Вот есть какая-то функция. Давайте, для примера, возьмём деление. Что мы знаем о входных значениях?

Оба аргумента -- числа.
Второй аргумент -- не ноль. На ноль делить нельзя.

То есть, у нашей функции есть условия для входных параметров. Как эти условия задать в программе?

Типизация

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

С условием "число не равно нулю" сложнее. Причём такие ограничения на допустимые значения внутри одного типа встречаются довольно часто. Ещё один пример -- взятие индекса от списка. А вдруг список короче? На каждый размер списка отдельными типами не запастись, да и работать с таким будет сложно. К тому же, необходимая длина списка зависит от конкретного значения индекса, которое мы не знаем.

Исключения

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

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

Специальное значение

Можно вообще не рассматривать такие ситуации как что-то особенное. Делим на ноль? Возвращаем Infinity. Взяли несуществующи индекс? Вернули Null. Проблемы:

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

Оборачиваем значения

Можно обернуть возвращаемое значение в специальный тип. Это гибрид исключений и специальных значений. А поведение для случаев с ошибкой мы пропишем явно: нужно ли нам сразу пробросить ошибку выше, или же сначала закончить переводить зарплаты остальным. К тому же, это хорошо ложится на типизацию. В функциональных языках это монада Maybe. В Python её потрогать можно с помощью библиотеки returns.

Контрактное программирование

Предыдущий подход удобен, когда мы заранее не можем быть уверены в корректности приходящих извне данных, и нам приходится проверять это уде внутри функции. Но давайте вспомним первый пример с типизацией: мы объявляли, что наша функция принимает только числа, и потребовали соблюдение этого условия от внешнего кода, и внутри функции мы можем избежать всяческих проверок. Точно так же мы можем сделать контракт, который будет говорить внешнему коду о том, что на 0 делить нельзя. Это называется Контрактное Программирование. Контракт может накладывать ограничение на входные параметры, результат функции и внутреннее состояние атрибутов класса. Можно проверять это всё в рантайме, как это делается в deal, но хочется узнать о проблемах ещё на этапе компиляции. Итак, что мы можем проверить статически:

Некоторые ограничения, которые известны из типа. Например, контракт orderable, который требует, чтобы передаваемые объекты могли быть сравниваемы друг с другом (это нужно для функций сортировки, например). Обычно такое реализуется с помощью интерфейсов.
Передаваемые константы. Если мы видим, что вот тут в функцию передается число 42, то, очевидно, контракт != 0 соблюдён.

И всё?

Зависимые типы

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

Если мы явно передаем заранее известное значение (константу), то всё отлично, компилятор сам проверит соблюдение условий типа.
Если мы ничего не знаем о значениях (они приходят из внешнего мира), то тут не остается выбора, кроме как забыть о контрактах и явно сделать проверку в рантайме.
А вот если всё из внешнего мира было уже провалидировано, и это всё внутренние коммуникации, то несоблюдение зависимых типов может означать только ошибку разработчика. А значит, их соблюдение надо доказать.

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

Первое практическое применение в программировании -- язык Coq, созданный для доказательства теорем. В нём вообще всё строится вокруг строгих доказательств, пожтому зависимые типы для его задач -- как раз то, что нужно. Но можно ли это использовать в языках общего назначения?

Idris

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

Плюсы: БЕЗОПАСНОСТЬ.

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

Особенности:

Синтаксис вдохновлён Haskell, конечно же.
Ещё один источник вдохновения -- Agda. Оттуда пришли зависимые типы, механизм доказательства теорем, вот это всё.
Termination analysis -- компилятор проверит, что каждая функция покрывает и корректно обрабатывает ВСЕ возможные варианты входных значений.
Proof assistant -- можно прям из IDE интерактивно взаимодействовать с магической тукой, которая может разворачивать доказательства, искать частные случаи, выносить леммы и прочее. Математическая индукция, всё такое.

В общем, даже не знаю, что добавить. Это точно не тот язык, на котором через 10 лет будут написаны все web-сайты. Так же это не тот язык, на котором хочется написать свой бложик. Но пока что это тот язык, коорый в наиболее дружелюбной форме реализует зависимые типы и доказательства. Пока что не очень дружелюбно полуается, но всё же. Возможно, эти идеи пройдут путь упрощения и адаптации, и в какой-нибудь там версии Kotlin или Scala (ха-ха, шучу, Scala уже) мы увидим упрощенный theorem prover. Ну а пока что если хочется почувствовать себя профессором кафедры математики (или добить свою самооценку), Idris отличный вариант.

Ссылки по теме:

OpenDevCast

Что там нового в вебе?

Chrome 79 / 2019.12

Maskable Icons

Wake Lock

Остальное

Chrome 78 / 2019.10

Fresher service workers

Native File System

SMS Receiver

Остальное

Chrome 77 / 2019.09

Largest Contentful Paint

New forms capabilities

Native lazy loading

Остальное

Chrome 76 / 2019.07

PWA Omnibox Install Button

Faster updates to WebAPKs

Dark mode

Остальное

Chrome 75 / 2019.06

Web Share API

Numeric separators

Остальное

Chrome 74 / 2019.04

Private class fields

Пользователь не хочет анимаций

CSS transition events

Остальное

Chrome 73 / 2019.3

Progressive Web Apps work everywhere

Signed HTTP Exchanges (SXG)

Остальное

Chrome 72 / 2019.01

Public class fields

User Activation API

Localizing lists of things with Intl.format

Остальное

Показалось мне интересным:

k8s at home for fun and leisure

Потому что могу

Поделки из желудей и пластилина

Наш человек в Гаване

Сердце тьмы

Always Own Your Platform

Домашние заготовки

Выводы

Топ тупых лазеек для исследования конкурентов: .git для всех

Введение

Репозиторий git в вебе

Итог

Топ тупых лазеек для исследования конкурентов: mobile API

Введение

Классика MITM атаки

Мониторим запросы

Разбираем APK

Топ тупых лазеек для исследования конкурентов: source map

Введение

Source map для всех

Итог

Зависимые типы

Типизация

Исключения

Специальное значение

Оборачиваем значения

Контрактное программирование

Зависимые типы

Idris

Localizing lists of things with `Intl.format`