React应用部署DigitalOcean后图片上传POST请求变为OPTIONS问题求助

1. 禁止手动设置multipart/form-data请求头 #

你手动添加Content-Type的操作本身就是错误的：当你使用FormData作为请求体时，浏览器会自动生成包含正确boundary参数的Content-Type: multipart/form-data请求头，手动指定这个头会覆盖浏览器生成的正确边界值，导致后端无法正常解析表单数据，这也是你修改后本地也出现异常的直接原因，先把这部分配置删除，还原请求头的初始写法。

2. 解决线上CORS预检请求问题 #

你看到的OPTIONS请求是浏览器的跨域资源共享（CORS）预检请求，当前端域名和后端接口域名不一致时，浏览器会自动先发送OPTIONS请求校验后端是否允许当前跨域请求，Postman不会触发CORS校验因此请求正常。你看到的线上日志只有OPTIONS请求，是因为预检请求未通过校验，浏览器直接拦截了后续的正式POST请求，并不是Content-Type自动生成逻辑失效，预检通过后浏览器会自动发送带正确Content-Type的POST请求。
你的后端是Django框架，按以下步骤配置CORS规则即可：

• 安装CORS处理依赖：

pip install django-cors-headers

• 修改项目settings.py配置：
  • 在INSTALLED_APPS中新增corsheaders
  • 在MIDDLEWARE列表最顶部添加corsheaders.middleware.CorsMiddleware（必须放在django.middleware.common.CommonMiddleware之前）
  • 新增以下CORS配置：

# 允许的前端域名，填写你DigitalOcean上的前端域名
CORS_ALLOWED_ORIGINS = [
    "https://aaa-admin-dev-9aloh.ondigitalocean.app"
]
# 允许携带认证头
CORS_ALLOW_CREDENTIALS = True
# 允许的请求头，包含你用到的authorization和自动生成的content-type
CORS_ALLOW_HEADERS = [
    "authorization",
    "content-type"
]

配置完成后重启后端服务即可解决OPTIONS请求阻塞的问题。

3. 本地ConnectionResetError警告说明 #

这个警告是Django内置开发服务器的已知偶发问题，仅在本地开发环境出现，不会影响实际功能，生产环境部署时使用Gunicorn、uWSGI等生产级服务器就不会出现该警告，无需额外处理。

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