Fixed multipart file uploads not working

backend/web-bff/App/package.json

@@ -8,6 +8,7 @@
   "dependencies": {
     "@azure/msal-node": "^2.6.4",
     "axios": "^1.6.8",
+    "busboy": "^1.6.0",
     "connect-mongo": "^5.1.0",
     "cookie-parser": "^1.4.6",
     "cookie-session": "^2.1.0",
@@ -18,6 +19,7 @@
     "express": "^4.19.1",
     "express-rate-limit": "^7.2.0",
     "express-session": "^1.18.0",
+    "form-data": "^4.0.0",
     "hbs": "^4.2.0",
     "helmet": "^7.1.0",
     "hpp": "^0.2.3",

backend/web-bff/App/routes/api.js

@@ -5,8 +5,9 @@ const router = express.Router();
 
 const fetch = require('../fetch');
 
-const { BACKEND_API_ENDPOINT, msalConfig, REDIRECT_URI} = require('../authConfig');
+const {BACKEND_API_ENDPOINT, msalConfig, REDIRECT_URI} = require('../authConfig');
 const isAuthenticated = require('../util/isAuthenticated');
+const handleMultipart = require('../util/handleMultipart');
 
 /**
  *  Route that captures every method and route starting with /web/api.
@@ -18,17 +19,22 @@ const isAuthenticated = require('../util/isAuthenticated');
 router.all('/*',
     isAuthenticated("/web/auth/signin"),
     authProvider.acquireToken({
-    scopes: [msalConfig.auth.clientId + "/.default"],
-    redirectUri: REDIRECT_URI
+        scopes: [msalConfig.auth.clientId + "/.default"],
+        redirectUri: REDIRECT_URI
     }),
-    async function(req, res, next) {
-
-    try {
-        const response = await fetch( "api" + req.url , req.session.accessToken, req.method, req.body, req.headers)
-        res.status(response.code).send(response.data)
-    } catch(error) {
-        next(error);
+    async function (req, res, next) {
+        const contentType = req.headers['content-type'];
+        if (contentType && contentType.includes('multipart/form-data')) {
+            handleMultipart(req, res, next);
+        } else {
+            try {
+                const response = await fetch("api" + req.url, req.session.accessToken, req.method, req.body, req.headers)
+                res.status(response.code).send(response.data)
+            } catch (error) {
+                next(error);
+            }
+        }
     }
-    })
+)
 
 module.exports = router;

backend/web-bff/App/util/handleMultipart.js

@@ -0,0 +1,34 @@
+const busboy = require('busboy');
+const FormData = require('form-data');
+const fetch = require('../fetch');
+
+function handleMultipart(req, res, next) {
+    console.log("multipart")
+
+    const bb = busboy({headers: req.headers});
+    const form = new FormData();
+
+    bb.on('file', (name, file, info) => {
+        const {filename, encoding, mimetype} = info;
+        file.on('data', (data) => {
+            form.append(name, data, {filename, contentType: mimetype});
+        });
+    });
+
+    bb.on('field', (fieldname, val) => {
+        form.append(fieldname, val);
+    });
+
+    bb.on('close', async () => {
+        try {
+            const response = await fetch("api" + req.url, req.session.accessToken, req.method, form, form.getHeaders())
+            res.status(response.code).send(response.data);
+        } catch (error) {
+            next(error);
+        }
+    });
+
+    req.pipe(bb);
+}
+
+module.exports = handleMultipart;