Django + jQuery: ошибка «Нет изображения» с ответом 400 31 при загрузке изображения через AJAX ⇐ Jquery

[Anonymous]

Я работаю над проектом Django, в который загружаю изображение для обработки моделью машинного обучения. Интерфейс использует jQuery для отправки изображения через запрос AJAX. Однако сервер продолжает возвращать ошибку: {"error": "Изображение не предоставлено". и Точность: NaN%. Кроме того, я получаю ответ 400 31 в консоли браузера.
Фронтенд (код AJAX и HTML):

Код: Выделить всё

$(document).ready(() => {
$("input[id='image']").on('change', function (event) {
let input = this;
var reader = new FileReader();
reader.onload = function (e) {
$('#banner').css('width', '350px')
$('#banner').addClass('img-thumbnail')
$('#banner').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
})

$('#process').click(() => {
$('.buttons').hide()
$('.loader').show()
$('#title').html("Processing...")
let image = $('#image').prop('files')[0]
var data = image['name'];

console.log(data)
$.ajax({
url: "http://127.0.0.1:8000/api/",
type: "POST",
dataType: 'json',
data: {
image: data,
csrfmiddlewaretoken: '{{ csrf_token }}'
},
headers: {
'Authorization': 'z*qm$(e9k0wa--t!^ux(xn15vk$)h7c$%3%vflo^@_++bg&uw(', // CSRF token
'Content-Type': 'application/json' // JSON
},
success: function (xhr) {
alert("Error while processing")
},
error: function (xhr) {
$('#title').html("Result")
let result = (xhr.responseText).split("-");
let disease = result[0];
let accuracy = result[1];
$('.loader').hide()
$('#disease').html("Result: " + disease)
$('#accuracy').html("Accuracy: " + parseInt(accuracy).toFixed(2) + "%")
$('#graph').attr('src', '{% static "graph.png" %}')
$('.result').show()
}
});
});
});

Django Views.py:

Код: Выделить всё

from django.shortcuts import render
from django.views.decorators.csrf import csrf_exempt
from django.http import HttpResponse, JsonResponse
from diab_retina_app import process

@csrf_exempt
def display(request):
if request.method == 'GET':
return render(request, 'index.html')

@csrf_exempt
def process_image(request):
if request.method == 'POST':
img = request.FILES.get('image')

if img is None:
return JsonResponse({'error': 'No image provided.'}, status=400)

print("Image uploaded:", img)  # Log the image details

try:
response = process.process_img(img)
return HttpResponse(response, status=200)
except ValueError as e:
return JsonResponse({'error': str(e)}, status=500)

Я также проверил следующее:

• Ввод файла работает на стороне клиента, и изображение перед отправкой отображается правильно.
• Данные формы создаются, и к ним добавляется изображение.
  Но сервер по-прежнему отвечает {"ошибкой": "Изображение не предоставлено"..

Что может быть причиной ошибки 400 31 и проблемы «Изображение не предоставлено»? Как правильно отправить файл изображения на серверную часть Django?

Подробнее здесь: https://stackoverflow.com/questions/791 ... oading-ima