Django REST Framework文件上传系统页面显示异常问题排查

可能的错误原因及解决办法 #

1. 根路由配置优先级错误 #

项目根路由（dropboxer/urls.py）可能将根路径直接指向了DRF的API路由，而非返回自定义模板的视图。

• 修正方式：确保根路径优先匹配返回index.html的视图，API路由单独放在子路径下。示例：

  # dropboxer/urls.py
  from django.urls import path, include
  from uploader.views import index_view
  
  urlpatterns = [
      path('', index_view, name='index'),  # 根路径指向首页视图
      path('api/', include('uploader.urls')),  # API路由放在/api子路径
  ]
  

2. 首页视图未正确返回模板 #

如果负责返回index.html的视图使用了DRF的API视图类（如APIView、ViewSet），会直接渲染DRF的UI而非模板。

• 修正方式：使用Django原生视图返回模板。示例：

  # uploader/views.py
  from django.shortcuts import render
  # 或使用类视图：from django.views.generic import TemplateView
  
  def index_view(request):
      return render(request, 'index.html')
  
  # 类视图写法：
  # class IndexView(TemplateView):
  #     template_name = 'index.html'
  

3. 模板目录未正确配置 #

Django找不到你的index.html，大概率是settings.py中TEMPLATES的DIRS参数未指向模板文件夹。

• 修正方式：确保模板目录路径配置正确。示例：

  # dropboxer/settings.py
  from pathlib import Path
  
  BASE_DIR = Path(__file__).resolve().parent.parent
  
  TEMPLATES = [
      {
          'BACKEND': 'django.template.backends.django.DjangoTemplates',
          'DIRS': [BASE_DIR / 'templates'],  # 指向项目根目录下的templates文件夹
          'APP_DIRS': True,
          # 其他配置项...
      },
  ]
  

4. 浏览器缓存干扰 #

浏览器可能缓存了旧的DRF页面内容，尝试强制刷新页面（Ctrl+F5 / Cmd+Shift+R），或清除浏览器缓存后重新访问。

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