首页 > 解决方案 > 如何仅在用户登录时运行 ajax。(Django)

问题描述

我有多个可以通过单击相应按钮添加到购物车的项目。每个项目都是一个包含有关 itemid 信息的表单,“addtocart”按钮是表单的提交按钮。

我正在使用 ajax 在数据库中进行更改,然后重新加载页面以反映它们。

html

<script type="text/javascript">

    $(document).on('submit','.addtocart',function(e){

        e.preventDefault();
        var a=$(this).find('input[name=itemid]').val();

        $.ajax({              

          type:'POST',
          url:'addtocart',
          data:{
            itemid:a,
            'csrfmiddlewaretoken': $('[name="csrfmiddlewaretoken"]').val()
          }
          });
          setTimeout(() => { document.location.reload(true);} , 100);


    });
</script>

视图.py

@login_required(login_url='/userhome')
def addtocart(request):
    if request.method == "GET":
        return redirect('/')
    else:

        product_id = request.POST['itemid']
        product_quantity = 1
        cart = usercart.objects.all().filter(user_id = request.user.id, product_id = product_id )
        try:
            if cart[0] is not None:
                cart = usercart.objects.get(user_id = request.user.id, product_id=product_id)
                cart.product_quantity+=1
                cart.save()

            else:
                cart = usercart(product_id=product_id, user_id=request.user.id, product_quantity=product_quantity)
                cart.save()
        except IndexError:
                cart = usercart(product_id=product_id, user_id=request.user.id, product_quantity=product_quantity)
                cart.save()
        return redirect('checkout')

如果用户未登录并且单击了 addtocart 按钮,我想重定向到登录页面('/userhome')。我试过把我的 Js 包在里面

{% if user.is_authenticated %} 
  <script>
  ...
  </script>
{% endif %}

但是由于这个原因,用户在登录之前看不到产品。我希望用户在没有登录的情况下看到产品,但是 addtocart 按钮应该在这两种情况下都有效,重定向到未登录的用户并为登录的用户添加产品在。

标签: javascriptjquerydjangoajaxdjango-authentication

解决方案


您应该statusCode为您的方法使用回调ajax。这也将防止 POST 请求花费超过 100 毫秒并且在更新数据库之前重新加载页面的任何问题。

您还在结帐页面的请求中返回重定向,ajax 请求通常不应收到重定向响应。您应该返回一个成功状态代码,这里我使用 http 响应,但 JSON 响应会更好。

return HttpResponse("", status=200)

如果用户未登录,则返回与未经授权相关的响应代码

return HttpResponse("", status=401)

使用上述方法而不是使用@login_required装饰器,因为它将返回重定向。

然后,您可以使用statusCode回调在 ajax 方法中处理此问题:

$.ajax({              
    type:'POST',
    url:'addtocart',
    data:{
        itemid:a,
        'csrfmiddlewaretoken': $('[name="csrfmiddlewaretoken"]').val()
    },
    statusCode: {
        200: function() {
            // Success! Reload the page
            document.location.reload(true);
        },
        401: function() {
            // Unauthorized, redirect to home
            window.location.href = "/userhome";
        },
    }
});

推荐阅读