Kuidas JavaScripti abil faile Firebase’i salvestusruumi üles laadida

Firebase on veebi- ja mobiilirakenduste arendusplatvorm, mis töötati välja 2011. aastal ja mille hiljem omandas Google. Firebase pakub arendajatele laia valikut teenuseid ja tööriistu – mõned neist tasuta. See pakub salvestusruumi ja andmebaasi, mis vähendab serveripoolset sõltuvust ja kõrvaldab failide käsitlemise probleemi absoluutse miinimumini. See Selgitatud aitab teil luua konto ja seejärel kasutada API-d failide Firebase’i salvestusruumi üleslaadimiseks.

1
Seadistage Firebase’i konto. Looge Firebase’i konto, kui te pole seda veel loonud. Minge konsooli ja lisage uus projekt. Täitke hea nimi ja looge projekt.

2
Lisage Firebase oma veebirakendusse. Teise võimalusena saate Firebase’i lisada Androidi rakendusele/iOS-i rakendusele. Kui kasutate rakenduse koostamiseks JavaScripti raamistikku, peaksid sammud olema üsna sarnased. Kopeerige konfiguratsiooniandmed oma HTML-koodi ja seejärel saate kasutada AJAX-i andmete edastamiseks Firebase’i salvestusruumi.

3
Valige salvestusvalikud. Firebase võimaldab teil määratleda reeglid selle kohta, kuidas soovite oma faile salvestada, ja määrata neile juurdepääsu juhtelemendid. Failid salvestatakse Google Cloud Storage’i. Teise võimalusena saate salvestada Firebase’i failide viited ja seejärel kasutada failide tegelikuks salvestamiseks mõnda muud pilvesalvestuse infrastruktuuri. Näiteks saate integreerida Firebase’i Amazon S3-ga failide salvestamiseks või Cloudinaryga JavaScripti piltide salvestamiseks.

4
Seadistage keskkond. Enamikul suurematel esiotsa JavaScripti teekidel, nagu React, Angular ja Vue, on populaarsed teegid, mis integreerivad need Firebase’iga. Kui teie kasutajaliidese teegis on Firebase’i moodul, näiteks AngularFire for Angular, peaksite kaaluma selle kasutamist. Selles artiklis kirjutame AJAX-failide üleslaadija skripti, et lükata failid Firebase’i salvestusruumi .

5
Looge oma veebirakenduses Firebase’i salvestusruumi viide. See on oluline, kui teil on vaja juurdepääsu Firebase’i salvestusruumile. const ref = firebase.storage().ref();

6
Looge sisestusväli. Kui see on tehtud, avage sisendist [type=â€fileâ€] juurdepääs failile, mis tuleb üles laadida. Kui kasutate jQueryt, näeb kood välja selline. const fail = $(‘#foto’).get(0).failid[0];

7
Valmistage failid ette. Enne faili üleslaadimist peate ette valmistama üleslaaditava faili failinime ja metaandmed. Ei ole soovitatav kasutada failinime ainsa identifikaatorina. Ajatempel on väli, mille saab failinimele lisada: const name = (+uus Kuupäev()) + ‘-‘ + faili.nimi;

8
Loo üleslaadimisülesanne. Faili üleslaadimisülesande genereerimiseks saate seda teha .put () meetodi abil. Põhimõtteliselt on see ülesanne lubadus ja seetõttu saab seda hiljem sama hõlpsalt täita. Siin oleks käsk const task = ref.child(nimi).put(fail, metaandmed);Faili üleslaadimise ülesanne toetab ka mitmeid erinevaid meetodeid, sealhulgas task.resume(), task.cancel() ja task. paus().

9
Too vastus URL-ist. Saate kasutada lubadust, et saada lahendus pärast vastuse saamist. task.then((snapshot) => {
console.log(snapshot.downloadURL);
});

10
Püüdke vead kinni. Võimalik on esineda tõrkeid, mis vajaksid tõrkeotsingut. Selle eest saab üleslaadimistoimingus hoolt kanda, kasutades meetodit .catch() nagu allpool näidatud: task .then((snapshot) => { document.querySelector(‘#someImageTagID’).src = snapshot.downloadURL; }) . catch((error) => { // Vigade loendi leiate aadressilt // https://firebase.google.com/docs/storage/web/handle-errors switch (error.code) { case ‘storage/ unauthorized’: // Kasutajal pole juurdepääsuõigust objekti pausile; juhtum ‘salvestus/tühistatud’: // Kasutaja tühistas üleslaadimispausi; … juhtum ‘salvestusruum/tundmatu’: // Tekkis tundmatu viga katkestus; } })