CDN ir medijos pristatymas

Medijos saugykla, naudojanti Telegram (MTProto) kaip backendą.

JavaScriptVueEdge delivery

Dev-story

Iššūkis

Norėjome kur laikyti ir atiduoti produktų mediją nemokant už objektinę saugyklą ar CDN kiekvienam projektui.

Ką darėme

Backend, keliantis failus į Telegram per MTProto protokolą (naudojant jį kaip nemokamą saugyklą), ir Vue administravimas mediją tvarkyti bei atiduoti; pristatymas prieky, kad failai kraunasi greitai.

Rezultatas

Medija gyvena Telegram infrastruktūroje be saugyklos kaštų, o programos gauna ir tvarko failus per vieną administravimą, o ne mokamą „bucket“.

Dev-story straipsnis

Kaip buvo kuriamas projektas: CDN ir medijos pristatymas

Telegram nemokamai laikys neribotą kiekį failų, bet tai nėra CDN: jis stabdo per FLOOD_WAIT, neturi viešo aptarnavimo modelio ir nieko nežino apie naršyklės CORS ar kešavimą. Šio projekto įtampa — paversti pokalbių saugyklą kažkuo, ką realus front-end gali daužyti 400+ paveikslėlių užklausų viename puslapyje, neribojant paskyros greičio ir neatskleidžiant vieno vartotojo failų kitam. Didžioji darbo dalis yra kraštinis sluoksnis prieš MTProto, o ne pati saugykla.

Skyriai

Moduliai

Stackas

JavaScript + Vue

Kodėl projektas atsirado

Norėjome kur laikyti ir atiduoti produktų mediją nemokant už objektinę saugyklą ar CDN kiekvienam projektui.

Ką sukūrėme

Medijos saugykla, kur įkelti failai atsiduria Telegram paskyros Saved Messages, o kiekvienas failas grąžinamas per viešą URL. Node servisas ant uWebSockets.js kalbasi MTProto per gramjs, srautina failo baitus ir ištraukia miniatiūras; Nginx sluoksnis kešuoja beveik kiekvieną atsakymą, tad Telegram pasiekiamas retai; o Vue skydelis tvarko aplankus, paiešką, perkėlimą, šiukšliadėžę ir projektų API raktus. Veikia ant dviejų VPS mazgų už HAProxy.

Pagrindiniai moduliai ir vartotojo kelias

M01

MTProto saugyklos adapteris (gramjs ant uWebSockets.js), kuris įkelia į Saved Messages, srautina failo baitus atgal ir persiunčia žinutes tarp aplankų perkėlimui bei paieškai — įskaitant rankiniu būdu pataisytą mime.getExtension, kad atsisiuntimai gautų teisingą failo plėtinį

M02

Nginx kešavimo kraštas, raktuotas pagal Origin plius Vary: Origin antraštė, po to kai be CORS gauti <img> atsakymai buvo kešuojami ir vėliau klaidingai atiduodami fetch() užklausoms, kurioms reikėjo CORS antraščių

M03

Autentifikacija ir apsauga nuo piktnaudžiavimo: telefono numerio baltasis sąrašas siunčiant kodą, 3 kodai per 10 minučių, kad nesukeltų Telegram FLOOD_WAIT paskyrai, eksponentinis atidėjimas prie neteisingų slaptažodžių ir greičio ribojimai pagal IP, pakelti iki 300 r/m su burst 100 paveikslėliais apkrautiems puslapiams

M04

Vieši be autentifikacijos miniatiūrų taškai (/thumb, /vthumb), nes <img src> negali siųsti Bearer žetono — vaizdo kadrai ištraukiami su ffmpeg ir kešuojami kaip jpg

M05

Dviejų mazgų HAProxy konfigūracija su stick-table, pririšančia kiekvieną klientą prie vieno backend, nes skydelio žetonai gyvena atminties Map kiekviename mazge, o viešas failų aptarnavimas lieka be būsenos abiejuose

Architektūra ir technologiniai sprendimai

Sukurta su JavaScript, Vue, Edge delivery.

Node ant uWebSockets.js, kalbantis MTProto per gramjs, priešais kurį Nginx kešavimui ir saugumo antraštėms bei HAProxy dviejų mazgų round-robin su lipniomis sesijomis; front-end yra Vue su nedidele IndexedDB paremta aplankų saugykla ir savo darytu stale-while-revalidate užklausų kešu vietoje TanStack Query.

Rezultatas ir pamokos

Medija gyvena Telegram infrastruktūroje be saugyklos kaštų, o programos gauna ir tvarko failus per vieną administravimą, o ne mokamą „bucket“.

Veikiantis, savarankiškai talpinamas medijos CDN, paremtas nemokama Telegram saugykla, sukietintas per ilgą realių CORS, kešavimo ir autentifikacijos klaidų uodegą; sąžiningai — dviejų mazgų prototipas, o ne flotilė, bet toks, kuris aptarnauja programos masto paveikslėlių biblioteką be saugyklos sąskaitos.