Ir trīs galvenie veidi, kā apstrādāt failu augšupielādi pakalpojumā Node.js: attēlu saglabāšana tieši serverī, attēla saglabāšana. bināros datus vai base64 virknes datus savā datu bāzē un izmantojot Amazon Web Service (AWS) S3 segmentus, lai saglabātu un pārvaldītu attēlus.
Šeit jūs uzzināsit, kā izmantot Multer, Node.js starpprogrammatūru, lai augšupielādētu un saglabātu attēlus tieši serverī Node.js lietojumprogrammās, veicot dažas darbības.
1. darbība: izstrādes vides iestatīšana
Šajā projektā izmantotais kods ir pieejams a GitHub repozitorijs un to varat izmantot bez maksas saskaņā ar MIT licenci.
Vispirms izveidojiet projekta mapi un pārvietojieties tajā, izpildot šādu komandu:
mkdir vairāku apmācību programma
cd vairāku apmācība
Pēc tam inicializējiet npm savā projekta direktorijā, izpildot:
npm init -y
Tālāk jums būs jāinstalē dažas atkarības. Šai apmācībai nepieciešamās atkarības ir šādas:
- Express: Express ir Node.js ietvars kas nodrošina spēcīgu funkciju kopumu tīmekļa un mobilajām lietojumprogrammām. Tas atvieglo aizmugursistēmas lietojumprogrammu izveidi, izmantojot Node.js.
- Multers: Multer ir ātra starpprogrammatūra, kas vienkāršo attēlu augšupielādi un saglabāšanu serverī.
Instalējiet pakotnes ar mezgla pakotņu pārvaldnieks skrienot:
npm uzstādīt ekspress multeris
Pēc tam izveidojiet an app.js failu sava projekta saknes direktorijā un pievienojiet tālāk esošo koda bloku, lai izveidotu pamata Express serveri:
//app.js
konst izteikt = pieprasīt('izteikt');
konst lietotne = express();
konst ports = process.env. OST || 3000;
app.listen (port, ()=>{
konsole.log(`Lietotne klausās portā ${port}`);
});
2. darbība: Multer konfigurēšana
Pirmkārt, importējiet multeris tavā app.js failu.
konst multeris = pieprasīt("multer");
multeris nepieciešama krātuves programma, kas satur informāciju par direktoriju, kurā tiks saglabāti augšupielādētie faili, un to, kā faili tiks nosaukti.
A multeris uzglabāšanas dzinējs tiek izveidots, zvanot uz diska krātuve metode par importēto multeris modulis. Šī metode atgriež a Uzglabāšanas dzinējs ieviešana, kas konfigurēta failu glabāšanai vietējā failu sistēmā.
Tam nepieciešams konfigurācijas objekts ar divām īpašībām: galamērķis, kas ir virkne vai funkcija, kas norāda, kur tiks saglabāti augšupielādētie attēli.
Otrais īpašums, faila nosaukums, ir funkcija, kas nosaka augšupielādēto failu nosaukumus. Tam nepieciešami trīs parametri: req, failu, un atzvanīšana (cb). req ir Express Pieprasīt objekts, failu ir objekts, kas satur informāciju par apstrādāto failu, un cb ir atzvanīšana, kas nosaka augšupielādēto failu nosaukumus. Atzvanīšanas funkcija izmanto kļūdu un faila nosaukumu kā argumentus.
Pievienojiet tālāk norādīto koda bloku savam app.js failu, lai izveidotu krātuves programmu:
//Notiek krātuves dzinēja iestatīšana
konst storageEngine = multer.diskStorage({
galamērķis: "./images",
faila nosaukums: (req, file, cb) => {
cb(null, `${Datums.now()}--${file.originalname}`);
},
});
Iepriekš esošajā koda blokā jūs iestatāt galamērķis īpašums "./images”, tādējādi attēli tiks saglabāti jūsu projekta direktorijā attēlus mapi. Pēc tam atzvanīšanas laikā jūs izturējāt null kā kļūdu un veidnes virkni kā faila nosaukumu. Veidnes virkne sastāv no laikspiedola, kas ģenerēts, zvanot Datums.tagad() lai nodrošinātu, ka attēlu nosaukumi vienmēr ir unikāli, divas defises, lai atdalītu faila nosaukumu un laikspiedolu, un faila oriģinālo nosaukumu, kuram var piekļūt no failu objektu.
No šīs veidnes iegūtās virknes izskatīsies šādi: 1663080276614--example.jpg.
Tālāk jums ir jāinicializē multeris ar uzglabāšanas dzinēju.
Pievienojiet tālāk norādīto koda bloku savam app.js failu, lai inicializētu multer ar uzglabāšanas dzinēju:
//inicializē multeru
konst augšupielāde = multer({
krātuve: uzglabāšanas dzinējs,
});
multeris atgriež Multer instanci, kas nodrošina vairākas metodes starpprogrammatūras ģenerēšanai, kas apstrādā augšupielādētos failus multipart/form-data formātā.
Iepriekš esošajā koda blokā jūs nododat konfigurācijas objektu ar a uzglabāšana rekvizīts iestatīts uz glabāšanas dzinējs, kas ir iepriekš izveidotā krātuves programma.
Pašlaik jūsu Multer konfigurācija ir pabeigta, taču nav validācijas noteikumu, kas nodrošinātu, ka serverī var saglabāt tikai attēlus.
3. darbība: attēla apstiprināšanas noteikumu pievienošana
Pirmais validācijas noteikums, ko varat pievienot, ir maksimālais pieļaujamais attēla izmērs, ko var augšupielādēt jūsu lietojumprogrammā.
Atjauniniet savu multira konfigurācijas objektu ar tālāk norādīto koda bloku:
konst augšupielāde = multer({
krātuve: uzglabāšanas dzinējs,
robežas: { faila lielums: 1000000 },
});
Iepriekš esošajā koda blokā jūs pievienojāt a robežas īpašums konfigurācijas objektam. Šis rekvizīts ir objekts, kas nosaka dažādus ienākošo datu ierobežojumus. Jūs iestatāt faila lielums rekvizītu, ar kuru ir iestatīts maksimālais faila lielums baitos 1000000, kas ir līdzvērtīgs 1 MB.
Vēl viens validācijas noteikums, ko varat pievienot, ir failu filtrs Īpašums, izvēles funkcija, lai kontrolētu, kuri faili tiek augšupielādēti. Šī funkcija tiek izsaukta katram apstrādātajam failam. Šī funkcija izmanto tādus pašus parametrus kā faila nosaukums funkcija: req, failu, un cb.
Lai padarītu kodu tīrāku un vairāk atkārtoti lietojamu, visu filtrēšanas loģiku abstrahēsiet funkcijā.
Pievienojiet tālāk norādīto koda bloku savam app.js failu, lai ieviestu failu filtrēšanas loģiku:
konst ceļš = pieprasīt("ceļš");
konst checkFileType = funkciju (fails, cb) {
//Atļautie failu paplašinājumi
konst failu tipi = /jpeg|jpg|png|gif|svg/;
//pārbaudiet pagarinājumu vārdus
konst extName = faila tipi.tests (ceļš.ekstnosaukums (file.originalname).toLowerCase());
konst mimeType = fileTypes.test (file.mimetype);
if (mimeType && extName) {
atgriezties cb(null, taisnība);
} cits {
cb("Kļūda: jūs varat augšupielādēt tikai attēlus!");
}
};
The pārbaudiet FileType funkcijai ir nepieciešami divi parametri: failu un cb.
Iepriekš esošajā koda blokā jūs definējāt a failu tipi mainīgais, kas saglabā regex izteiksmi ar atļautajiem attēla faila paplašinājumiem. Pēc tam jūs piezvanījāt uz pārbaude metode regulārajai izteiksmei.
The pārbaude metode pārbauda atbilstību nodotajā virknē un atgriež taisnība vai viltus atkarībā no tā, vai tā atrod atbilstību. Pēc tam jūs nododat augšupielādētā faila nosaukumu, kuram varat piekļūt file.originalname, ceļa modulī extname metodi, kas atgriež tai virknes ceļa paplašinājumu. Visbeidzot, jūs ķēdē JavaScript mazajiem burtiem virknes funkciju izteiksmei, lai apstrādātu attēlus ar to paplašinājumu nosaukumiem ar lielajiem burtiem.
Ar paplašinājuma nosaukuma pārbaudi vien nepietiek, jo paplašinājumu nosaukumus var viegli rediģēt. Lai nodrošinātu, ka tiek augšupielādēti tikai attēli, jums ir jāpārbauda MIME veids arī. Jūs varat piekļūt failam mimetips īpašumu caur file.mimetype. Tātad, jūs pārbaudiet, vai mimetips īpašumu, izmantojot pārbaude metodi, kā to darījāt paplašinājumu nosaukumiem.
Ja abi nosacījumi ir patiesi, jūs atgriežat atzvanīšanu ar null un patiess, vai arī atzvanāt ar kļūdu.
Visbeidzot, jūs pievienojat failu filtrs īpašums jūsu multira konfigurācijai.
konst augšupielāde = multer({
krātuve: uzglabāšanas dzinējs,
robežas: { faila lielums: 10000000 },
fileFilter: (req, file, cb) => {
checkFileType (fails, cb);
},
});
4. darbība: Multer kā Express starpprogrammatūras izmantošana
Tālāk jums ir jāievieš maršruta apstrādātāji, kas apstrādās attēlu augšupielādi.
Atkarībā no konfigurācijas Multer var apstrādāt gan viena, gan vairāku attēlu augšupielādi.
Pievienojiet tālāk norādīto koda bloku savam app.js failu, lai izveidotu maršruta apstrādātāju viena attēla augšupielādei:
app.post("/single", upload.single("attēlu"), (req, res) => {
ja (req.fails) {
res.send("Viens fails ir veiksmīgi augšupielādēts");
} cits {
res.status (400).send("Lūdzu, augšupielādējiet derīgu attēlu");
}
});
Iepriekš esošajā koda blokā jūs izsaucāt viens metode uz augšupielādēt mainīgais, kas saglabā jūsu multera konfigurāciju. Šī metode atgriež starpprogrammatūru, kas apstrādā "vienu failu", kas saistīts ar doto veidlapas lauku. Pēc tam jūs izturējāt attēlu kā veidlapas lauks.
Visbeidzot pārbaudiet, vai fails tika augšupielādēts, izmantojot req objekts failu īpašums. Ja tā bija, jūs nosūtāt veiksmes ziņojumu, pretējā gadījumā nosūtāt kļūdas ziņojumu.
Pievienojiet tālāk norādīto koda bloku savam app.js failu, lai izveidotu maršruta apdarinātāju vairāku attēlu augšupielādei:
app.post("/multiple", upload.array("attēlus", 5), (req, res) => {
ja (req.faili) {
res.send("Vairāki faili veiksmīgi augšupielādēti");
} cits {
res.status (400).send("Lūdzu, augšupielādējiet derīgus attēlus");
}
});
Iepriekš esošajā koda blokā jūs izsaucāt masīvs metode uz augšupielādēt mainīgais, kas saglabā jūsu multera konfigurāciju. Šī metode izmanto divus argumentus — lauka nosaukumu un maksimālo skaitu — un atgriež starpprogrammatūru, kas apstrādā vairākus failus, kuriem ir vienāds lauka nosaukums. Tad jūs izturējāt attēlus kā koplietotās veidlapas lauks un 5 kā maksimālo attēlu skaitu, ko var augšupielādēt vienlaikus.
Multer izmantošanas priekšrocības
Izmantojot Multer savās Node.js lietojumprogrammās, tiek vienkāršots citādi sarežģītais attēlu augšupielādes un saglabāšanas process tieši jūsu serverī. Multer pamatā ir arī busboy — modulis Node.js ienākošo veidlapu datu parsēšanai, padarot to ļoti efektīvu veidlapu datu parsēšanai.
