Аватар для Marrex
0 / 0 / 0
Регистрация: 31.05.2016
Сообщений: 131

Повторная смена картинки и вообще загрузка не работает

03.08.2024, 19:36. Показов 473. Ответов 5
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Привет профессионалам!
Всё работает отлично, только до повторной попытки сменить картинку.
Как это работает и как не работает...
Обычная загрузка файла js на сервер с помощью php, без перезагрузки страницы.
HTML5
1
<input type="file"  id="userfile">
На сервере... упрощенно после всех проверок:
PHP
1
imagepng(imagecreatefromstring( file_get_contents($_FILES['file']['tmp_name'])), 'путь' );
Из php отправляем в return- e файл загружен... отправляем в src img
HTML5
1
<img src="путь"  id="ava" >
Новый адрес картинки = window.URL.createObjectURL(file):
blob: https:// домен.ru/8b92 - много буков и цифр - 852e/
Всё прекрасно срабатывает... картинка заменяется на "blob" - она же на сервере.
Страница не перезагружается...
Новая картинка в "инпуте" - ВСЁ ЗАМЕЧАТЕЛЬНО!
JavaScript
1
2
3
4
5
6
7
      if ( return_data== 'Аватар изменен.' )
      {
          let img = new Image();
          var file = document.getElementById('userfile').files[0];
          img.src = window.URL.createObjectURL(file); 
          document.getElementById('ava') . src = img.src; 
      }
И далее без перезагрузки страницы:
При повторной попытке повторить выше приведенные действия.... ни к чему не приводят.
И никакой ошибки не выдает вообще нигде... т.е. такое ощущение, что все просто зависает... как комп.
Перезагружаю - всё нормально работает после первой отправки, а при второй опять 25...
----
Очищаю инпут userfile .value='';...
Проверяю в post js до console.log не доходит...(естественно, что до php еще целый километр...)
И вообще в первой строке в переменной "file" ничего... пусто...
JavaScript
1
2
3
4
5
  
let file = document.getElementById('userfile').files[0]
let data = new FormData();
data.append('file', file);
console.log(data);
----
Перерыл весь интернет... ни слова нет...
Есть какие-нибудь мысли?
----
Заранее спасибо!
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
03.08.2024, 19:36
Ответы с готовыми решениями:

Не работает смена картинки
&lt;body&gt; &lt;div id=newchar_bg&gt; &lt;form name=&quot;selclass&quot; &gt; &lt;div id=&quot;class&quot;&gt; ...

Не работает смена картинки
хочу менять картинку способом рондома, но не выходит private void button11_Click(object sender, EventArgs e) { ...

Плавная смена картинки - не работает
&lt;div class=&quot;header&quot;&gt; &lt;img class=&quot;logo&quot; style=&quot;transition:0.8s;&quot; src=&quot;/img/logo.png&quot; /&gt; &lt;/div&gt; .header{ text-align:...

5
420 / 311 / 113
Регистрация: 28.08.2013
Сообщений: 848
04.08.2024, 14:36
JavaScript-код выполняется двумя этапами. Первый, последовательное выполнение кода js-файла. Второй, при наступлении события выполняется указанный код (handler (обработчик события)). Во всех остальных случаях, ничего не происходит.
Если я правильно понял, то нужно JS-код, который загружает картинку, вынести в отдельную функцию и вызывать её (функцию) при загрузке и при клике для смены аватара/картинки.
0
 Аватар для Marrex
0 / 0 / 0
Регистрация: 31.05.2016
Сообщений: 131
04.08.2024, 18:03  [ТС]
Почти всё находится внутри функции post...
Сверху весь процесс описан по пунктам...
1). Физически, кнопкой выбрали файл.
2). Отправили массив $_FILES на сервер.
3). Php - сохранили файл - вернули "return_data"(return_data = xhr.responseText ; ) в функцию "post"(самописную) - "Аватар изменен".
4). Файл ещё внутри инпута... берем его ещё раз... и отправляем blob url в src.
JavaScript
1
2
3
4
5
6
7
if ( return_data== 'Аватар изменен.' )
      {
          let img = new Image();
          var file = document.getElementById('userfile').files[0];
          img.src = window.URL.createObjectURL(file); 
          document.getElementById('ava') . src = img.src; 
      }
---
Если делать с перезагрузкой, то все работает отлично...
Повторная отправка не работает... вчера удалил "blob".... это точно не он...
---
Я предполагаю... где-то затык... в моменте загрузки файла... физически... раз он не может его показать... здесь:
JavaScript
1
let file = document.getElementById('userfile').files[0]
---
Где-то какая-то скрытая [del] сидит... а я её не вижу и понять не могу...
0
Супер-модератор
Эксперт JSЭксперт HTML/CSSЭксперт PHP
 Аватар для gogolik
3971 / 2093 / 832
Регистрация: 13.03.2010
Сообщений: 6,916
04.08.2024, 18:14
Marrex, приведите полный код, который позволит воспроизвести проблему. По вашим обрывкам ничего не понятно.
0
 Аватар для Marrex
0 / 0 / 0
Регистрация: 31.05.2016
Сообщений: 131
04.08.2024, 18:19  [ТС]
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
function main_post()
{
 
  if(document.getElementById('userfile'))
  {
    let file = document.getElementById('userfile').files[0]
    console.log(file); 
    let data = new FormData();
    data.append('file', file);
    var xhr = new XMLHttpRequest();// Создаём объект XMLHTTP
    xhr.open("POST", "https://домен.ru/post.php" , true);// Открываем асинхронное соединение
    xhr.send(data); // Отправляем POST-запрос
  }
  else
  { 
    var xhr = new XMLHttpRequest();
    var data =''; 
    for (var key in send) { data += key +'='+ encodeURIComponent(send[key]) + "&"; }
    xhr.open("POST", 'https://домен.ru/post.php' , true);
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.send(data);
  }
 
  xhr.onreadystatechange = function()
  {
    return_data = xhr.responseText ; 
 
    var good_array = [
      'Текст записан',
      'Слово заменено', 
 
      'Файл слишком большой',
      'Файл загружен частично',
      'Файл не загружен',
      'type изображения не определен',
      'tmp_name изображения не определен',
      'size изображения не определен',
      'Разрешение файла не более 100 х 100px',
      'Вес файла не более 100кб',
      'Доступно два типа jpeg/png',
      'Папка не создана, поторите операцию!' 
    ]
 
     var bad_array = [
      'Контент еще не редактировался',
      'Ячеека $sp_page пуста....',
      'Ячеека $on_what_change пуста....',
      'Ячеека $what_change пуста....',
      'Слово не заменено',
      'Слово для замены не найдено',
      
      
      'Аватар изменен.',
      'Аватар создан.' 
    ]
 
    if ( return_data== 'Аватар изменен.' ||  return_data== 'Аватар создан.')
    {
      if ( return_data== 'Аватар изменен.' )
      {
          let img = new Image();
          var file = document.getElementById('userfile').files[0];
          img.src = window.URL.createObjectURL(file); 
          console.log(img.src); 
          document.getElementById('ava') . src = img.src;
          document.getElementById('panel_auth_ava') . src = img.src; 
      }
      else 
      {
        document.getElementById('ava').src= hp_ava ;
        document.getElementById('panel_auth_ava').src= hp_ava ;  
      }
 
      setTimeout(function(){  
        if(userfile.classList.contains('catch') ) userfile.classList.remove('catch'); 
        userfile.classList.add('its_def'); 
        userfile .value='';
      }, 2000);
      style . innerHTML = '#form_ex_ { position: absolute; left: -3000px; transition: 2s;}'; is_this . innerHTML =''; 
    }  
      
     
    if (bad_array.includes(return_data)) show_result_post.innerHTML = '<redline>'+return_data+'</redline>';
    else if (good_array.includes(return_data)) show_result_post.innerHTML  = '<greenline>'+return_data+'</greenline>'
    // else show_result_post.innerHTML = 'В массивах такого нет';
    else show_result_post.innerHTML = return_data;
 
    setTimeout(function(){  show_result_post.style ='z-index:501;  left: 0px; transition: 1s;  word-break: break-all;';  }, 200);
 
    setTimeout(function(){  show_result_post.style ='z-index:501;  left:-1500px; transition: 1s;  word-break: break-all'; }, 3000 );
  }
}
Добавлено через 1 минуту
Php не выкладываю... точно проблема не в нем...
0
 Аватар для voraa
1292 / 1270 / 189
Регистрация: 21.01.2024
Сообщений: 5,867
04.08.2024, 20:39
Цитата Сообщение от Marrex Посмотреть сообщение
style . innerHTML = '#form_ex_ { position: absolute; left: -3000px; transition: 2s;}';
Это что?
Что такое style и что вы засовываете в его innerHTML?

JavaScript
1
2
3
xhr.onreadystatechange = function()
  {
    return_data = xhr.responseText ;
Это событие срабатывает каждый раз при изменении состояния. Но состояния бывают разные.
https://developer.mozilla.org/... ttpRequest
responseText будет иметь какое то осмысленное значение только когда readyState == 4
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
04.08.2024, 20:39
Помогаю со студенческими работами здесь

Не работает смена картинки при наведении
+1 невыходит, подскажите в чем ошибка? Очень интересует этот момент... &lt;tr&gt;&lt;td width=&quot;207&quot;&gt;&lt;td...

Повторная загрузка
Есть код по загрузке файла. &lt;form enctype=&quot;multipart/form-data&quot; action=&quot;check.php&quot; method=&quot;post&quot;&gt; &lt;input type=&quot;hidden&quot;...

Загрузка картинки в PictureBox не работает на других ПК
как сделать так чтобы на других компах работало изминение picture box при mouse leave mouse

Повторная загрузка сцены
Добрый день. Клиент. Есть стартовая сцена. На ней меню. Один из объектов в иерархии - пустой объект с логикой сети. При подключении всех...

Повторная загрузка dll
Всем привет. Имеется dll которую написал сам и подключаю динамически к своему приложению. Подключается хорошо, необходимые данные получаю....


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Опции темы

Новые блоги и статьи
Валидация и контроль данных табличной части документа перед записью
Maks 22.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в КА2. Задача: контроль и валидация данных табличной части документа перед записью с учетом регламента компании. . .
Отчёт о затраченных материалах за определенный период с макетом печатной формы
Maks 21.04.2026
Отчёт из решения ниже размещён в конфигурации КА2. Задача: разработка отчёта по затраченным материалам за определённый период, с возможностью вывода печатной формы отчёта с шапкой и подвалом. В. . .
Отчёт о спецтехнике находящейся в ремонте
Maks 20.04.2026
Отчёт из решения ниже размещен в конфигурации КА2. Задача: отобразить спецтехнику, которая на данный момент находится в ремонте. Есть нетиповой документ "Заявка на ремонт спецтехники" который. . .
Памятка для бота и "визитка" для читателей "Semantic Universe Layer (Слой семантической вселенной)"
Hrethgir 19.04.2026
Сгенерировано для краткого описания по случаю сборки и компиляции скелета серверного приложения. И пусть после этого скажут, что статьи сгенерированные AI - туфта и не интересно. И это не реклама -. . .
Запрет удаления строк ТЧ документа при определённом условии
Maks 19.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "Аккумуляторы", разработанного в конфигурации КА2. У данного документа есть ТЧ, в которой в зависимости от прав доступа. . .
Модель заражения группы наркоманов
alhaos 17.04.2026
Условия задачи сформулированы тут Суть: - Группа наркоманов из 10 человек. - Только один инфицирован ВИЧ. - Колются одной иглой. - Колются раз в день. - Колются последовательно через. . .
Мысли в слух. Про "навсегда".
kumehtar 16.04.2026
Подумалось тут, что наверное очень глупо использовать во всяких своих установках понятие "навсегда". Это очень сильное понятие, и я только начинаю понимать край его смысла, не смотря на то что давно. . .
My Business CRM
MaGz GoLd 16.04.2026
Всем привет, недавно возникла потребность создать CRM, для личных нужд. Собственно программа предоставляет из себя базу данных клиентов, в которой можно фиксировать звонки, стадии сделки, а также. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru