使用Django-CKEditor上传图片返回400错误排查求助

问题原因与对应解决措施 #

• 路由配置错误：将ckeditor上传路由放在了i18n多语言路由规则内，多语言前缀会导致上传请求路径不匹配
  解决方法：把ckeditor相关路由从i18n_patterns中移出，放到全局通用路由列表中：

  # 修正后的urls.py结构
  urlpatterns = [
      # 其他无需多语言前缀的全局路由
      path('ckeditor/',include('ckeditor_uploader.urls')),
  ] + i18n_patterns(
      # 原有的需要多语言前缀的业务路由保留在此处
      ...
  )
  
  if settings.DEBUG:
      urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
  

• 缺少MEDIA基础配置：settings.py未配置MEDIA根路径和访问前缀，导致上传路径无法正常解析
  解决方法：在settings.py中补充MEDIA相关配置：

  # settings.py新增配置
  MEDIA_URL = '/media/'
  MEDIA_ROOT = BASE_DIR / 'media'
  

• CKEditor上传配置缺失：默认上传方式未自动携带CSRF令牌，被Django CSRF中间件拦截返回400
  解决方法：在CKEDITOR_CONFIGS的对应配置项中添加上传方式参数：

  # 修正后的CKEDITOR_CONFIGS配置
  CKEDITOR_CONFIGS={
       'myconfig':{
          'toolbar':"Custom",
          'toolbar_Custom':[
              # 原有工具栏配置保持不变
          ],
          'height': 100,
          # 新增以下配置，强制使用表单方式上传自动携带CSRF令牌
          'filebrowserUploadMethod': 'form',
      },
  }
  

• 文件名格式问题：上传的图片文件名包含中文或特殊字符，Django无法正常解析触发400
  解决方法：可自定义上传文件名重命名规则，自动将特殊字符、中文转换为标准ASCII字符，避免解析错误。
• 生产环境配置缺失：DEBUG模式关闭后未配置MEDIA路径代理，同时上传接口未配置对应访问权限
  解决方法：生产环境需用Nginx等服务代理MEDIA路径的访问，同时根据业务需求给ckeditor上传接口配置对应的访问权限校验规则。

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