Последние дни мне трудно спать. Я понятия не имею, почему, но это может быть потому, что я просыпаюсь поздно или сижу перед компьютером весь день. В любом случае, эта бессонница проложила путь для довольно много идей, и самым последним был аналитический сервер. Я был сильно вдохновлен Shynet За его простоту и эстетику, и я использовал ее для получения аналитики этого блога и нескольких личных проектов. Шинет был построен с Джанго, который снова вызвал мой интерес. У меня было обычное Nih -Ish подумал, почему бы не построить один. Зачем занимать, когда вы можете создать. Я хотел только сервер аналитики Barebones с основными выходами, такими как то, как Man URL -адреса я получаю на сайте, каковы рефераторы, какие устройства используются для доступа и т. Д. И, судя по бессонничности, я попробовал на нее свои силы И я бы сказал, что мне это удалось. Я тоже сказал в https://lobste.rs что я собираюсь построить один на выходных и я сделал.
Ядро хакерское, но это выполняет работу.
Вы можете найти весь исходный код Здесь Анкет
Начинать начинать
Я склонен работать над моими побочными проектами между моими классами Google Meet, и я, как правило, большую часть времени я ленив. Уменьшить сложность, уменьшить зависимость и уменьшить нежелательные дополнения. Это новый способ работы в моих проектах, и прежде чем я использовал новую функцию, если бы у меня было хорошее настроение, и мирское окружение было в порядке. Теперь я следую своим руководящим принципам проекта, которые у меня были Записывался вниз Анкет
Первоначально я погуглил за то же самое, и появился старый пост в блоге 2014 года. Это было в Python, но с колбой и дал мне представление о том, как это должно работать. Это дало мне много понимания того, как все должно быть склеено вместе, чтобы работать, и как эффективно использовать JS -сторону вещей.
Fastapi был в моей голове, потому что я мог разместить это и с легкостью использовать его для некоторых моих сайтов. Я взломал базовый рабочий сервер через несколько часов и попытался получить из него некоторые данные. Все эти данные должны были где -то хранить, и я использовал Deta.sh База, которая представляет собой DB NOSQL с легким API для работы с Python.
Базовая рабочая модель была Barebones и не дала много понимания ни о чем. Это сделало так, как сказали, не более чем не меньше.
Золотая жила своего рода.
Чтобы получить больше понимания работы Shynet, я обнаружил, что заголовки HTTP использовались для получения всех данных. Ответ HTTP-заголовка содержит почти все необходимые данные, чтобы сделать что-то подобное. Представьте, что данные отправляются на любой сервер для каждой загрузки страницы, может быть трудно понять Но это много данных.
{
"accept": "image/webp,image/apng,image/*,*/*;q=0.8",
"accept-encoding": "gzip, deflate, br",
"accept-language": "en-IN,en-GB;q=0.9,en-US;q=0.8,en;q=0.7",
"referer": "https://athul.github.io/",
"sec-fetch-dest": "image",
"sec-fetch-mode": "no-cors",
"sec-fetch-site": "cross-site",
"user-agent": "Mozilla/5.0 (Linux; Android 9; LLD-AL10) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.125 Mobile Safari/537.36",
"x-amzn-trace-id": "Root=",
"x-forwarded-for": "2.3.4.5",
"x-forwarded-host": "",
"x-forwarded-port": "443",
"x-forwarded-proto": "https",
"x-original-forwarded-for": "1.2.3.4",
"x-real-ip": "1.2.3.4",
"x-request-id": "1234gasdjhgi",
"x-scheme": "https"
}
Это образец запроса заголовка с моего веб -сайта на сервер Analytics. Видите, мы можем получить много деталей от них, если у нас есть правильные инструменты. Есть сайт под названием https://ipapi.co/ И мы можем получить от них довольно много деталей с лишь IP -адресом, мы могли бы получить данные, такие как сетевой провайдер, местоположение пользователя, вошли в систему и так далее …
Вот некоторые драгоценные камни, которые я узнал из чтения исходного кода Шинета. Shynet использует DB под названием Maxmind Geoip DB.
Хорошо, теперь я могу использовать данные. Но где бы я все это увидел? Я мог бы пойти в Deta DB Explorer и прочитать все это как JSON и получить идею. Но в чем смысл читать JSON и понимание JSON, не получая никакой значимой информации?
Обработка полученных данных
Как только данные получены в БД, чтобы получить некоторую значимую информацию, пришлось обработать их немного дальше. Данные должны были быть отсортированы и предоставлены и должны быть отправлены на фронт. Это был первый раз, когда я узнал и использовал Отсортировано и Счетчик функции Python. Чтобы получить детали устройства из ключа «пользователь-агент» в заголовках, я использовал пользователь-агент Пакет в Python. Все эти данные будут использоваться для визуализации графиков и таблиц на фронте.
API или шаблоны?
FASTAPI широко используется для своих возможностей API с использованием асинхронных запросов и всего. Но Fastapi построен на вершине Starlette который является классной веб -фреймворком. Он не только поддерживает API REST, но и поддерживает шаблон с помощью Jinja2. Fastapi делает это тоже. Я уже давно строил игрушечные API и создавал API для передачи данных и выполнения чего -либо, но я чувствовал, что это должно быть частным и быть недоступным от посторонних рук. Таким образом, без предварительного опыта с шаблонами Jinja2 я закончил использование шаблонов.
Использование шаблонов сделало намного проще для управления и работы. Сначала это было пугающе Но позже я подобрал темп и прошел через него.
У Jinja2 есть много хороших функций, над которыми вы могли бы работать и использовать. Он также работает в файлах JS. Его можно легко выбрать с помощью проб и ошибок. Документы также довольно хороши, за исключением части фильтров, поскольку в ней не так много примеров. Фильтры – еще одна классная особенность Jinja2.
Диаграммы для победы !!
Итак, шаблон фиксирован, и я выбрал Tailwind CSS для стиля Frontend и chart.js для графиков, но позже я перешел на Фраппе диаграммы Потому что я хотел попробовать это, и это было довольно хорошее совпадение. Диаграммы Frappe имеют более легкий API и небольшой размер по сравнению с chart.js, а для Noob JS, как я, это было довольно легко. Использование шаблонов внутри файла JS также увеличило время разработки. Использование графиков/диаграмм также улучшило эстетику и имело больше смысла данных. Единственным компромиссом было то, что он увеличил время загрузки страниц.
Текущие функции
- Легко развертываемое на Deta Micros
- Small JS -код. Он отслеживает время и текущий URL -адрес
- Графики и идеи
- Информация о провайдере страны и сети и местоположении
Я знаю, что многие функции отсутствуют, я бы реализовал их, если у меня будет время, и если кто -нибудь запрашивает их.
Я также планирую написать на учебном пособии для строительства того же с нуля
Скриншоты
Страница авторизации
Добро пожаловать страницу
Графики на часы и устройства
Посещены URL и рефератели
Устройство и пользовательские агенты
Все сессии
За страницу сеанса
Если вы нашли это полезным, подумайте о том, чтобы пожертвовать меня на BMC ☕ или PayPal и может связаться со мной в Twitter 😄
Оригинал: “https://dev.to/gh-campus-experts/harnessing-headers-for-analytics-l90”