@ksksksks

Как отправить через ajax файл на сервер?

Здравствуйте, уже больше недели не могу разобраться, нужно отправить картинку на сервер Django, но я получаю ошибку:
415 (Unsupported Media Type)
{"detail":"Неподдерживаемый тип данных \"text/plain;charset=UTF-8\" в запросе."}
Если меняю ContentType на multipart/form-data, то получаю:
400 (Bad Request)
Через postman отправляется нормально, в чем может быть ошибка?:(
Скрипт:
$(function() {
  // при нажатии на кнопку "Отправить"
  $('#upload-image').click(function() {
    // элемент, с помощью которого пользователь выбирает файл
    var file = $('#file');

    var result = $('#result');
    // если файл выбран, то
    if (file.prop('files').length) {
      // создаём объект FormData
      var formData = new FormData();
      // добавляем в объект FormData файл
      formData.append('img', file.prop('files')[0]);

      $.ajax({
        url: "http://127.0.0.1:8000/api/v2/update-ava/11/",
        data: {
          pk: 11,
          img: formData,
        },
        DataServiceVersion: 2.0,
        processData: false,
        contentType: false,
        // contentType:"multipart/form-data",
        type: 'PUT',


        success: function(data) {
          result.html(data);
        }
      });
    } else {
      result.html("Не выбран файл для загрузки!");
    }
  });
});


На сервере:
class UpdateProfile(APIView):
    """Редактирование аватара"""
    permission_classes = [permissions.AllowAny]
    # parser_classes = (FileUploadParser,)
    # parser_classes = (MultiPartParser, FormParser)
    # parser_classes = (FileUploadParser,)
    def get_object(self, pk):
        try:
            return Profile.objects.get(pk=pk)
        except Profile.DoesNotExist:
            raise Http404

    def put(self, request, pk, format=None):
        snippet = self.get_object(pk)
        serializer = RedactIMG(instance=snippet, data=request.data, partial=True)
        if serializer.is_valid():
            if "img" in request.FILES:
                serializer.save(img=request.data["img"])
                serializer.save()
                return Response(serializer.data,status=201)
            return Response(serializer.errors,status=400)
        else:
            return Response(serializer.errors,status=400)
  • Вопрос задан
  • 1028 просмотров
Решения вопроса 1
Vlad_IT
@Vlad_IT
Front-end разработчик
Так у вас тут
data: {
          pk: 11,
          img: formData,
        },

img это не картинка, это FormData. Правильнее вот так
var formData = new FormData();
      // добавляем в объект FormData файл
      formData.append('img', file.prop('files')[0]);
      formData.append('pk', 11);
      $.ajax({
        url: "http://127.0.0.1:8000/api/v2/update-ava/11/",
        data: formData,
...
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы