Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 24.03.2020, 15:50
Аспирант
Отправить личное сообщение для Sergey and Посмотреть профиль Найти все сообщения от Sergey and
 
Регистрация: 06.12.2016
Сообщений: 44

как загрузить файл в input без открытия окна
Здравствуйте
Подскажите как загрузить файл в input type = file без открытия окна выбора файлов(without opendialog)? Сылка на файл который нужно загрузить есть в img.src
let input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('multiple', ' false');
input.setAttribute('value', img.src);
let form = document.createElement('form');
form.setAttribute('method', 'POST');
form.setAttribute('enctype', 'multipart/form-data');
form.setAttribute('action', 'savebd.php');
form.appendChild(selpart);
form.appendChild(rfidid);
form.appendChild(mannumb);
form.appendChild(maxcikle);
form.appendChild(partname);
form.appendChild(countpart);
form.appendChild(dcreatedat);
form.appendChild(input);
document.body.appendChild(form);
form.submit();

Последний раз редактировалось Sergey and, 24.03.2020 в 20:23.
Ответить с цитированием
  #2 (permalink)  
Старый 25.03.2020, 04:31
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,709

Сообщение от Sergey and
Подскажите как загрузить файл в input type = file без открытия окна выбора файлов(without opendialog)?
А зачем вам создавать элементы формы, если они не нужны для вывода в интерфейс?

Судя по коду, вы хотите отправить данные на сервер. Для этого вы можете заполнить объект типа FormData данными и отправить его на сервер.

<script>

async function sendData() {
	const fd = new FormData();
	
	// заполнение данными
	fd.append("image", await fetch("https://picsum.photos/30/30").then(r => r.blob()), "image.jpg");
	fd.append("title", "random image");
	
	// отправка
	fetch("https://charm-launch.glitch.me/raw-http", {
		method: "post",
		body: fd
	})
	
	// для примера выводится то, что получил сервер перед обработкой
	.then(r => r.text()).then(raw => document.body.append(raw));
}

sendData();

</script>
<!-- только для данного примера, чтобы посмотреть, что получил сервер, для отправки не нужно  -->
<style>
	body {
		white-space: pre;
		font: 1em Menlo, Monaco, Consolas, monospace;
	}
</style>

Последний раз редактировалось Malleys, 25.03.2020 в 04:35.
Ответить с цитированием
  #3 (permalink)  
Старый 25.03.2020, 07:32
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 638

Сообщение от Sergey and Посмотреть сообщение
Здравствуйте
Подскажите как загрузить файл в input type = file без открытия окна выбора файлов(without opendialog)? Сылка на файл который нужно загрузить есть в img.src
Никак.
Только путем открытия окна диалога или drag-and-drop.
А вы как думаете? Если бы это было возможно, то открытые страницы могли бы произвольно выкачивать на сервер содержимое вашего компьютера.
Ответить с цитированием
  #4 (permalink)  
Старый 25.03.2020, 09:45
Аватар для Malleys
Профессор
Отправить личное сообщение для Malleys Посмотреть профиль Найти все сообщения от Malleys
 
Регистрация: 20.12.2009
Сообщений: 1,709

Сообщение от voraa
Если бы это было возможно, то открытые страницы могли бы произвольно выкачивать на сервер содержимое вашего компьютера
Пишут ведь, что «ссылка на файл который нужно загрузить есть в img.src». Также пишут, что «без открытия окна выбора файлов», а значит локальные файлы не интересны.

Сообщение от voraa
Никак. Только путем открытия окна диалога или drag-and-drop.
Получилось бы, что для отправки файлов нужен <form> с <input type="file">, что заведомо ложно! Читайте про Fetch API и FormData в учебнике Ильи Кантора!
Ответить с цитированием
  #5 (permalink)  
Старый 25.03.2020, 15:09
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 638

Сообщение от Malleys Посмотреть сообщение
Пишут ведь, что «ссылка на файл который нужно загрузить есть в img.src». Также пишут, что «без открытия окна выбора файлов», а значит локальные файлы не интересны.

Получилось бы, что для отправки файлов нужен <form> с <input type="file">, что заведомо ложно! Читайте про Fetch API и FormData в учебнике Ильи Кантора!
Пишут
Подскажите как загрузить файл в input type = file без открытия окна выбора файлов
Кроме того, там в форме много чего другого
form.appendChild(selpart);
form.appendChild(rfidid);
form.appendChild(mannumb);
form.appendChild(maxcikle);
form.appendChild(partname);
form.appendChild(countpart);
form.appendChild(dcreatedat);

Конечно и это можно запихнуть в FormData.
Но отправка через форму предполагает не только отправку на сервер, но и переход на страницу, которую сервер вернет.
Так, что простым fetch не обойтись.

Ну и ко всему прочему
fetch("https://mixnews.lv/wp-content/uploads/2019/11/22/1574367889_0042-e1574430618761.jpg").then(r => r.blob())
У меня вызывает ошибку

Access to fetch at 'https://mixnews.lv/wp-content/uploads/2019/11/22/1574367889_0042-e1574430618761.jpg' from origin 'http://31.***.***.51' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Последний раз редактировалось voraa, 25.03.2020 в 16:13.
Ответить с цитированием
  #6 (permalink)  
Старый 26.03.2020, 09:56
Аспирант
Отправить личное сообщение для Sergey and Посмотреть профиль Найти все сообщения от Sergey and
 
Регистрация: 06.12.2016
Сообщений: 44

На сервер передается ссылка на файл а содержимого нет.
let pic = await fetch(img.src).then(r => r.blob());
fd.append("image",pic,"image.jpg");
 let response = await fetch('savebd.php',{method:'POST',body:fd,credentials: 'include'});

var_dump($_FILES); выводит
Цитата:
array(1) {
["image"]=>
array(5) {
["name"]=>
string(9) "image.jpg"
["type"]=>
string(9) "image/png"
["tmp_name"]=>
string(18) "/var/tmp/php1HXI15"
["error"]=>
int(0)
["size"]=>
int(3481)
}
}

Последний раз редактировалось Sergey and, 26.03.2020 в 10:13.
Ответить с цитированием
  #7 (permalink)  
Старый 26.03.2020, 11:05
Аватар для Aetae
Любитель
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 5,646

Sergey and, всё нормально: ошибок нет, размер есть. А бинарник var_dump тебе не напечатает. Учи php.
__________________
29375, 35
Ответить с цитированием
  #8 (permalink)  
Старый 26.03.2020, 11:31
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 638

Смотри ошибки в консоле браузера.
fetch(img.src).then(r => r.blob());
скорее всего будет выдавать ошибку, если img.src с другого домена.
Ответить с цитированием
  #9 (permalink)  
Старый 26.03.2020, 12:21
Аспирант
Отправить личное сообщение для Sergey and Посмотреть профиль Найти все сообщения от Sergey and
 
Регистрация: 06.12.2016
Сообщений: 44

Да буду учить php. С помощью file_get_contents получилось получить данные.
Ответить с цитированием
  #10 (permalink)  
Старый 26.03.2020, 12:47
Аспирант
Отправить личное сообщение для Sergey and Посмотреть профиль Найти все сообщения от Sergey and
 
Регистрация: 06.12.2016
Сообщений: 44

Сервер получает данные в таком формате (должна быть картинка в blob) можно это проверить к примеру создать динамический img и вставить туда это?
�PNG



IHDRddp�TbKGD�������
NIDATx��{\Te���3�  ����
pS�ZE��/�b*Zj��ie�jny��Z���Zm3��VR��P�;��4EDQG�a��?FYFEf`���o�����<���}�g@BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB�1@f)�^^]\��uza\ii��R��7r��� �
z�E99K���"�xyuqh��-.��o	�V��C�s��E�1���88���������8��[���-QT�b���
�yy��67g�Y�E�%��	S��H��61r9��������q�.�"=D��{�����{������{��}/o/fLG�V>��%_s��"�����)�qoVn�`���3�^J>����+��
��.�7��1�ԁ4��}����g.e_���<т��db�@;�\�(�P�'\��Sާ~���D��k�*T�^f]���m���6i��hǀ~�quu��*Y-��T��� bpOw�h�.''�9�`ŧ�����t���r��%<<ܘ3{�m�O#�l&��no�jY-ģ�����;v�֭����ʾ��sx)zH����z
oa��תw�]=�IxsaqAT�&�2qo�ZH�������3/G�������_��H�)�O#=��o�V��`oO������3�Y\]���ժ�S��J¥w_drE�6�`@�k~�������H���o���l>sr��e;�R0Ċ�666���͍|���+�)2��;=f(Oy�W�u�
�X�=�3�0��g(�rZ��`�i��Yq}��iFO��;��؆ ���m%&6� bggˀ~!�
�N�n�Uz�(�\��G�v$%�s������җG��l���G�h�f�Ī)**f鲯9y�
�����x��xxT=����B�KS�5S3b�@FH�U
˗�!.>�������Ȭ�'�����y(�v�*))e���9�������_,&((���,�o�F�}���AagJKpk�C��Pƿ0�b��z�)S�r㆖V�>,�7�ƍ2����R� ������eЮm+���<=��h���d��B٭7vAϠl��F	�X�G�y��ߎP�������h����*�\���ɳH?{��Y8z��i,%�U�N�L$--�ZU!���	:��{TKV�<j,�~m+���(��k���q�.Yɡ�F������j��5KQ�U��9OL��l�i�N����l�݊B!��,�#j�l�L�i�Xdv��w�i�8l�L$�����C
9�q۸|�z=��vX� ������9bAAh4Z��2��_îsp���=�ÄW���n��ܥ#/� |����nXt�>�.|;wc>XG��wVN�$r�Zl�
v%m��C�ԙ��g��)rL��T��z������^��',��R]�|�c�9�ր�d�!q�s�%���`��xx����b瞃�,y��@�����w�8$���q�B6�Z5�W��lݾ�w{u ��鐎):|����<V5d�\6�'�� ��DlCz��3�ٙ�,�?r'E�;)���>��RV��2{lCz�S"a��e�d]g"V%ȉ\� !]�sſ�a���m�Y��t�z��`K��ЫG��G��Y�3�A��K�>�w3�q�J��[Q7,:d=J�V*���.���լK���9�F���_�@׈A׺�(��و�����n�Knf6�(��B�TRP��(�
�[6�}�t????� ���=�mvQ!���wwWd2���v�U�EgN���y�nu�ۇ�W�GA�{6~2�-�Fv��ť	nn�
c��[�:4�Vm�h��ie�j�c�@�0�X+�֮ٝ�������:X��<ʯH��"�"M�:�/-E,�W�%r9�Iٹ��!���:����z���a��h��	A�h���o���1��Wyf���0/�2+���� ���ʾ_��:4-��x���V�El��V�m<*����g��p81���E�����3/����L���y�����Y�θ�*Y�Vy&""^�ގ�~ɵj��bUC֟��H>�@D�P8q�F[e�̚ǎ=��?b�#�ص� �w�c�Ӣ�g��G�>+�ѾMcs7�NX� ��HJ4.M�F��4ybI��C��-Q�|�5����w��|Ϥ��bJ��ahDX�2�[W�Q��N��)/>[<���נP(ؙ��n̜����F(G��S���7��Q��!7�:��FSV���N�<$�k��e��5|�d�g����^��U[lLl�>�;��~��O?���2�C����/=�ϻ�!�ƪ�,����T��@J�I�jkW/�d�j�;Rk�c�)��%߬^�JՔ#GO��6r9�G=o��
���ۃQ��S��˕+�lǿ����u�q�L�)�n#�nDܼ���-# �-W�\���"�#Ԙ���X� Ç���Ǎ�L�4�B����j��ֻ�Q��.#Q��y@��Н�6�(��=����r��U^�8������9�[h�<S�;IVr�|6j���XDpcn������$�q�|�w�u%���nAx�P�F���k�9z��^�K^^�Z���})��0���䩳(r^�[oM��í�]~~!..U�ss��l���oE:�e֌�89�}��D
�D��-��!�WA�Q#[���V%Q�rl�ڵ<�L!)q����L�B�`�о��d�7����E�\ƨȁt	"&v+��SIض��m��;��w�)��ݓJ*����N�����M�5a�����ӝ7��g������"�Xg�]���mr�i*�h�Ɨ�?z�>�Je:��yl�������=������"A���{�F
\ú��	r/J�
j�uţ��c/�9��/d�Ɵ�/,"�ϟ	
���sY|�6���"z��b�`�r���`���f鲵�����t{6m���i���Y��?	�ґ�C9q2�m��9���C������)��*ї��̺����&M�h@H�.�~2�����$`0��5�����с��ll����R�@�+7��lHCV%�r9�u�Թ
Z�����P��o($AggG4�|�+ŸT�M�j0h���F���Ə���bHL�_qͣ���mY�.�_v��� ���m�XdR��A�^�G��!����ۧ+Ow�@�=�'�9}<ǎ���2�a�N��쳼e�Q2�v'N�%�΋�֎Zմ�5�LF����|��q��v���������ܜ@����i%��rW�����q��T�߱���U_~�pE>),���s��"K����[�$ ��%�[2HtU�
JMM�?�����V����r�^����p揱	-���}�V�M7���/n�LJ��IEND�B`�
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как сделать маску телефона в input c +7(___) без jQuery sovsem-nub Элементы интерфейса 67 24.10.2020 11:34
Как загрузить данные со стороннего сайта без инета? Olekos Серверные языки и технологии 7 20.09.2016 21:57
Как правильно очистить maxlength в input? Маэстро Events/DOM/Window 10 22.06.2011 18:14
Как загрузить xml из вышележащей директории без обращения к серверу? Parez Общие вопросы Javascript 11 06.05.2011 22:45
Разным элементам input - разное форматирование. Как? eclipse (X)HTML/CSS 1 25.10.2007 13:55