Tasuta ES5 / ES6 JavaScripti failide üleslaadimise plugin - Uppy
Üks keerukamaid vormi sisendeid on faili üleslaadimine. Sellel on vaikimisi HTML-stiil, kuid see ei ole maailma kõige ilusam asi.
Uppy võtab failide üleslaadimise täiesti uuele tasemele a kohandatud liides ja a dünaamiline Ajax-laadimisprotsess.
See töötab ES5 / ES6 koodiga, et saaksite oma veebirakendusi ehitada uusimate JavaScript-standarditega. Ja isegi toetab pilvehoidlate saitide üleslaadimist näiteks Dropbox või Google Drive, nii et see on a mitmetahuline failide üleslaadimise skript veebi jaoks.
Uppy on täiesti tasuta ja avatud lähtekoodiga, tagastamisega GitHubis. Siiski on lihtsaim viis selle plugina installimiseks läbi npm või lõnga, nii et saate käivitage see nagu tõeline pakett.
Kui olete oma veebisaidile lisatud failid kätte saanud, siis lihtsalt sisaldama faili Uppy.js ja CSS-koodi. Siis sihite igale soovitud väljale ja Uppy hoolitseb ülejäänud eest.
Sellel on unikaalne liides näeb välja nagu üks suur ruudu paigutus failide lohistamiseks. Sa saad ka valige üksused kõvakettalt või isegi laadige failid välistest URL-idest eemalt. Päris hull!
Kogu seadistamisprotsessi leiate dokumentatsiooni lehelt, kuid seda nõuab vähemalt mõningast arusaamist ECMAScript 6-st. See raamatukogu vaatab skriptimise tulevikku ja ei ole kõige lihtsam kasutada puhta vanilla JavaScriptiga.
Aga kui sa oled tõsiselt veebiarendust, siis tasub õppida ES6-i. Leiad tonni ressursse võrgus iseõpetamiseks ja saate isegi kasutada Uppyt kui esimest “reaalne” sukelduda ja alustada õppimist.
Vaadake juhtpaneeli näidist vaadake Uppy tegevuses. Selle lehe jaoks üleslaadimine on peidetud nupu taga, kui klõpsate nuppu, et kuvada modaalülekande väli.
Sealt saate valida, kas soovite pildi üles laadida arvutist, veebist või isegi teie veebikaamerast!
Leheküljel Näited on võimalik vaadata läbi, sealhulgas a lohista näiteks, koos rahvusvaheline demo lehekülg.
Kuid selleks, et tõesti õppida, kuidas see toimib, soovitan ma dokumentide koorimise ja peamise GitHub repo kaudu sirvimise. Samuti saate oma mõtteid jagada Twitteri @transloadit loojatega.