Multer 上传文件时损坏 UTF8 文件名

Mar*_*ger 9 utf-8 multer nestjs

使用 axios http 客户端将具有 UTF-8 文件名的文件 POST 到 Multer 的正确方法是什么?Chrome 似乎正在为 multipart/form-data 正文发送正确编码的有效负载

Mar*_*ger 20

长话短说

\n

为 Multer 添加以下配置:

\n
function checkFileType(req, file, cb) {\n    // Update file name\n    file.originalname = Buffer.from(file.originalname, \'latin1\').toString(\n      \'utf8\',\n    );\n\n    cb(null, true);\n}\nfunction createMulterOptions(): MulterOptions {\n    return {\n      fileFilter: checkFileType,\n      limits: {\n        fileSize: APPLICATION_CONSTANTS.DOCUMENTS.MAXIMUM_FILE_SIZE,\n      },\n    };\n  }\n
Run Code Online (Sandbox Code Playgroud)\n

请注意,此解决方法可能会破坏对正确遵循 RFC 规范的 curl 或其他客户端的支持

\n

问题和解决方案的准确描述

\n

昨天,我在利用 Busboy 和 multer 将文件发布到 Nestjs 服务来处理多部分/表单数据上传时遇到了问题。

\n

查看 Chrome DevTools Network 选项卡,有效负载如下所示:

\n
------WebKitFormBoundary5XkFkxkb2RYryGSn\nContent-Disposition: form-data; name="document"; filename="P\xc3\xa4terP\xc3\xa4n.pdf" \nContent-Type: application/pdf\n\n\n------WebKitFormBoundary5XkFkxkb2RYryGSn--\n
Run Code Online (Sandbox Code Playgroud)\n

采用与 US-ASCII 不同编码的 RFC2388 文件名应按如下方式传输:

\n
------WebKitFormBoundary5XkFkxkb2RYryGSn\nContent-Disposition: form-data; name="document"; filename="P\xc3\xa4terP\xc3\xa4n.pdf" filename*=UTF-8\'\'P%C3%A4terP%C3%A4n%F0%9F%98%82.pdf\nContent-Type: application/pdf\n\n\n------WebKitFormBoundary5XkFkxkb2RYryGSn--\n
Run Code Online (Sandbox Code Playgroud)\n

UTF-8\'\'... 之后的部分是 URI 编码的 UTF-8 文件名。

\n

知道这一点后,我寻找了一个关于如何强制 javascript fetch 的解决方案,后来又寻找 axios HTTP 客户端来正确设置该值。我找不到任何解决方案。

\n

因此解决此问题的唯一方法是强制 Multer 或 Busboy 将文件名解析为 UTF-8。如果 Multer 公开 Busboy 实例或允许提供自定义 Busboy 配置,那么事情就不会那么复杂。\n然后我发现此拉取请求提供了解决方法: https: //github.com/expressjs/multer/pull/1102

\n

然后,我按照上面 TL;DR 部分所述更改了 Multer 的 Nestjs 配置。

\n

  • 可能您在更改文件名后忘记了“cb(null, true)”来接受文件 (2认同)