358 votes

Fichier d’entrée ' accepter ' attribut - est-ce utile ?

Mise en œuvre de chargement d’un fichier sous html est assez simple, mais je viens de m’apercevoir qu’il y a un attribut « accepter » qui peut être ajouté à la `` tag.

Cet attribut est utile comme un moyen de limiter les téléchargements de fichiers d’images, etc. ? Quelle est la meilleure façon de l’utiliser ?

Sinon, y a-t-il un moyen de limiter les types de fichiers, de préférence dans la boîte de dialogue de fichier, pour une balise d’entrée du fichier html ?

460voto

bfrohs Points 9092

L' accept attribut est incroyablement utile. C'est une astuce pour les navigateurs d'afficher uniquement les fichiers qui sont autorisés pour le courant input. Alors qu'il peut généralement être remplacées par les utilisateurs, il permet de limiter les résultats pour les utilisateurs par défaut, de sorte qu'ils peuvent obtenir exactement ce qu'ils recherchent, sans avoir à parcourir une centaine de différents types de fichiers.

Utilisation (démo)

Remarque: Ces exemples ont été écrits basés sur la spécification actuelle et peut ne pas fonctionner dans tous (ou toutes) les navigateurs. La spécification peut également changer à l'avenir, ce qui pourrait briser ces exemples.

<!-- Match all image files (image/*) -->
<input type="file" accept="image/*">

<!-- Match all video files (video/*) -->
<input type="file" accept="video/*">

<!-- Match all audio files (audio/*) -->
<input type="file" accept="audio/*">

<!-- Match all image files (image/*) and files with the extension ".someext" -->
<input type="file" accept=".someext,image/*">

<!-- Match all image files (image/*) and video files (video/*) -->
<input type="file" accept="image/*,video/*">

À partir de la Spécification HTML (source)

L' accept attribut peut être spécifié pour fournir à l'utilisateur des agents avec un soupçon de ce que les types de fichiers sont acceptés.

Si ce paramètre est spécifié, l'attribut doit être composé d'un ensemble d'séparées par des virgules, des jetons, chacun doit être un ASCII de la casse match pour l'une des opérations suivantes:

La chaîne audio/*

  • Indique que les fichiers sonores sont acceptés.

La chaîne video/*

  • Indique que les fichiers vidéo sont acceptés.

La chaîne image/*

  • Indique que les fichiers image sont acceptés.

Un valide, type MIME sans paramètres

  • Indique que les fichiers du type spécifié sont acceptés.

Une chaîne dont le premier caractère est un U+002E ARRÊT COMPLET de caractères (.)

  • Indique que les fichiers avec l'extension de fichier sont acceptés.

98voto

iconoclast Points 3743

Oui, c'est extrêmement utile dans les navigateurs qui le supportent, mais la "limite" est comme une commodité pour les utilisateurs (de sorte qu'ils ne sont pas débordés avec pertinence les fichiers), plutôt que comme un moyen pour les empêcher de télécharger des choses que vous ne voulez pas les télécharger.

Il est pris en charge dans

  • Chrome 16 +
  • Safari 6 +
  • Firefox 9 +
  • IE 10 +
  • Opera 11 +

Voici une liste des types de contenu que vous pouvez utiliser avec elle, suivie par le correspondant des extensions de fichier (bien sûr, vous pouvez utiliser l'extension de fichier):

application/envoy   evy
application/fractals    fif
application/futuresplash    spl
application/hta hta
application/internet-property-stream    acx
application/mac-binhex40    hqx
application/msword  doc
application/msword  dot
application/octet-stream    *
application/octet-stream    bin
application/octet-stream    class
application/octet-stream    dms
application/octet-stream    exe
application/octet-stream    lha
application/octet-stream    lzh
application/oda oda
application/olescript   axs
application/pdf pdf
application/pics-rules  prf
application/pkcs10  p10
application/pkix-crl    crl
application/postscript  ai
application/postscript  eps
application/postscript  ps
application/rtf rtf
application/set-payment-initiation  setpay
application/set-registration-initiation setreg
application/vnd.ms-excel    xla
application/vnd.ms-excel    xlc
application/vnd.ms-excel    xlm
application/vnd.ms-excel    xls
application/vnd.ms-excel    xlt
application/vnd.ms-excel    xlw
application/vnd.ms-outlook  msg
application/vnd.ms-pkicertstore sst
application/vnd.ms-pkiseccat    cat
application/vnd.ms-pkistl   stl
application/vnd.ms-powerpoint   pot
application/vnd.ms-powerpoint   pps
application/vnd.ms-powerpoint   ppt
application/vnd.ms-project  mpp
application/vnd.ms-works    wcm
application/vnd.ms-works    wdb
application/vnd.ms-works    wks
application/vnd.ms-works    wps
application/winhlp  hlp
application/x-bcpio bcpio
application/x-cdf   cdf
application/x-compress  z
application/x-compressed    tgz
application/x-cpio  cpio
application/x-csh   csh
application/x-director  dcr
application/x-director  dir
application/x-director  dxr
application/x-dvi   dvi
application/x-gtar  gtar
application/x-gzip  gz
application/x-hdf   hdf
application/x-internet-signup   ins
application/x-internet-signup   isp
application/x-iphone    iii
application/x-javascript    js
application/x-latex latex
application/x-msaccess  mdb
application/x-mscardfile    crd
application/x-msclip    clp
application/x-msdownload    dll
application/x-msmediaview   m13
application/x-msmediaview   m14
application/x-msmediaview   mvb
application/x-msmetafile    wmf
application/x-msmoney   mny
application/x-mspublisher   pub
application/x-msschedule    scd
application/x-msterminal    trm
application/x-mswrite   wri
application/x-netcdf    cdf
application/x-netcdf    nc
application/x-perfmon   pma
application/x-perfmon   pmc
application/x-perfmon   pml
application/x-perfmon   pmr
application/x-perfmon   pmw
application/x-pkcs12    p12
application/x-pkcs12    pfx
application/x-pkcs7-certificates    p7b
application/x-pkcs7-certificates    spc
application/x-pkcs7-certreqresp p7r
application/x-pkcs7-mime    p7c
application/x-pkcs7-mime    p7m
application/x-pkcs7-signature   p7s
application/x-sh    sh
application/x-shar  shar
application/x-shockwave-flash   swf
application/x-stuffit   sit
application/x-sv4cpio   sv4cpio
application/x-sv4crc    sv4crc
application/x-tar   tar
application/x-tcl   tcl
application/x-tex   tex
application/x-texinfo   texi
application/x-texinfo   texinfo
application/x-troff roff
application/x-troff t
application/x-troff tr
application/x-troff-man man
application/x-troff-me  me
application/x-troff-ms  ms
application/x-ustar ustar
application/x-wais-source   src
application/x-x509-ca-cert  cer
application/x-x509-ca-cert  crt
application/x-x509-ca-cert  der
application/ynd.ms-pkipko   pko
application/zip zip
audio/basic au
audio/basic snd
audio/mid   mid
audio/mid   rmi
audio/mpeg  mp3
audio/x-aiff    aif
audio/x-aiff    aifc
audio/x-aiff    aiff
audio/x-mpegurl m3u
audio/x-pn-realaudio    ra
audio/x-pn-realaudio    ram
audio/x-wav wav
image/bmp   bmp
image/cis-cod   cod
image/gif   gif
image/ief   ief
image/jpeg  jpe
image/jpeg  jpeg
image/jpeg  jpg
image/pipeg jfif
image/svg+xml   svg
image/tiff  tif
image/tiff  tiff
image/x-cmu-raster  ras
image/x-cmx cmx
image/x-icon    ico
image/x-portable-anymap pnm
image/x-portable-bitmap pbm
image/x-portable-graymap    pgm
image/x-portable-pixmap ppm
image/x-rgb rgb
image/x-xbitmap xbm
image/x-xpixmap xpm
image/x-xwindowdump xwd
message/rfc822  mht
message/rfc822  mhtml
message/rfc822  nws
text/css    css
text/h323   323
text/html   htm
text/html   html
text/html   stm
text/iuls   uls
text/plain  bas
text/plain  c
text/plain  h
text/plain  txt
text/richtext   rtx
text/scriptlet  sct
text/tab-separated-values   tsv
text/webviewhtml    htt
text/x-component    htc
text/x-setext   etx
text/x-vcard    vcf
video/mpeg  mp2
video/mpeg  mpa
video/mpeg  mpe
video/mpeg  mpeg
video/mpeg  mpg
video/mpeg  mpv2
video/quicktime mov
video/quicktime qt
video/x-la-asf  lsf
video/x-la-asf  lsx
video/x-ms-asf  asf
video/x-ms-asf  asr
video/x-ms-asf  asx
video/x-msvideo avi
video/x-sgi-movie   movie
x-world/x-vrml  flr
x-world/x-vrml  vrml
x-world/x-vrml  wrl
x-world/x-vrml  wrz
x-world/x-vrml  xaf
x-world/x-vrml  xof

35voto

CMS Points 315406

Accepter attribut a été introduit dans la RFC 1867, avec l'intention d'activer le fichier de type filtrage basé sur le type MIME du fichier-sélectionnez contrôle. Mais la plupart, si pas tous, les navigateurs ne font pas usage de cet attribut. À l'aide de script côté client, vous pouvez faire une sorte d'extension en fonction de validation, pour soumettre des données de type (extension).

D'autres solutions pour l'avancée du téléchargement du fichier Flash besoin des films comme SWFUpload ou des Applets Java comme JUpload.

27voto

magikMaker Points 219

Il est soutenu par Chrome. Il n’est pas censé être utilisé pour la validation, mais pour le type hinting de l’OS. Si vous avez un `` attribut dans le chargement d’un fichier du système d’exploitation affichent uniquement les fichiers du type proposé.

12voto

Kevin Fee Points 303

Il y a quelques années, et Chrome, tout au moins, l'utilisation de cet attribut. Cet attribut est très utile d'un point de vue de l'utilisabilité comme il va filtrer les fichiers inutiles pour l'utilisateur, ce qui rend leur expérience plus lisse. Toutefois, l'utilisateur peut toujours sélectionner "tous les fichiers" dans le type (ou de contourner le filtre), donc vous devez toujours valider le fichier où il est utilisé; Si vous l'utilisez sur le serveur, valider avant de l'utiliser. L'utilisateur peut toujours contourner un script côté client.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X