Javascript Django:Ajax未从服务器响应接收数据

我是Django的新手，我正试图弄明白如何在不重新加载页面的情况下动态添加来自python脚本的内容

目前，我的views.py文件中有两个函数。一个处理上传文件（home），另一个处理调用python脚本并处理文件（handle）。我这样分隔它的原因是，当python脚本处理上传的文件时，我希望按顺序填充HTML表

但是，我的ajax函数没有从handle函数的http响应接收任何数据，我不知道为什么未调用成功函数和错误函数。这真的很奇怪，因为views.py中handle函数中的print语句成功地打印了数据

视图.py

i=0
uploaded_file = None


def home(request):

    if (request.method == 'POST'):
        file_form = UploadFileForm(request.POST, request.FILES)
        if file_form.is_valid():
            global uploaded_file
            uploaded_file = request.FILES['file']
            print(uploaded_file)
    else:
        file_form = UploadFileForm()

    return render(request, 'personal/home.html', {'form': file_form})



def handle(request):

    # TODO make ajax wait for a response from 'home'
    # so I don't have to wait for 1 second  
    time.sleep(1)
    data = {}
    data['Name'] = fileName(uploaded_file)
    if(request.is_ajax()):
        print(data)        # prints succesfully
    return HttpResponse(json.dumps(data), 
content_type="application/json")

urlpatterns = [
    path(r'', views.home, name='home'),
    path(r'handler', views.handle, name='handle'),
]

def handle(request):
    if request.method == 'POST':
        data = request.POST
        field_example = data.get('field_example')

        return JsonResponse(data)
    else:
        data = request.GET
        field_example = data.get('field_example')
        return JsonResponse(data)

urlpatterns = [
    path(r'', views.home, name='home'),
    path(r'handler/', views.handle, name='handle'),
]

home.html

        <script type = "text/javascript" language = "javascript">

        function post_tables(data) {
            alert(data)
        }


         $(document).ready(function(post_tables) {
            $("#upload").click(function(event){
               $.ajax( {
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  type: "get",
                  url:'/handler',
                  success: function(data) {
                     console.log("over here")
                     post_tables(data)
                  },
                  error: function(data) {
                      console.log("down here")
                      post_tables("error being thrown")
                  }
               });
            });
         });
        </script>

<form id="upload">
   {% csrf_token %}
   <input type="text" name=field_example>
   .
   .
   .
</form>

---

我向你解释了整个过程。也许你的问题会解决。祝你好运

视图.py

i=0
uploaded_file = None


def home(request):

    if (request.method == 'POST'):
        file_form = UploadFileForm(request.POST, request.FILES)
        if file_form.is_valid():
            global uploaded_file
            uploaded_file = request.FILES['file']
            print(uploaded_file)
    else:
        file_form = UploadFileForm()

    return render(request, 'personal/home.html', {'form': file_form})



def handle(request):

    # TODO make ajax wait for a response from 'home'
    # so I don't have to wait for 1 second  
    time.sleep(1)
    data = {}
    data['Name'] = fileName(uploaded_file)
    if(request.is_ajax()):
        print(data)        # prints succesfully
    return HttpResponse(json.dumps(data), 
content_type="application/json")

urlpatterns = [
    path(r'', views.home, name='home'),
    path(r'handler', views.handle, name='handle'),
]

def handle(request):
    if request.method == 'POST':
        data = request.POST
        field_example = data.get('field_example')

        return JsonResponse(data)
    else:
        data = request.GET
        field_example = data.get('field_example')
        return JsonResponse(data)

urlpatterns = [
    path(r'', views.home, name='home'),
    path(r'handler/', views.handle, name='handle'),
]

home.html

        <script type = "text/javascript" language = "javascript">

        function post_tables(data) {
            alert(data)
        }


         $(document).ready(function(post_tables) {
            $("#upload").click(function(event){
               $.ajax( {
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  type: "get",
                  url:'/handler',
                  success: function(data) {
                     console.log("over here")
                     post_tables(data)
                  },
                  error: function(data) {
                      console.log("down here")
                      post_tables("error being thrown")
                  }
               });
            });
         });
        </script>

<form id="upload">
   {% csrf_token %}
   <input type="text" name=field_example>
   .
   .
   .
</form>

home.html中的js代码：

$("#upload").submit(function (e) {
    e.preventDefault();
    var formData = new FormData(this);

    $.ajax({
        url: "{% url 'handle' %}",

        type: 'GET',
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        success: function (data) {
            console.log("over here")
            post_tables(data)
        },
        error: function (data) {
            console.log("down here")
            post_tables("error being thrown")
        }
    });
});

---

您还没有展示足够的模板来了解Ajax的问题所在，但绝对不能使用这样的全局变量来保持请求之间的状态。其次，我不知道为什么field_示例变量没有在任何地方使用。另外，如何通过Json响应将数据发送回ajax函数？在本例中，没有任何内容被发回。出于测试目的，我试图通过执行以下操作将文件名发回：data={}data['name']=fileName（上传的文件）#我定义的函数return JsonResponse（data）我发送字段(formData变量js code中的示例字段)。如果需要按值发送coustom字段，请执行以下操作：$.ajax（{url:{%url'句柄'%}），键入：'GET'，数据：{“示例字段”：“值示例”，“示例字段2”：“值示例2”，}。