Показать пользовательский текст для примененных фильтров типов файлов в диалоговом окне файла для загрузки определенной категории файлов

Следующее позволит пользователям выбирать только определенную категорию файлов изображений.

<input id="file" type="file" name="file" size="30" 
       accept="image/jpg,image/png,image/jpeg,image/gif"
/>

Но проблема заключается в том, что в качестве файла будет отображаться "Пользовательские файлы" как описание файла в диалоговом окне файла, которое путает пользователей о том, какой тип файла они должны выбрать.

Мой вопрос: есть ли лучший способ изменить текст "Пользовательские файлы" на "Файлы изображений"

Примечание. Если я предоставляю "image/*", который будет показывать "Файлы изображений" в описании файла, но я НЕ ХОЧУ ПОЗВОЛЯТЬ пользователю, чтобы выбрать ВСЕ типы файлов изображений, просто захотите ограничить указанные форматы.

Спасибо за ваше мнение заранее.

Ответ 1

Короткий ответ

Как я и ожидал, это невозможно . <input type="file" /> является одним из наиболее защищенных элементов браузера и, следовательно, наименее адаптируемыми элементами браузера. Причина, по которой эти браузеры обрабатывают входные файлы с такой большой осторожностью, заключается в том, что они не захотят рисковать злоумышленниками, обращающимися к вашим файлам (даже если ваша структура папок будет плохая).

Длинный ответ

Возможно, вы не сможете свободно изменять текст, видимый в поле фильтра, но есть надежда. Фактически, в некоторых ситуациях можно выбрать текст, который появляется. Один большой недостаток заключается в том, что это полностью не совместимо с браузером и, возможно, не совместимо с ОС.

Есть и еще одна причина, по которой для браузеров может быть плохой идеей разрешить редактирование этого текста, его можно использовать для ввода в заблуждение пользователей (например, текст, например We're watching you или FATAL WINDOWS ERROR, может напугать пользователей). Кроме того, это не должно, но может привести к возможным эксплойтам, когда пользователи пытаются запустить какой-то C-код в поле, предоставляя им доступ к машинам, что может нанести вред вашему компьютеру катастрофическими способами.

Выше я сказал, что можно изменить видимый фильтр-текст. Ниже я обрабатываю некоторые вещи, которые я пробовал, но не стесняйтесь попробовать это для себя в этом кодексе, который я создал для тестирования: https://codepen.io/JohannesB/pen/vKGoyE

Возможное вдохновение для других типов файлов, которые я не тестировал (не стесняйтесь редактировать это сообщение): fooobar.com/info/19007/...

Выбор параметров приема файлов, которые, как я считаю, могут дать интересные результаты: application/msword, application/rtf, application/octet-stream, application/octet-stream exe, application/zip, text/css, text/html, text/plain

Заметные выводы

Все три браузера отличаются в типах файлов, связанных с image/*, video/* и audio/*
Internet explorer - единственный браузер, который понимает Video/x-msvideo avi
Firefox и хром понимают Aplication/pdf с настраиваемым текстом фильтра, но IE делает noet.
Chrome - единственный браузер, который понимает Text/* и имеет пользовательский текст для .exe
Пользовательские заголовки фильтров никогда не применяются для комбинированных входов ввода, абсолютно не в браузере.

Путь не исследован

Возможно, что для флеш-загрузчиков этот текст настраивается, но я очень сомневаюсь в этом. Кроме того, flash устарел, поэтому, на мой взгляд, это не стоит пытаться.

Результаты эксперимента

Отказ от ответственности. Примеры, используемые ниже, выполнялись на компьютере под управлением Windows 7 с использованием Internet Explorer v11.0.9600, Chrome v51.0.2704.84m и Firefox v46.0.1. Я не могу гарантировать, что они представляют правильную информацию о других операционных системах, других версиях браузера или даже о тех же версиях браузера. Используйте эту информацию с осторожностью.