Невозможно отобразить гостевого пользователя на сайте электронной коммерции в Python+Django

Я следил за YouTube-уроком Денниса Айви, (https://www.youtube.com/playlist?list=PL-51WBLyFTg0omnamUjL1TCVov7yDTRng), где отображается информация о количестве элементов в "cart-icon" и общей сумме.

Изображение того, как это должно быть: correct_rendering

Изображение того, как это происходит: error_rendering

В моем случае они не отображаются. Я не уверен, что именно пошло не так. Я пытался искать проблему в chatGpt, но не смог ее решить. Ниже приведен мой код:

views.py

models.py

cart.js

var updateBtns = document.getElementsByClassName("update-cart");
 
for (var i = 0; i < updateBtns.length; i++) {
  updateBtns[i].addEventListener("click", function () {
    var productId = this.dataset.product;
    var action = this.dataset.action;
    console.log("productId:", productId, "action:", action);
 
    if (user === "AnonymousUser") {
        addCookieItem(productId, action);
    } else {
        updateUserOrder(productId, action);
    }
  });
}
 
function addCookieItem(productId, action) {
    console.log("Not logged in");
 
    if (action === "add") {
      if (cart[productId] === undefined) {
        cart[productId] = { quantity: 1 };
      } else {
        cart[productId]["quantity"] += 1;
      }
    }
    if (action === "remove") {
      cart[productId]["quantity"] -= 1;
      if (cart[productId]["quantity"] <= 0) {
        console.log("Remove Item");
        delete cart[productId];
      }
    }
    console.log("cart:", cart);
    document.cookie = "cart=" + JSON.stringify(cart) + ";domain=;path=/";
    location.reload(true);
}
 
function updateUserOrder(productId, action) {
  console.log("user is logged in, sending data...");
  var url = "/update_item/";
 
  fetch(url, {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      "X-CSRFToken": csrftoken,
    },
    body: JSON.stringify({ productId: productId, action: action }),
  })
    .then((response) => {
      return response.json();
    })
    .then((data) => {
      console.log("data:", data);
      location.reload(true);
    });
}

main.html

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