如何使用异步系统在django模板中加载图片？

# tasks.py
from celery import shared_task

@shared_task
def load_image_async(image_url):
    # 异步任务函数，处理图片加载逻辑
    # 可以使用第三方库（如requests）下载图片，或者从其他数据源获取图片URL
    # 返回图片URL

# views.py
from django.shortcuts import render
from .tasks import load_image_async

def my_view(request):
    # 处理视图逻辑
    # 获取图片URL
    image_url = "https://example.com/image.jpg"
    
    # 调用异步任务函数
    load_image_async.delay(image_url)
    
    return render(request, 'my_template.html')

# my_template.html
{% load static %}

<img id="my-image" src="{% static 'placeholder.png' %}" alt="Loading...">

<script>
    // 异步函数，通过AJAX请求调用异步任务函数
    function loadImageAsync() {
        var image = document.getElementById('my-image');
        var url = 'URL_TO_YOUR_ASYNC_TASK';  // 替换为异步任务函数的URL
        
        fetch(url)
            .then(response => response.json())
            .then(data => {
                image.src = data.image_url;  // 将返回的图片URL更新到<img>标签的src属性中
            });
    }
    
    // 页面加载完成后调用异步函数
    window.onload = loadImageAsync;
</script>