处理发布请求参数后，如何确保 django 在新选项卡中提供模板？

Question

我的 html 中有一个按钮，单击该按钮时会进行一些计算并使用一些参数对我的一个 API 进行post 调用，然后从django 获取参数并将它们放在特定占位符中模板并渲染模板。

问题是我可以看到正在渲染的模板（如果我检查Google inspect element 的“网络”部分），但我在页面中看不到任何内容。我希望模板在新选项卡中呈现，其中我从 post 参数中获取的值放置在模板中的相应占位符中。

这是我通过ajax post 发送的（我在我的项目中使用angular js，但我也可以使用纯js 来完成）

var toSend = {
            "user": username,
            "password": password,
            "text": text
            "context": $scope.newContext,
    }


$http({
          method: 'POST',
          url: '/correction',
          data: toSend
        }).
        then(function(response) {
          console.log(response.data);
  }) 

这是我为接收 post 请求的 API 定义的 django 函数

@csrf_exempt
def get_correction(request):
        if request.method == 'POST':
                context = {}
                try:
                        print("recieved request")
                        user_request = json.loads(request.body.decode('utf-8'))
                        '''
                        some logic I use to check given the 
                        username and password, whether it is a 
                        valid user or not
                        '''
                        text_header = user_request.get("text")
                        userid = user_request.get("user")

                        context["userid"] = userid
                        context["text_header"] = text_header

                except Exception as e:
                        print(e)

                return render(request, 'correction_page.html', context)

在这里，我将文本和用户存储在 context 字典中，以便与 correction_page.html 一起发送。

这是我的更正页面的样子

<!DOCTYPE html>
{% load static %}
<html>
<head>
        <meta charset="utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">


</head>
<body>
        <h1>Welcome!</h1>
        <span> {{text_header}} </span>

<script type="text/javascript" src="{% static 'js/fetch_info.js' %}"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<!-- <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> -->
</body>
</html>

这里text_header 占位符确实获得了值（正如我在检查元素的Google chrome 网络部分中看到的那样。）

但在 UI 中，我看不到任何事情发生。我希望该模板将在新标签中提供，但没有任何反应。

我做错了什么？

Answer 1

这是我的建议：

Django 是服务器端，在新选项卡中打开是客户端。因此，您将无法仅通过服务器响应在新选项卡中打开。您需要在客户端处理它，即 angularJS

拨打$http，一旦解决，打开一个新选项卡并重定向到/correction/data，它应该提供所有这些数据并返回一个带有必要数据的template，这些数据在执行POST到@之后已经保存987654325@

类似：

$http({
      method: 'POST',
      url: '/correction',
      data: toSend
    }).
    then(function(response) {
       $window.open(url , '_blank');
}) 

这个url 将引用/correction/data，你会得到你的数据