Javascript 如何将大文件从浏览器发送到Node.js服务器？

我正在尝试使用

data:URL

从客户端向服务器发送图像。我的读取上传图像和向服务器发送数据的功能非常简单：

getTags = event => {
    const file = event.target.files[0];

    if (!file.type.match('image.*')) {
      return;
    }

    const reader = new FileReader();

    reader.onload = (theFile => {
      return (e) => {
        this.sendDataToServer(e.target.result, theFile.type);
      };
    })(file);

    reader.readAsDataURL(file);
  }

sendDataToServer = (data, fileType) => {
    const options = {
      method: 'POST',
      headers: {
        'Content-Type': fileType,
      },
      body: JSON.stringify({data}),
      cache: 'default'
    }
    fetch('http://localhost:5000/img', options)
    .then(res =>  res.text())
    .then(body => {
        console.log(body);
    });
  }

如果在将其放入

sendDataToServer

之前打印

e.target.result

，我会看到一个有效的

数据：URL

因此，我的服务器：

const app = express();
app.use(cors());
app.use(helmet());
app.use(bodyParser.urlencoded({extended: false}));
app.use(bodyParser.json());

app.post('/img', (req, res, next) => {
  const data = decodeURIComponent(req.body.data);
  console.log(data);
  // ... 

但在网络选项卡中的Chrome开发工具中，我看到：

Request URL:http://localhost:5000/img
Request Method:OPTIONS
Status Code:204 No Content
Remote Address:52.15.183.149:80
Response Headers
view source
Access-Control-Allow-Headers:content-type
Access-Control-Allow-Methods:GET,HEAD,PUT,PATCH,POST,DELETE
Access-Control-Allow-Origin:*
Date:Sat, 25 Mar 2017 20:18:09 GMT
X-Powered-By:Express
Request Headers
view source
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6
Access-Control-Request-Headers:content-type
Access-Control-Request-Method:POST
Connection:keep-alive
DNT:1
Host:b580f823.ngrok.io
Origin:http://localhost:3000
Referer:http://localhost:3000/
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 OPR/43.0.2442.1165

---

在服务器my

console.log上，只需打印
undefined
。我不明白为什么会这样。我的错误在哪里？
问题中显示客户端信息的所有内容都表明它在客户端正常工作

因此，似乎服务器端一定存在一些问题，而不是由任何客户端错误引起的

我这样说是因为：

请求的devtools代码段显示了
请求方法：选项
，因为您的
帖子
有一个
内容类型
标题，而不是
应用程序/x-www-form-urlencoded
，
多部分/表单数据
，
或
text/plain

在这种情况下，您的浏览器首先发送CORS飞行前
选项
请求，并期望返回
访问控制允许标头：内容类型
响应标头以及
访问控制允许方法
，包括
POST
，以及
访问控制允许来源

问题中的devtools代码段显示它得到了预期的所有结果，因此它应该随后发送实际的
POST
。您不会为该
POST
显示devtools代码段，但如果您的浏览器没有执行实际的
POST
操作，则会将某种错误记录到devtools控制台

因此，除非我遗漏了什么，否则客户端代码中不会有错误，因此服务器端一定存在导致其失败的问题