Question

Does anyone know how to use the accept attribute in input tags? I can see it documented, but w3schools indicates that it is not supported by any of the major browsers. Testing also confirms this.

I know that validation should be done server-side, and am doing that now. But it'd be nice to have it restrict the types of files in the file upload dialog for usability.

Edit: I am fully aware of the security implications of client-side only validation. I do not intend to remove server-side validation and am looking for a way to improve usability.

Was it helpful?

Solution

The reason why browsers don't actually implement the ACCEPT attribute is that MIME type validation is a science and not just as easy as reading a file extension. Even server-side MIME type verification can be difficult as noted by MediaWiki:

http://www.mediawiki.org/wiki/Manual:Mime_type_detection

Notice they attempt to verify the MIME type even server-side.

OTHER TIPS

This attribute is supported by every major browser. Useful links are-- caniuse.com

w3 schools browser support for accept attriute

Thought it would be helpful for someone who wants to know about the browser support of HTML accept attribute.

The most pedantic reason is that it's not required by the HTML4 specification (emphasis mine):

This attribute specifies a comma-separated list of content types that a server processing this form will handle correctly. User agents may use this information to filter out non-conforming files when prompting a user to select files to be sent to the server.

It's an optional feature.

I would personally love to see this. When given image/*, for example, the browser could bring up the user's photo library as the default location and use large icons. text/* could go to the documents folder, etc. Mobile browsers, such as the iPhone, which typically don't allow file uploads at all, could use this to bring up the gallery when the form is expecting an image. We could get crazy and connect to the scanner if desired. The possibilities are endless.

However, this feature is not in common use, and it could be terribly confusing for file upload dialogs to operate differently depending on what the web site supports.

Supporting this tag would mean implementing a way for the browser to determine the MIME type of a local resource, and this would incur a fair amount of heuristics and possible exposure to code injection and/or other vulnerabilities, that browsers already have their fair share of.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top