Передача данных из localstorage в views в Django

У меня есть функция добавляющая данные в localstorage ключ: cart; поля: name, price, image, quantity и есть страница с оформлением заказа: пользователь заполняет форму где указывает имя, фамилию, номер телефона и адрес электронной почты. Я хочу чтобы после нажатия кнопки в базу данных заносился пользователем с его корзиной которая указана в localstorage. Для этого на данный момент у меня есть две работающие модели:

class SaveOrder(models.Model):
id = models.UUIDField(primary_key=True, default=uuid.uuid4, editable=False)
username = models.CharField(max_length=128)
surname = models.CharField(max_length=128)
number_phone = models.CharField(max_length=20)
email = models.EmailField()

def __str__(self):
    return f"{self.id}"

class Meta:
    verbose_name = "Пользователь"
    verbose_name_plural = "Пользователи"


class Basket(models.Model):
    name = models.CharField(max_length=128, default='')
    quantity = models.PositiveIntegerField(default=0)
    localstorage = models.ForeignKey(to = SaveOrder, on_delete=models.CASCADE)

def __str__(self):
    return f"Корзина для {self.user.id}"

class Meta:
    verbose_name = "Корзина"
    verbose_name_plural = "Корзины"

Пользователь сохраняется но мне нужно чтобы к тому же сохранялась корзина из localstoarge которая будет связана с пользователем. Т.е при помощи JavaScripts мне нужно передать данные из localstorage в views чтобы я мог их добавить в БД

def submit_order(request):
if request.method == "POST":
   
    username = request.POST.get("username")
    surname = request.POST.get("surname")
    number_phone = request.POST.get("number_phone")
    email = request.POST.get("email")

   
    if username and surname and number_phone and email:
      
        if not is_valid_phone_number(number_phone):
            return render(request, "users\order.html", {"error": "Неправильный формат номера телефона"},)

        
        if not is_valid_email(email):
            return render(request, "users\order.html", {"error": "Неправильный формат адреса электронной почты"},)

       
        user = SaveOrder.objects.create(
            username=username,
            surname=surname,
            number_phone=number_phone,
            email=email,
        )
        '''Вот сюда мне нужно передать данные из localstorage чтобы как видно ниже занести в БД'''
        product_name = request.POST.get('name')
        quantity = request.POST.get('quantity')
        

        
        basket = Basket.objects.create(
            user=user,
            product_name=product_name,
            quantity=quantity
        )

        return redirect("products/")  
    else:
 
        return render(request, "users\order.html", {"error": "Не все обязательные поля формы заполнены"})
else:
    return render(request, "users\order.html")

Пытался реализовать сам вот js код:

document.addEventListener('DOMContentLoaded', function () {
document.getElementById('order_form').addEventListener('submit', function (event) {
    event.preventDefault(); 

    
    var productData = JSON.parse(localStorage.getItem('cart'));
    if (productData) {
   
        var xhr = new XMLHttpRequest();
        xhr.open('POST', '/submit_order', true);
        xhr.setRequestHeader('Content-Type', 'application/json');
        xhr.onload = function () {
            if (xhr.status === 200) {
                console.log('Данные о продукте успешно отправлены на сервер');
      
                localStorage.removeItem('cart');
            } else {
                console.error('Ошибка при отправке данных о продукте на сервер');
            }
        };
        xhr.onerror = function () {
            console.error('Произошла ошибка сети');
        };

   
        var requestData = {
            name: productData.name,
            quantity: productData.quantity
        };

  
        xhr.send(JSON.stringify(requestData));
    
    }
});

}); В консоли выдает ошибку 403 как я узнал это ошибка связана с тем что небезопасно передавать данные а как это исправить я не знаю. Прошу ответ на JS а не Jquery но и на нем ответы пойдут. Спасибо за любой ответ

Вернуться на верх