How can I send localstorage data from JavaScript ajax call and print return data from views in Django template

I have stored some data on localStorage( Itemnames and ItemIds), now I want to send itemid’s to django views from ajax. I have basics knowledge of django and learning Javascript. I tried to figureit out by myself but its been more than 4 days I could not succeed, any help will be highly appreciated.

My Javascript:

$(document).ready(function() {
    var compare = localStorage.getItem("comparisionItems");
    var compareObj = JSON.parse(compare);
    
    var data_url = window.location.href;
    console.log(compare)
    console.log(compareObj)
    
   
      
      $.ajax({
        url: './compare',
        type: "POST",
        data: {'compare_id': compareObj },
        headers: { "X-CSRFToken": $.cookie("csrftoken") },
        dataType: "json",
        success: function (data) {
            console.log(data)
            
        },
        error: function () {
            alert("Some problem on passing data");
        }
        
    });
});

After getting the localstorageitmes, the console return looks like this:

My views:

def compare(request):
is_ajax = request.headers.get('X-Requested-With') == 'XMLHttpRequest'
if is_ajax and request.method == "POST":
    compare_id= request.POST.getlist('compare_id[itemIds]')
    """compare_id=request.POST.getlist('itemIds[]')  """
   
    """compare_id = request.POST.get('compare_id')"""
    product = get_object_or_404(Products, id=compare_id)
    context={ 'product':product}
   
    """ return render (request, './ecommerce/compare.html', context)"""
    return render (request, './compare.html', context)
else:
    context = None
    return render(request,'./compare.html', context)

How can I get the products which have id’s pass by ajax? And is there any different ways to pass those products to the template or I can do it just like the regular Django context process?