Django应用未正常渲染且地址栏显示CSRF Token，任务过滤功能故障求助

核心问题梳理 #

你的代码存在视图逻辑错误、HTML结构错误、表单处理不当三个核心问题，导致页面渲染异常且地址栏出现CSRF令牌参数。以下是具体问题和修复方案：

1. 视图类filterTask的错误与修复 #

问题点：

• 类视图中的output方法不符合Django规范：缺少self参数，将函数视图写法混入类视图，逻辑混乱。
• 表单初始化错误：直接把GET参数值传给Taskform，而非传递request.GET对象；且直接用表单对象作为过滤条件，而非清洗后的字段值。
• 错误使用redirect：redirect无法传递上下文，且参数错误（第二个参数应为URL名称/路径，而非模板名）。
• 类视图职责不清晰：filterTask同时处理表单展示和结果输出，逻辑拆分不合理。

修复后的views.py（拆分视图更简洁）：

from django.shortcuts import render
from django.views import View
from .models import Task
from .forms import Taskform

# 展示过滤表单的类视图
class FilterTaskView(View):
    def get(self, request):
        return render(request, 'filter-task.html')

# 处理过滤请求并返回结果的函数视图
def filter_output(request):
    ans = []
    if request.method == 'GET':
        # 正确初始化表单
        form = Taskform(request.GET)
        if form.is_valid():
            # 获取清洗后的优先级值
            priority = form.cleaned_data.get('priorityChoice')
            # 用清洗后的值过滤任务
            ans = Task.objects.filter(priority=priority).values()
    # 用render返回结果页面并传递上下文
    return render(request, 'output.html', context={'ans': ans})

2. filter-task.html的错误与修复 #

问题点：

• {% include 'base.html' %}放在DOCTYPE之前，破坏HTML文档结构，导致渲染异常。
• 多余反引号包裹整个HTML代码，引发页面解析错误。
• GET表单添加{% csrf_token %}：CSRF令牌仅用于POST请求，GET请求添加会导致地址栏出现CSRF参数。
• HTML元素ID重复：<label>和<select>的ID均为priorityChoice，违反规范。
• <option>标签内嵌套<br>，属于无效写法。

修复后的filter-task.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Filter Tasks</title>
</head>
<body>
    {% include 'base.html' %}

    <a href="{% url 'index' %}">Go To Homepage</a>
    <h3>Filter Task by Priority</h3>
    <!-- 指定表单提交到处理结果的URL -->
    <form method="get" action="{% url 'filter_output' %}" autocomplete="off">
        <label for="priorityChoice">Enter the priority :</label>
        <select id="priorityChoice" name="priorityChoice" required>
            <option value="low">low</option>
            <option value="mid">mid</option>
            <option value="high">high</option>
        </select><br><br>
        <input type="submit" value="Submit"/>
    </form>
</body>
</html>

3. 路由配置补充（需在urls.py中添加） #

确保路由正确映射两个视图：

from django.urls import path
from .views import FilterTaskView, filter_output

urlpatterns = [
    # 其他路由...
    path('filter-task/', FilterTaskView.as_view(), name='filter_task'),
    path('filter-output/', filter_output, name='filter_output'),
]

4. 额外注意事项 #

• 确保Taskform表单类中定义了priorityChoice字段，且字段类型与Task模型的priority字段匹配（比如用ChoiceField）。
• output.html中需正确遍历ans上下文数据，展示过滤后的任务。

内容的提问来源于stack exchange，提问作者Srinivas Saravanan