JS拖拽文件上传调用.send(formData)报GET upload.php 404错误求助

为什么代码写的POST请求，控制台报GET请求404？ #

你遇到的是HTTP重定向的常见特性：当服务器对POST请求返回301/302重定向响应时，浏览器会自动将后续的重定向请求改为GET方法，同时丢弃所有原POST请求携带的表单数据，所以你才会看到明明写的POST，最终报错却是GET请求404。

具体问题排查&修复步骤 #

• 第一步：核对文件路径
  先确认upload.php和index.php存放在网站根目录的同一级文件夹下，且文件名大小写完全匹配（Linux服务器区分大小写，Windows不区分，经常出现本地正常线上404的情况）。
  可以直接在浏览器地址栏输入完整的upload.php访问地址，比如http://你的域名/upload.php，如果能正常返回空数组[]就说明路径没问题，如果还是404就是文件存放位置不对，调整到对应路径即可。
• 第二步：修正请求路径写法
  将JS代码中相对路径的请求改为绝对路径，避免相对路径解析错误：
  找到JS中的xhr.open('post', 'upload.php');，修改为xhr.open('post', '/upload.php');，开头的斜杠代表从网站根目录开始查找文件，不会受当前页面路径影响。
• 第三步：排查服务器重定向规则
  检查你网站的重写规则（比如Apache的.htaccess文件、Nginx的rewrite配置），有没有规则会将.php后缀的请求重定向到其他地址，如果有的话需要将upload.php排除在重写规则之外，避免触发重定向。

其他需要注意的兼容问题 #

• 提前在项目根目录创建uploads文件夹，Linux环境下需要给该文件夹设置755权限，否则文件移动会失败。
• HTML中的提示文案笔误：Drop files fere to upload可以改为Drop files here to upload，不影响功能可按需修改。

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