Javascript mime/type ellenőrzés

Javascript mime/type ellenőrzés
2020-11-27T16:16:50+01:00
2020-11-30T07:32:09+01:00
2022-10-15T21:26:00+02:00
GZolee79
Sziasztok!

Megint hozzátok fordulnék segítségért.
Javascripttel szeretném ellenőrizni egy fájl típusát, de úgy hogy ha valaki átnevezi, akkor is felismerje.
Ehhez a mime/type-t szeretném megvizsgálni.

Ehhez a net segítségével találtam megoldást, de valamiért az eredményét nem tudom kinyerni :)
Ezeket a kódokat az input mező OnChange eseményébe szeretném beletenni.:
Ez a kód visszaadja a file valós típusát.  

function CheckMimeType() { var Filetype = document.getElementById("img_type"); var input = document.getElementById("input_image"); var blob = input.files[0]; var fileReader = new FileReader(); fileReader.onloadend = function(e) { var arr = (new Uint8Array(e.target.result)).subarray(0, 4); var header = ""; for(var i = 0; i < arr.length; i++) { header += arr[i].toString(16); } console.log(header); switch (header) { case "89504e47": type = "image/png"; break; case "47494638": type = "image/gif"; break; case "ffd8ffe0": case "ffd8ffe1": case "ffd8ffe2": case "ffd8ffe3": case "ffd8ffe8": type = "image/jpeg"; break; default: type = "unknown"; break; } console.log(type); Filetype.value = type; }; fileReader.readAsArrayBuffer(blob); return Filetype; }
Ennek a fentinek az eredményét a consolba beleírja, viszont sehogy sem sikerült beletenni se változóba, se egy html mezőbe és felhasználni egy másik funkcióban.

Így próbáltam:

function proba() { var FileType document.getElementById("img_type"); FileType.value = CheckMimeType(); alert(FileType.value) //Ellenőrzöm, hogy belekerült e típusa) }
Mindkét alprogramot az onchange eseménybe teszem.
Gyanítom, hogy valami a futtatás sorrendjével lehet mert az előző függvényben ott van az onloadend...

Valami megoldást tudtok a problémára? :)

Előre is köszönöm a segítséget!

Üdv:
Z.
Mutasd a teljes hozzászólást!
Hali!

Amúgy csak azt szeretném, hogy ha program minden ellen védve lenne ami hibát okozhat.

Ahhoz nem kell ilyen vizsgálat, mert úgysem tölti be a canvas-ra a „képet”, ha az nem kép. Az (on)error is csak azért kell(het), hogy hibajelzést adj.

Egyébként azért nem adtam meg (on)Error eseménykezelőt, mert azt sem tudom, hogy mikor fut le.

Akkor, amikor egy fájl betöltése során bármilyen hiba keletkezik (így pl. akkor is, ha egy Image-objektumnak/-ba nem kép-tartalmat szeretnél meg-/beadni).

Mikor egy átnevezett fájlal próbáltam becsapni, simán lefutott és a kép helyére be is szúrt egy "pacát" ami a fájlt jelképezi, nem dobott hibaüzenetet.

Nem szúrt be semmit a kép helyére, azt a böngésző mutatja, ha nem tudja a képet megjeleníteni (mert pl. képet adsz meg). Hibaüzenetet nem is fog dobni ilyen esetben.

A korábbi példát módosítottam, nézd meg: JSFiddle.

Mutasd a teljes hozzászólást!

  • Hali!

    Ha a korábbi témádhoz kapcsolódik ez a kérdés: van értelme ezzel foglalkozni? Miért nem adsz meg a dinamikusan létrehozott Image() objektumnak egy (on)error esemény-kezelőt is? Ha betöltéskor hiba keletkezik (ami, természetesen, nem csak amiatt lehet, hogy nem kép a kiválasztott állomány), akkor tudod kezelni.

    Szerintem ez bőségesen elegendő (persze, a HTML file input mezőnek adott accept attribútum mellett, amivel szűkítheted a fájlkiválasztásnál a típust).

    Mutasd a teljes hozzászólást!
  • Szia!
    A megoldás igazából nagyon egyszerű:

    Filetype.value=type;
    ezt a sort kell átírnod

    return type;
    erre, vagy csak a funkció végére  írod ezt a sort. (Utóbbit azért nem ajánlom mert akkor egy fölösleges változónevet is lefoglalsz.)

    A hiba ot volt hogy a CheckMimeType() funkció nem adott vissza értéket egyáltalán, de te ezt elvártad tőle.

    Amúgy hogyha egy kép épségére vagy csak kíváncsi, akkor Netangel válasza is jó.
    Mutasd a teljes hozzászólást!
  • Hali!

    Igen, a korábbi témához kapcsolódik de szerintem másik kódban is fel tudnám használni, ha működne. 
    Egyébként lehet, hogy tényleg túlbonyolítom a dolgokat, hajlamos vagyok rá sajnos
    Amikor megnézem a példakódjaidat sokszor meglepődök, hogy ez így is lehet...
    Általában tömörebb és átláthatóbbak mint az enyéim...
    Amúgy csak azt szeretném, hogy ha program minden ellen védve lenne ami hibát okozhat.
    Egyébként azért nem adtam meg (on)Error eseménykezelőt, mert azt sem tudom, hogy mikor fut le.
    Mikor egy átnevezett fájlal próbáltam becsapni, simán lefutott és a kép helyére be is szúrt egy "pacát" ami a fájlt jelképezi, nem dobott hibaüzenetet. Igaz azt nem canvasra rajzoltam hanem betöltöttem egy <img> tag-be.
    Lehet canvas-nál dobott volna.
    Mindenesetre ez az (on) error jó öltlet!
    Accept attribútum volt beállítva de ez az átnevezett fájlokon  nem segít...
    Mutasd a teljes hozzászólást!
  • Szia!

    Próbáltam, de nem megy. Ha oda ahová mondtad beírom, hogy return type, akkor a másik függvényben még nincs eredménye.
    Gondolom a sorrenddel rontok el valamit, vagy nem mindegy, hogy milyen eseményhez írom...
    Mutasd a teljes hozzászólást!
  • Hali!

    Amúgy csak azt szeretném, hogy ha program minden ellen védve lenne ami hibát okozhat.

    Ahhoz nem kell ilyen vizsgálat, mert úgysem tölti be a canvas-ra a „képet”, ha az nem kép. Az (on)error is csak azért kell(het), hogy hibajelzést adj.

    Egyébként azért nem adtam meg (on)Error eseménykezelőt, mert azt sem tudom, hogy mikor fut le.

    Akkor, amikor egy fájl betöltése során bármilyen hiba keletkezik (így pl. akkor is, ha egy Image-objektumnak/-ba nem kép-tartalmat szeretnél meg-/beadni).

    Mikor egy átnevezett fájlal próbáltam becsapni, simán lefutott és a kép helyére be is szúrt egy "pacát" ami a fájlt jelképezi, nem dobott hibaüzenetet.

    Nem szúrt be semmit a kép helyére, azt a böngésző mutatja, ha nem tudja a képet megjeleníteni (mert pl. képet adsz meg). Hibaüzenetet nem is fog dobni ilyen esetben.

    A korábbi példát módosítottam, nézd meg: JSFiddle.

    Mutasd a teljes hozzászólást!
  • Ezt próbáltad?

    jsfiddle

    Itt az upload.php (persze lehet finomítani és itt is ellenőrizni kell a fájlokat)

    foreach ($_FILES["files"]["error"] as $key => $error) { if ($error == UPLOAD_ERR_OK) { $name = mb_convert_encoding($_FILES['files']['name'][$key], 'ISO-8859-2', 'UTF-8'); $name = strtolower($name); $tmp_name = $_FILES["files"]["tmp_name"][$key]; $getimagesize = getimagesize($tmp_name); $file_width = $getimagesize[0]; $file_height = $getimagesize[1]; $file_type = $_FILES["files"]["type"][$key]; $file_size = $_FILES["files"]["size"][$key]; $pathinfo_file = pathinfo($name); $file_name = $pathinfo_file['filename']; $file_extension = $pathinfo_file['extension']; $full_filename = $file_name.'.'.$file_extension; move_uploaded_file($tmp_name, 'upload/'.$full_filename); } }

    Mutasd a teljes hozzászólást!
  • Hali!

    A PHP része az megy. A lényeg az volt, hogy, feltöltés előtt ellenőrizzem a képet.

    De ez is jól fog jönni később, úgy hogy köszi! :)

    Üdv:
    Z.
    Mutasd a teljes hozzászólást!
  • Hali!

    Köszi, segítséget. Sikerült megoldani! 
    Valahogy mostanában mindig te adod a megoldást a kérdéseimre.

    Üdv:
    Z.
    Mutasd a teljes hozzászólást!
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd