Як працює Base64 й навіщо він потрібен?

Base64 один з самих популярних стандартів кодування бінарних даних у вигляді строки. У відео відповідаємо на питання:
Спробував відповісти на наступні питання:
✅Навіщо потрібен Base64?
✅Як працює Base64 й чому об'єм даних зростає?
✅Чи буває Base32 та Base16 й навіщо він потрібен?
✅Що всередині JSON Web Token?
✅Чи передає Basic Auth пароль відкритим текстом?
✅Як закодувати картинку в Base64?
✅UUID Hex vs Binary
Приклади коду з відео - github.com/koorchik/jabascrip...
Станьте спонсором цього каналу: / @aboutprogramming
Допоможіть каналу розвиватися й отримуйте доступ до ексклюзивного контенту.
Зміст відео:
0:00 - План
0:41 - Приклад 1: JWT
1:30 - Приклад 2: Basic Auth
2:34 - Приклад 3: Data URI
3:30 - Що таке Base64
4:07 - Як працює Base64
9:40 - Base32, Base16
12:58 - Розбір JWT
15:10 - Розбір Basic Auth
16:33 - Розбір Data URI
17:47 - UUID Bin vs Hex
19:40 - Підсумок
🏠 Мої соцмережі:
Жабаскрипт в телеграмі - t.me/jabascript
Я в Твітер - / viktorturskyi
Мій Linkedin - / turskyi
#програмування #українською #base64 #base32 #jsonwebtoken #uuid #authentication #javascript

[@kotfly]

Шукав пояснення base64 англійською, але виявилося, що найкраще пояснення зробили українською)

[@matash149]

Кайфую від інформативності і якості подання. Крутий формат подання. Дякую

[@serhiismoliarchuk]

Дякую за ваші відоси. У вас добре виходить створювати якусь таку не примусову атмосферу та цікаво подати матеріал, котрий зазвичай дуже нудний і скіпається 🔥

[@Naikshy]

Дякую велике за такі наглядні пояснення та відео вцілому)

[@vladyslavkarpenko9372]

Дякую 🤝🏻 Той випадок коли вмикав перегляд з думкою повторити те що знаю, аж раптом помітив для себе дещо нове. Завжди подобаються подібні ситуації, бо відчуваєш більше прибутку ніж очікував. Крім того, це значний плюс в характеристику вас як автора матеріалу: свідчить про те що не повторюєте примітивні пояснення яких тисячі в мережі👏🏻

[@vitalii4102]

Дуже було цікаво. Виявляється так все просто

[@user-ni9lx7ik3g]

Коментар в підтримку. Топ контент =)

[@ostrojen]

Кращий канал який я знайшов за 2023)

[@scherschak]

У мене була прогалина в цій темі. Те що треба, дякую!

[@stepan38]

Круто, зрозуміло пояснюєш, лайк, підписка, дзвіночок. Бажаю каналу розвитку і купу підписників.

[@OlegShevtsov512]

За base64url дякую ❤❤❤

[@taraskruvch]

Ви чудово пояснили основи та практичні застосування цього кодування. Дякую за корисний контент!

[@alexanonymous5823]

просто супер корисно! дуже дуже дякую. лише не зрозумів ро падінги, йду гуглити. Дуже дякую ще раз!

[@AboutProgramming]

Вирішив не ускладнювати, бо не всі Base64 конвертори їх вимагають. Але це частина стандарту 🙂

[@antonsalatskyy]

Вогонь 🥁

[@romankryshtal413]

Коротко і по суті

[@djadjamax]

Круто! Давай ще!)

[@Vladyslav_Sliusar]

Дякую. Зараз прохожу курс CS50 комп'ютер сайнс, і тому передивлявся твої відео. Коли дивився перший раз, думав, що все зрозумів, але все зрозумів я зараз, а не тоді :D

[@666devilsmoke]

Інформативно!

[@andrionos]

Дуже класно все пояснено. Дякую за працю та за якісний український контент!

[@bogdan6720]

Дякую, використовував base, але не знав про таке застосування 🔥🔥🔥

[@dmytrofiialo4818]

Дякую, було справді корисно.

[@mailoisback]

Найкраще пояснення яке я бачив, ще й українською. Дуже дякую!

[@SuperLinuxoid]

Дякую!

[@dmitrybiletskyi7020]

Яку ж ти годноту знімаєш, дякую)

[@Taronimus]

Під час перегляду вже не вперше помічаю, що знаю, про що йтиметься далі, але не через те, що це повтор інформації, а через логічність

[@yevheniilukashov]

Супер. Дякую. 👍

[@MrKriege]

Дякую. Дуже якісне й корисне відео.

[@romansamuliak4587]

Лайк ще до перегляду) Надзвичайго корисні та цікаві відео ще й українською! Дуже дякую!) Так як не працюю із js, окремо дякую що ваші відео фокусуються не на певній мові програмування та технології, а на інженерію вцілому! В одному з відео ви розказували за алгоритми, а чи планується продовження данної рубрики? Дякую)

[@AboutProgramming]

Дякую! Так, по алгоритмах точно буде ще не одне відео 🙂

[@bkhtrv]

такий контент хочеться дивитись и дивитись! щиро дякую👏

[@romanyukartem757]

Дякую за детальний оляд. Відкрив для себе деякі речі із іншої сторони. Також було б круто в описі до відео отримувати рекомендовану вами літературу/джерела по темі відео.

[@oleksiiborovykov6306]

Чудовий контент, дякую

[@sigmanor]

це відео дуже зрозуміло пояснює, як base64 використовується для кодування даних. дуже корисний матеріал.

[@donutWiggum]

Неочікувано досить круто :-)

[@jses8560]

Дуже дякую. Вельми корисна та унікальна інформація.

[@verh010m2]

В молодости изучал циклы в ассемблере на примере base64

[@makaka527]

топчик

[@AdminAdmin-sl2qf]

❤❤❤❤❤❤❤❤❤❤❤❤❤

[@user-su1jk1wt7n]

Like

[@19n1ght]

Дуже дякую! Чудова подача та супер корисний контент! Підкажіть, будьласка, який у Вас термінал? Та чи є такий для МакОС?

[@AboutProgramming]

Дякую! У мене Kubuntu Linux. Термінал Kuake (тільки під KDE), під Gnome є Guake. Відносно MacOs, то я користуюся iTerm2, який теж можна налаштувати, щоб випадав зверху по комбінації клавіш

[@19n1ght]

Дякую за відповідь! Можу я задати ще кілька запитань не по темі відео? - Чи плануєте Ви окреме відео про те як працює HTTPS у середині? - Що ви думаєте про вивчення мов програмування, які не потрібні у роботі кожен день? Наприклад вивчення мови Rust коли працюєш фронтєндом? - Взагалі що ви думаєте про мову Rust? Вона варта вивчення? Чи замінить вона колись С++?

[@pidgornyiandrii40]

Дуже дякую! Чудове подання матеріалу! Перевірте будь-ласка посилання на гітхаб (може щось з доступом)

[@AboutProgramming]

Ох, забув запушити 🤦🏼‍♂️ Пофікшу, дякую 🙂

[@benjamincoinbull4009]

На 9 хв розповідали, що використовуючи 6 біт можна закодувати 64 символи. Виходить один текстовий символ, наприклад А має 6 біт, чому коли ми його відправляємо, ви кажете що він буде займати 8 біт? ps: дуже круте пояснення непростих тем, дякую вам

[@AboutProgramming]

Так й є. У нас є текстове 8-ми бітне кодування. Кожен символ - 1 байт. Коли кодуємо в base64, то ми кожні 6 біт представляємо одним з 64 символів з набору base64 й потім цей символ передаємо, як символ 8бітного ASCII кодування (чи сумісного) й відповідно він починає займати 8 біт хоча репрезентує 6 біт

[@slava7359]

дуже круто такий рівень пояснення мати українською😊

[@IhorKevin]

jabascript 🐸

[@MrCauperwood]

Дякую за відео. Але дещо неясно, ви сказали що base64 використовується для кодування бінарних данних. І навіть показали як воно кодується. Але потім, в прикладі з jwt ми беремо base64 кодований блок і через команду echo ... я очікую отримати бінарні дані а термінал мені виводить читаємий json. Тобто ми закодували текст в base64 а не бінарні дані. Тобто base64 використовується не тільки для кодування бінарних даних? Це неспівпадіння не дає повної картини - чи може там є якась проміжна механіка типу json текст представлений в бінарному вигляді і цей бінарний вигляд потім кодується в base64....

[@AboutProgramming]

Ми можемо розглядати текстові дані, як підмножину бінарних даних, оскільки вони зберігаються в одиничках й нуликах (але звісно, що одні й ті самі текстові данні можуть бути представлені в різному бінарному кодуванні). Просто особливість бінарних даних в тому, що вони не завжди мають текстову репрезентацію. Відносно того, чому термінал виводить читаємий JSON, то причина в тому, що термінал очікуює текстові дані в певному кодуванні (наприклад UTF-8) й бінарні дані, яки ми отримали після декодування base64 й є UTF-8, тому термінал їх успішно представляє у вигляді тексту. Аби у нас термінал очікував UTF-16 (який не є сумісним з ASCII), то він не зміг би показати UTF-8 дані як текст

[@DenKondratiuk]

Бачу позаду прям студія звукозапису?

[@AboutProgramming]

Просто красивий фон)

[@serhiibaranovskyi9131]

Коли побачив що user and password ми передаємо по мережі, вони є закодовані то був трішки шокований, і тут відразу питання що https нам дійсно дає секнюрність і ці дані не можуть бути перехвачені? І чому них не можна шифрувати?

[@AboutProgramming]

Так, вся безпека веб будується на базі https. Чи можна перехопити дані при використанні https - так, але при певних умовах, при підміні сертифікату сервера. Щоб замінений сертифікат пройшов перевірку, він має бути підписаний приватним ключем центра сертифікації для якого на клієнті є публічний ключ. Тобто, якщо вам хтось встановитить сертифікат (в якому публічний ключ) певного центру сертифікації на комп, то цей центр сертифікації зможе генерувати сертифікати для будь-якого сайту. Така схема буває на корпоративних ноутах, щоб моніторити шифруванний трафік. Відносно Basic Auth, то там ще є проблема з CSRF. Ну й ще є Digest Auth, який вже не передає пароль у відкритому вигляді, але теж має власні проблеми

[@Viktorsenseless]

https і дає рівень захисту шифруванням, це посуті надбудова над http це більш універсальне рішення, ніж додавати шифрування для особливих складових http

[@Viktorsenseless]

перехват зашифрованих даних не дає доступ до цих даних, тому https і забезпечує безпеку

[@tymurkr]

То який сенс base64, якщо він тільки збільшує розмір файлу? Не легше просто передати вихідний файл? А також, який сенс auth і jwt, добре, jwt я ще бачив відео про два ключі(доступу і оновлення) але по суті, всеодно знадобиться збереження цих даних в бд за ID, і відправка цього ID, на сторону клієнта, а потім ще паритися з відновленням і заміною цих jwt & IDFromDB, це я ще не кажу про доступ з декількох пристроїв, а також захисту серверу від DDos атак з перебором ID, а якщо ID використовується з якимось алгоритмом то взагалі пиши пропало. Із цього випливає, що JWT & auth додає тільки поля з даними і кодує під base64(чи що там). Чи є реально захищені варіанти реалізації наприклад сесій і авторизації в додатку, окрім встановлення express-rate-limit?

[@AboutProgramming]

Так, кодувати бінарні дані у вигляді тексту не завжди потрібно, але часто використовують, бо багато текстових протоколів. Наприклад JWT має підпис, який бінарний, а хедери в http1.1 розділені " " й в бінарних даних може бути такий байт й відповідно буде битий запит. Але якщо його закодувати в base64, то проблеми немає. Те саме стосується й картинок в CSS (їх можна тягнути окремим файлом, але якщо це іконка, то й не треба робити запиту додаткового, наприклад). Часом basе64 корисний, коли треба в логі записати якісь бінарні дані, а логи це зазвичай текстові строки. Відносно використання JWT, то основна користь в тому, що це не просто рандомний набір символоів, а якісь дані, яки приходять й яким можна довіряти, бо вони підписані. Також в JWT підпис можна робити приватним ключем, а перевіряти публічним. Тобто інші системи можуть перевірити, що запит прийшов від певного юзера, але їм достатньо мати для цього лише публічний ключ. Але так, сесії можна зробити просто по токену й без JWT, але проблема оновлення залишається. Звучить, як гарна тема для відео :) Відносно захисту від перебору, то rate limiting може працювати (можна обмежувати кількість запитів з одного айпі, чи можна обмежувати перебори для одного акаунту та інші)

[@otto1533]

для tr можна просто перелічити символи *tr -d ' -'*

[@fomka_wyverno]

я так і не зрозумів навіщо бінарні данні перетворювати на текстові данні.

[@AboutProgramming]

В JWT, наприклад. Чи картинку в CSS, чи HTML вкласти, щоб не тягнути окремо. Basic auth використовує base64, щоб можна було передати логін й пароль. Часом треба якісь бінарні дані просто записати в лог-файл або покласти а конфіг. Багато текстових протоколів (той самий HTTP, атачменти в пошті, ключі шифрування для того самого ssh) й форматів існує й часом в них треба вкласти бінарні дані

[@Alexex2353]

так нащо він потрібен?)

[@AboutProgramming]

Бінарні дані в текстовому вигляді зберігати/передавати