Fájl kiválasztása - File select

A HTML formátumban a fájlválasztó vezérlés egy webes űrlap összetevője , amellyel a felhasználó kiválaszthat egy helyi fájlt. Az űrlap benyújtásakor (esetleg más űrlapadatokkal együtt) a fájlt feltöltik a webszerverre . Ott, amikor a fájl megérkezik, általában valamilyen műveletre kerül sor, például a fájl mentésére a webszerverre. Azonban az elvégzendő műveletet a kiszolgálóoldali szkript határozza meg , amelyhez az űrlapot benyújtják.

Kód példa

Itt található egy példa egy webes űrlapra, fájl-kiválasztó vezérlővel. Az inputelem type="file"hozza létre a fájlválasztó vezérlőt. 

<form action="form-handler.php" method="post" enctype="multipart/form-data">
	<div>
		<input id="myfile" name="myfile" type="file">
		<input value="Upload ►" type="submit">
	</div>
</form>

vakolás

A fájlválasztó vezérlő képernyőn történő megjelenítését illetően némi eltérés mutatkozik a böngészők között . Általában egy Windows-alapú platformon a felhasználói ügynökök fájlmegadási vezérlőt adnak szöveges mezőként, a "Tallózás" gombbal együtt. A "Tallózás" gomb megnyomásakor megnyílik egy fájl párbeszédpanel , amellyel a tényleges fájl kiválasztható az adott platformon. A kiválasztás után a kiválasztott fájl fájlneve a teljes mezőben megjelenik a szövegmezőben. Alternatív megoldásként a "Tallózás" gomb használata helyett a fájlnév közvetlenül a szövegmezőbe is beírható.

Néhány böngésző, nevezetesen a Firefox , már nem engedi a fájlnév közvetlen beírását . Ez egy biztonsági intézkedés - megtévesztheti a felhasználót a bizalmas információk feltöltésében.

funkcionalitás

Az űrlap alapú fájlfeltöltési mechanizmust eredetileg az RFC 1867 (1995 novemberében közzétett), a HTML 2.0 ( RFC 1866 ) kiterjesztéseként javasolta , a közzétételét követően. Az űrlapalapú fájlfeltöltést ezután beépítették a HTML 3.2-be, amely kifejezetten utal az RFC 1867- re az űrlap-alapú fájlfeltöltésről szóló további információkért.

A HTML 4.01 önmagában nem írja le a fájlválasztó vezérlő működésének, de hivatkozásként felsorolja az RFC 2388 és az RFC 1867- et.

Több fájl kiválasztása

Az RFC 1867 célja, hogy egyetlen fájlválasztó vezérlő lehetővé tegye több fájl kiválasztását. Úgy tűnik, hogy ez a szándék tükröződik a HTML 4.01 HTML-ben, amely a fájlt választó vezérlőtípus számára kijelenti

Ez a vezérlőtípus lehetővé teszi a felhasználó számára a fájlok kiválasztását, hogy azok tartalmát űrlappal lehessen benyújtani. Az INPUT elem a fájlválasztó vezérlő létrehozására szolgál.

Megjegyeztük, hogy a fenti idézetben szereplő több „fájl” azt jelzi, hogy a HTML 4.01 HTML-fájljában az egy fájl kiválasztására szolgáló vezérlésnek több fájl, és nem csupán egyetlen fájl kiválasztását kellett kezelnie.

Ezt a helyzetet a HTML5 tisztítja egy "többszörös" attribútum hozzáadásával, amikor a fájlbemenetnek több fájlt el kell fogadnia. A jelenlegi tervezet meghatározza az új viselkedést:

Ha nem állítja be a többszörös attribútumot, akkor a kiválasztott fájlok listájában nem lehet egynél több fájl.

Fogadja el az attribútumot

Az RFC 1867accept az inputelem attribútumát is bevezette . Ez lehetővé tenné a MIME típus alapján történő fájltípus-szűrést a fájlválasztó vezérléshez.

Ezenkívül azt javasoljuk, hogy az INPUT címke rendelkezzen egy ACCEPT attribútummal, amely vesszővel elválasztott adathordozó-típusok listája.

Ha ACCEPT attribútum van, a böngésző korlátozhatja a kért fájlmintákat, hogy azok megfeleljenek a platform megfelelő fájlkiterjesztéseinek.

Így a felhasználói ügynök korlátozhatja a fájlválasztást, például a következőkben, korlátozva a GIF és PNG képeket vagy bármilyen képet: 

<input id="myfile" name="myfile" type="file" accept="image/gif,image/png">
<input id="myfile" name="myfile" type="file" accept="image/*">

Windows platformon ez azt jelentheti, hogy a felhasználói ügynök csak a Tallózás-fájl párbeszédpanelen megadott fájlokat jeleníti meg.

Böngésző korlátozásai

A fájlválasztó vezérlés alapvető támogatását a böngésző gyártói gyorsan elfogadták. Például, az Internet Explorer 4, a Netscape Navigator 2.0 és az Opera 3.5 már felismerte az inputelem elemét type="file"mint fájl-választó vezérlőt.

A legtöbb modern böngésző azonban még mindig nem hajtja végre a fájlválasztó vezérlőt a kívánt módon, vagy hiányoznak bizonyos funkciók.

Nem lehet több fájlt kiválasztani

Több fájl formátumú feltöltése egyetlen fájlválasztó vezérlővel támogatott a Chrome, a Firefox, az Internet Explorer, a Safari és az Opera jelenlegi verzióiban. Az egyik forrás azt állítja, hogy az Opera támogatja a több fájl kiválasztását egyetlen fájlválasztó vezérlőn keresztül. Ez igaz volt a 3.5-től kezdődő Opera verziókra, amelyekben bevezették a fájlfeltöltési funkciót. Az Opera 7 sorozat első bétaverziójával azonban ez a funkció már nem volt elérhető. A Firefox 3.6 verziója elkezdte a több fájl kiválasztását, lehetővé téve a fejlesztõ számára, hogy korlátozott hozzáférést tudjon magukhoz a fájlokhoz a szerverre történõ feltöltése elõtt a HTML5 File API segítségével. Ez a szolgáltatás lehetővé teszi a felhasználók számára, hogy a fájlokat a külső alkalmazásokból (például a Windows Intézőből ) közvetlenül a webalkalmazásba húzzák . Ennek a szolgáltatásnak az egyik figyelemre méltó példája a Gmail, amely lehetővé teszi a mellékletek ilyen módon történő hozzáadását.

A HTML5 lehetővé teszi több fájl feltöltését a bemeneti elemek több attribútumának felhasználásával .

JavaScript alternatíva

Az egyik megoldás az ügyféloldali szkriptek, például a JavaScriptek használata extra fájlválasztó vezérlő létrehozásához minden egyes fájlhoz, amelyet a felhasználó feltölt. A CSS használatával előfordulhat , hogy ezeket a fájlt kiválasztó további vezérlőket nem jeleníti meg. Ennek a technikának a példáját szemlélteti a jQuery Multiple File Up plugin . Ilyen módon a több fájlból történő feltöltés problémája megoldódik annyi fájlválasztó vezérlő biztosításával, amennyire a felhasználónak fájlokat kell feltöltenie. Ennek ellenére ez nem oldja meg a több fájl feltöltésének az Internet Explorerben való kiválasztásának problémáját.

Fogadja el az attribútumok támogatását

Az elfogadási attribútumot jelenleg az Opera 11+, a Chrome 16+, a Safari 6+, a Firefox 9+ és a Microsoft Internet Explorer 10+ támogatja.

Irodalom

  1. ^ "388784 - (CVE-2007-3511) Firefox fájlbeviteli fókusz, a biztonsági rés ellopása" . Bugzilla.mozilla.org . Beérkezett 2013-09-02 .
  2. ^ "A Mozilla Firefox OnKeyDown eseményfájl-feltöltési biztonsági rése" . Juniper.net. 2010-11-15 . Beérkezett 2013-09-02 .
  3. ^ "HTML 4 specifikációs hivatkozások" . W3.org . Beérkezett 2013-09-02 .
  4. ^ "Űrlapok HTML dokumentumokban" . W3.org . Beérkezett 2013-09-02 .
  5. ^ a b c "Fájlbevitel (vagy" feltöltés "HTML formában") . Cs.tut.fi . Beérkezett 2013-09-02 .
  6. ^ "HTML 5.1 specifikáció" . W3C.
  7. ^ "input type = file Object" . Msdn2.microsoft.com. 2013-07-22 . Beérkezett 2013-09-02 .
  8. ^ a b "Böngésző előzményei: Opera" . Blooberry.com . Beérkezett 2013-09-02 .
  9. ^ 2009. december 10-én Paul Rouget (2009-12-10). msgstr "Több fájlbevitel a Firefox 3.6 - ban. ✩ Mozilla Hacks - a webfejlesztő blogja" . Hacks.mozilla.org . Beérkezett 2013-09-02 .
  10. ^ "Webes alkalmazásokból származó fájlok használata - MDC" . Developer.mozilla.org. 2013-08-23 . Beérkezett 2013-09-02 .
  11. ^ HTML 5.1 specifikáció: 4.10.5.3 Általános bemeneti elem attribútumok

Külső linkek