首页 > 解决方案 > 尝试在详细信息页面上将商品添加到购物车时出现 404 错误

问题描述

编辑 我发现了问题,所以当在基础网站上单击“添加”时,绝对 url 只是 base/updateItem 但是当我进入详细页面时,url 是 /detail/3/updateItem

我正在做一个在线商店。在基本 URL ( 127.0.0.1:8000) 上,我可以将“推荐”产品直接添加到购物车。但是,当我进入包含该产品详细信息(图片、描述等)的页面并尝试从那里添加到购物车时我收到 404 错误127.0.0.1:8000/detail/1/updateItem

cart.js(我怀疑错误在这里):

var updateBtn = document.getElementsByClassName("update-cart")

for (i = 0; i < updateBtn.length; i++){
    updateBtn[i].addEventListener('click', function(){
        var productId = this.dataset.product
        var action    = this.dataset.action
        console.log(productId,action)
        console.log(user)
        if (user === "AnonymousUser"){
            console.log("user not logged in")
        }else{
           updateUserOrder(productId, action)
        }
    })
}
function updateUserOrder(productId, action){
    console.log("user created an order")

    var url = 'updateItem'

    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) =>{
        location.reload()
    })
}

网址.py

path('updateItem', views.updateItem, name='updateItem'),
path('cart', views.cartDetail, name='cart'),

视图.py

def cartDetail(request):
    if request.user.is_authenticated:
        customer = request.user.customer
        order, created = Order.objects.get_or_create(customer=customer, complete=False)
        items = order.orderitem_set.all()
    else:
        order = {'get_cart_total':0,} 
        items = []
    print(items)
    context ={
        'items':items,
        'orders':order,
    }

    return render(request,'cart.html',context)

def updateItem(request):
    data = json.loads(request.body)
    productId = data['productId']
    action = data['action']
    customer = request.user.customer
    product  = Product.objects.get(id=productId)
    order, created = Order.objects.get_or_create(customer=customer,complete=False)

    orderItem, created = OrderItem.objects.get_or_create(order=order, product=product)

    if action == "add":
        orderItem.quantity = (orderItem.quantity + 1)
    elif action == "remove":
        orderItem.quantity = (orderItem.quantity - 1)
    
    orderItem.save()

    if orderItem.quantity <= 0 or action=='delete':
        orderItem.delete()

    return JsonResponse("item was added", safe=False)

模型.py

class Order(models.Model):
    customer        = models.ForeignKey(Customer, on_delete=models.SET_NULL, blank=True, null=True)
    date_oredred    = models.DateField(auto_now_add=True)
    complete        = models.BooleanField(default=False, null=True, blank=True)
    transaction_id  = models.CharField(max_length=200, null=True)

    def __str__(self):
        return str(self.id)

    @property
    def get_cart_total(self):
        items = self.orderitem_set.all()
        total = sum([x.get_total for x in items])
        return total


    

class OrderItem(models.Model):
    product     = models.ForeignKey(Product, on_delete=models.SET_NULL, blank=True, null=True)
    order       = models.ForeignKey(Order, on_delete=models.SET_NULL, blank=True, null=True)
    quantity    = models.IntegerField(default=0, null=True, blank=True)
    date_added  = models.DateTimeField(auto_now_add=True)

    @property
    def get_total(self):
        if self.product.pricePromo is None:
            total = self.product.priceNormal * self.quantity
        else:
            total = self.product.pricePromo * self.quantity
        
        return total

如果我缺少任何代码,请告诉我。

标签: pythondjangoajaxdjango-rest-framework

解决方案


在 cart.js 中,我将 url 更改为绝对路径,它可以工作


推荐阅读