Сохранение фото с помощью Django

Question

Я новичок в программировании, я реализовал загрузку фото на сайт, теперь мне необходимо реализовать их загрузку на локальный сервер в папку photos с помощью django после того, как они были выбраны на сайте пользователем. Я уже набросал код, однако фото не загружаются в photos. Вот мой код:

HTML:

<div id="left_photo_container">
  <img id="photo" src="#" alt="Here will be displayed your main photo. Choose it:" class="alt-centered">
  <input id="PhotoUpload" type="file" name="photo">
</div>

JS:

window.onload = function() {
    const PhotoUpload = document.getElementById('PhotoUpload');
    const photo = document.getElementById('photo');
  
    PhotoUpload.addEventListener('change', function() {
      const file = this.files[0];
      if (file) {
        const reader = new FileReader();
        reader.addEventListener('load', function() {
          photo.setAttribute('src', this.result);
          photo.classList.remove('alt-centered');
          PhotoUpload.style.display = 'none'; // скрываю кнопку
  
          // Отправляем AJAX-запрос на загрузку аватара
          const formData = new FormData();
          formData.append('photo', file);
  
          fetch('/MediaSave/MediaSave/upload-avatar/', {
            method: 'POST',
            body: formData
          })
          .then(response => response.json())
          .then(data => {
            console.log(data); // Результат ответа от сервера
          })
          .catch(error => {
            console.error('Произошла ошибка:', error);
          });
        });
  
        reader.readAsDataURL(file);
      } else {
        photo.setAttribute('src', '#');
        photo.classList.add('alt-centered');
        PhotoUpload.style.display = 'block'; // показываю кнопку
      }
    });
  };

Views.py:

from django.shortcuts import render
from django.views.decorators.csrf import csrf_exempt
from django.core.files.storage import default_storage
from django.http import JsonResponse

# Create your views here.

@csrf_exempt
def upload_avatar(request):
    if request.method == 'POST' and request.FILES.get('photo'):
        photo = request.FILES['photo']
        # Сохраните фотографию с помощью default_storage
        filename = default_storage.save('photos/' + photo.name, photo)
        return JsonResponse({'message': f'Фотография успешно загружена: {filename}'})
    return JsonResponse({'error': 'Произошла ошибка при загрузке фотографии.'})

urls.py:

from django.contrib import admin
from django.urls import path
from django.conf import settings
from django.conf.urls.static import static
from PhotoSave import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('upload-avatar/', views.upload_avatar, name='upload_avatar'),
]

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

settings.py

STATIC_URL = 'static/'
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'MediaSave/PhotoSave/photos')

в models.py я ничего не писал.

Изменено: В консоле имеются ошибки:

POST http://localhost/MediaSave/MediaSave/upload-avatar/ 404 (Not Found) Эта ошибка возникает из-за строки fetch('/MediaSave/MediaSave/upload-avatar/', {
Произошла ошибка: SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON

БЛОГ НА HUSL

Сохранение фото с помощью Django

Ответы (0 шт):