【问题标题】：How to call Python functions from JavaScript in Django?如何在 Django 中从 JavaScript 调用 Python 函数？
【发布时间】：2018-12-08 22:47:21
【问题描述】：

我已经为此苦苦挣扎了几天。我已经阅读了很多关于 Django 项目的帖子、博客和观看视频演示，但没有什么能完全解决我的问题。

我有一个 Django webapp，它使用 Python API 连接到第三方服务来分析文本数据。用户写入文本区域，按下按钮，然后将文本发送到返回 JSON 对象列表的服务。对该服务的 API 调用是一个 Python 函数。我正在尝试使用 Ajax 在按下按钮时使用文本数据作为参数对 Python 函数进行异步调用。

我目前还没有尝试调用我的第三方服务。我只是想看看能否从 Python 发送输入和接收输出中得到响应。

我发现的大多数示例都涉及创建表单并提交它，以便 Django 框架自动调用它的 Python 函数。表单并不完全是我想要构建的，我也不想进入新页面查看结果或刷新当前页面。

<!-- index.html -->
<html>
<head>
    <title>Test Data</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script>

        document.getElementById("Button").addEventListener('click', analyzeText());

        function analyzeText(){
            var text = document.getElementById('text-to-analyze').value;

            $ajax({
                type: "POST",
                url: "/models.py",   /* Call python function in this script */
                data: {param: text},   /* Passing the text data */
                success: callback
            });
        }

        function callback(response){
            console.log(response);
        }
    </script>
</head>
<body>
    <textarea id="text-to-analyze" rows="12" cols="100"></textarea><br>
    <button id="button" value="Analyze"/>

</body>
</html>


# models.py
from django.db import models

# Function I want to call from Ajax
def testcall():
    return 'test successfull'

编辑：
我几乎让它工作了。我只是遇到了我无法弄清楚的 ajax 语法错误。

Could not parse the remainder: ' 'ajax-test-view'' from 'url 'ajax-test-view''

编辑
我修复了所有语法错误，但现在尝试执行目标 python 脚本时出现 404 错误。我现在了解了 Django 中的 url 和路径是如何工作的，但是使用 Kostadin Slavov 的解决方案，我如何在不路由到特定 html 的情况下做到这一点？

在 ajax 中，我将 url 设置为： url: '{{ 'ajax-test-view' }}', 在我的 python 中，我的 url 模式设置如下： path(r'^django-app/$', views.testcall, name = 'ajax-test-view'),

似乎 ajax url 中的变量指向 url 模式中的 name 字段，但这似乎也是要渲染的特定 html 文件的名称（？）或者它是 py 函数的名称？

当我点击我的按钮时，ajax 会向http://localhost:8000/what-ever-the-name-field-is-in-the-url-pattern 发送一个命令，我会从中得到一个 404。框架是在尝试加载页面还是意味着它找不到我的 python 文件？

Derp...重要的是要知道url: '{{ 'ajax-test-view' }}', 是ajax 将请求的url 地址，只有当路径完全匹配时，Django 的url 调度程序才会拦截它以执行其他操作。

最终编辑
得到它的工作。我在 Kostadin Slavov 的解决方案中更改了几件事：

# urls.py
urlpatterns = [
   url(r'^$', views.index, name = 'index'),
   path('my-ajax-test/', views.testcall),
]

<!-- index.html -->
<script>
....

var text = "test successful";

$.ajax({
   type: "POST",
   url: '{{ 'my-ajax-test/' }}',
   data: { csrfmiddlewaretoken: '{{ csrf_token }}', text: text },
   success: function callback(response){
               console.log(response);
            }
});
</script>

# views.py
def testcall(request):
   return HttpResponse(request.POST['text'])

【问题讨论】：

标签： python ajax django

【解决方案1】：

在urls.py 中创建一个url

path('my-ajax-test/', views.myajaxtestview, name='ajax-test-view'),

那么你的 ajax 应该看起来像

注意csrf_token否则会给你一个错误

        $ajax({
        type: "POST",
        url: '{{ url 'ajax-test-view'}}',   
        data: {csrfmiddlewaretoken: '{{ csrf_token }}',
              text: "this is my test view"},   /* Passing the text data */
        success:  function(response){
               alert(response);
           }
    });

在views.py

def myajaxtestview(request):
    return HttpResponse(request.POST['text'])

总结：

您需要在您的urls.py 中创建url，这会导致您的views.py 然后视图会在request 中获取您在request.POST 中发送的数据，您有大量数据可以找到更多关于它的信息here。在您的情况下，您对request.POST 更感兴趣，它是一个python 字典所以你选择你发送的参数并使用它你可以像return HttpResponce('test'+ request.POST['text']) 一样玩它

如果你想从models.py 得到一些东西，假设你从 js 发送的数据是{object_type: hammer}

def myajaxtestview(request):
    look_for = request.POST['object_type']
    #lets say you have model Items
    my_items= serializers.serialize('json', Items.objects.filter(object_type=look_for))
    return JsonResponse(my_items)

【讨论】：

这很有意义，但我无法重新创建它。我收到一条错误消息，提示“路径未定义”。我尝试导入from django.urls import path，但它说它无法导入路径。恐怕我对 Django 还不是很熟悉。
想通了。 stackoverflow.com/questions/47563013/…我正在使用 Visual Studio python 工具来构建我的 django 项目，但我没有注意版本号。
我几乎让它工作了。我在使用 ajax 时遇到语法错误。参见 OP 编辑。

【解决方案2】：

您正在尝试的是一个众所周知的问题。当您向服务器发出 ajax 请求时，服务器会响应一些数据或者可能会呈现一个模板。

要使这个请求 - 响应循环正常工作，您必须创建一个 url 到控制器逻辑的映射。您必须在 urls.py 中创建一个 url 和一个 python 函数映射。 python 函数将在views.py 中。现在，当您使用给定方法（POST 或 GET）请求该 url 时，它将调用映射函数并返回结果。

【讨论】：

【解决方案3】：

阅读问题编辑和不同的答案后，这是什么对我有用（不包括 imports）：

文件：urls.py

#urls.py
urlpatterns = [
   path('', views.index, name = 'index'),
   path('my-ajax-test/', views.testcall),
]

文件：index.html

#index.html
<html>
<head>
    <title>Test Data</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script>

        function analyzeText(){
            var text = document.getElementById('text-to-analyze').value;

            $.ajax({
                type: "POST",
                url: '{{ 'my-ajax-test/' }}',
                data: { csrfmiddlewaretoken: '{{ csrf_token }}', text: text },  
                success: function callback(response){
                           /* do whatever with the response */
                           alert(response);
                        }
            });
        }
    </script>
</head>
<body>
    <textarea id="text-to-analyze" rows="12" cols="100"></textarea><br>
    <input type="submit" id="button" value="process" onclick="analyzeText();">

</body>
</html>

文件：views.py

#views.py
def index(request):
   return render(request, 'vote/index.html')

def testcall(request):
   #Get the variable text
   text = request.POST['text']
   #Do whatever with the input variable text
   response = text + ":)"
   #Send the response 

   return HttpResponse(response)

【讨论】：

【解决方案4】：

我为这个问题苦苦挣扎了一两天。这就是解决我的问题的方法。

编辑：我还需要下载完整版的 jquery 才能使 ajax 请求正常工作。

HTML

在您的 HTML 中，您需要将 {% csrf_token %} 添加到您的表单中

<form id="your_form">
    {% csrf_token %}  //include the csrf_token line in your form
    <div>
        <input type="submit" value="blah blah blah">
    </div>
 </form>

script.js

为您的 java 脚本代码添加此函数以获取 csrf cookie。

function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie !== '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = cookies[i].trim();
            // Does this cookie string begin with the name we want?
            if (cookie.substring(0, name.length + 1) === (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
}

接下来您需要将 csrf 令牌添加到您的 ajax 请求中，如下所示。

    var csrftoken = getCookie('csrftoken');

    $.ajax({
       type: "POST",
       url: '/my-url/', --your url here
       data: { csrfmiddlewaretoken: csrftoken, text: "your text data here" },
       success: function callback(response){
                   console.log(response);
                }
    });

【讨论】：