javascript - 如何在 Cloud Functions for Firebase 上使用 Express 执行 HTTP 文件上传(multer、busboy)

Question

我正在尝试将文件上传到 Cloud Functions，使用 Express 处理那里的请求，但我没有成功。我创建了一个可以在本地运行的版本:

服务器端js

const express = require('express');
const cors = require('cors');
const fileUpload = require('express-fileupload');

const app = express();
app.use(fileUpload());
app.use(cors());

app.post('/upload', (req, res) => {
    res.send('files: ' + Object.keys(req.files).join(', '));
});

客户端js

const formData = new FormData();
Array.from(this.$refs.fileSelect.files).forEach((file, index) => {
    formData.append('sample' + index, file, 'sample');
});

axios.post(
    url,
    formData, 
    {
        headers: { 'Content-Type': 'multipart/form-data' },
    }
);

当部署到 Cloud Functions(其中 req.files 未定义)时，完全相同的代码似乎会崩溃。有谁知道这里发生了什么吗？

编辑我还尝试过使用 multer，它在本地工作得很好，但是一旦上传到 Cloud Functions，这就会给我一个空数组(相同的客户端代码):

const app = express();
const upload = multer();
app.use(cors());

app.post('/upload', upload.any(), (req, res) => {
    res.send(JSON.stringify(req.files));
});

Answer 1

Cloud Functions 设置中确实发生了重大更改，从而触发了此问题。它与应用于所有用于提供 HTTPS 功能的 Express 应用程序(包括默认应用程序)的中间件的工作方式有关。基本上，Cloud Functions 将解析请求的正文并决定如何处理它，将正文的原始内容保留在 req.rawBody 的缓冲区中。您可以使用它直接解析多部分内容，但不能使用中间件(如 multer)来执行此操作。

相反，您可以使用名为 busboy 的模块直接处理原始 body 内容。它可以接受 rawBody 缓冲区，并会用它找到的文件回调您。下面是一些示例代码，它将迭代所有上传的内容，将它们保存为文件，然后删除它们。您显然会想做一些更有用的事情。

const path = require('path');
const os = require('os');
const fs = require('fs');
const Busboy = require('busboy');

exports.upload = functions.https.onRequest((req, res) => {
    if (req.method === 'POST') {
        const busboy = new Busboy({ headers: req.headers });
        // This object will accumulate all the uploaded files, keyed by their name
        const uploads = {}

        // This callback will be invoked for each file uploaded
        busboy.on('file', (fieldname, file, filename, encoding, mimetype) => {
            console.log(`File [${fieldname}] filename: ${filename}, encoding: ${encoding}, mimetype: ${mimetype}`);
            // Note that os.tmpdir() is an in-memory file system, so should only 
            // be used for files small enough to fit in memory.
            const filepath = path.join(os.tmpdir(), fieldname);
            uploads[fieldname] = { file: filepath }
            console.log(`Saving '${fieldname}' to ${filepath}`);
            file.pipe(fs.createWriteStream(filepath));
        });

        // This callback will be invoked after all uploaded files are saved.
        busboy.on('finish', () => {
            for (const name in uploads) {
                const upload = uploads[name];
                const file = upload.file;
                res.write(`${file}\n`);
                fs.unlinkSync(file);
            }
            res.end();
        });

        // The raw bytes of the upload will be in req.rawBody.  Send it to busboy, and get
        // a callback when it's finished.
        busboy.end(req.rawBody);
    } else {
        // Client error - only support POST
        res.status(405).end();
    }
})

请记住，保存到临时空间的文件会占用内存，因此它们的大小总计应限制为 10MB。对于较大的文件，您应该将其上传到 Cloud Storage 并使用存储触发器对其进行处理。

另请记住，Cloud Functions 添加的中间件的默认选择目前尚未通过 firebaseserve 添加到本地模拟器。因此，在这种情况下，此示例将不起作用(rawBody 将不可用)。

团队正在努力更新文档，以便更清楚地了解与标准 Express 应用不同的 HTTPS 请求期间发生的所有情况。