Блог

У меня есть проект онлайн-покупок в Spring Boot. Существует страница профиля пользователя, на которой пользователь может обновить свою фотографию профиля. На данный момент изображение профиля загружено успешно, но когда я обновляю или перезагружаю страницу, новое загруженное изображение не отображается. Каждый раз, когда мне нужно выйти из системы и повторно войти в систему, я могу видеть свое обновленное изображение.

Ниже приведен скрипт для загрузки изображения на сервер. Здесь я создал REST API для преобразования файла в URL-адрес, а затем сохранения этого URL-адреса в моей базе данных.

   $("#file").change(function(){
        var formData = new FormData();
          var fileSelect = document.getElementById("file");
          if(fileSelect.files amp;amp; fileSelect.files.length == 1) {
              var file = fileSelect.files[0];
              formData.set("file",file,file.name);
              }else{
                  $("#file").focus();
                  return false;
              }
          var request = new XMLHttpRequest();
          try {
                request.onreadystatechange=function() {
                    if(request.readyState==4) {
                        var v = JSON.parse(request.responseText);
                        if(v.status==="OK") {
                            document.getElementById('imagepath').value = v.response; // Fetched image url from DB and set into a hidden input field.
                            userprofilepic();
                        }
                    }
                }
                request.open('POST',"<%=AkApiUrl.uploadfile%>");
                request.send(formData);
              } catch(e) {
                  swal("Unable to connect to server","","error");
              }
    })
 

Это функция, в которую загружается и может быть видна фотография профиля пользователя.

     function userprofilepic(){
        var img = document.getElementById('imagepath').value;
        var url = "api/updateprofilepic";
        $.post(url, {
            userid : '<%=loginuserid%>',
            img : img,
        }, function(data, status) {
            if (data.status == "OK") {
                if (data.statusCode == 1) {
                    swal({title: "Yippee! Image Uploaded!", text: "User Image Uploaded Successfully", type: "success"},
                        function(){
                            location.reload();
                    })
                } else {
                    var error = data.responseMessage;
                    swal(error, "", "error");
                }
            } else {
                var error = data.responseMessage;
                swal(error, "", "error");
            }
        });
    }
 

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

Снимок экрана для отображения поля изображения профиля пользователя