Cloud storage integration concept in Express - Mini Project: Build & Apply

Cloud Storage Integration Concept with Express

📖 Scenario: You are building a simple Express server that can upload files to a cloud storage service. This project will guide you through setting up the data, configuring the cloud storage client, writing the upload logic, and completing the Express route to handle file uploads.

🎯 Goal: Build an Express server with a route /upload that accepts a file and uploads it to a cloud storage bucket using a configured client.

📋 What You'll Learn

Create an Express app instance

Configure a cloud storage client variable

Write an async function to upload a file to the cloud storage

Add an Express POST route /upload that uses the upload function

💡 Why This Matters

🌍 Real World

Uploading files to cloud storage is common in web apps for saving images, documents, or backups.

💼 Career

Understanding how to connect Express servers with cloud storage services is valuable for backend development roles.

1

DATA SETUP: Create Express app instance

Create a variable called express by requiring the 'express' module. Then create a variable called app by calling express().

Express

const express = require('express');
// Your code here

Hint

Use require('express') to import Express and then call it to create the app.

2

CONFIGURATION: Setup cloud storage client variable

Create a variable called storageClient and assign it the string value 'CloudStorageClient' to simulate a cloud storage client setup.

Express

const express = require('express');
const app = express();
// Your code here

Hint

Just create a variable named storageClient and assign it the string 'CloudStorageClient'.

3

CORE LOGIC: Write async upload function

Write an async function called uploadFile that takes a parameter file. Inside, return a resolved Promise with the string 'Uploaded ' + file.

Express

const express = require('express');
const app = express();
const storageClient = 'CloudStorageClient';
// Your code here

Hint

Create an async function that returns a resolved Promise with the message including the file name.

4

COMPLETION: Add POST /upload route using uploadFile

Add a POST route on app at path '/upload' that takes req and res. Inside, call uploadFile with req.body.file and send the result as the response.

Express

const express = require('express');
const app = express();
const storageClient = 'CloudStorageClient';

async function uploadFile(file) {
    return Promise.resolve('Uploaded ' + file);
}
// Your code here

Hint

Use app.post with an async callback. Call uploadFile with req.body.file and send the result.

Practice

1. What is the main purpose of integrating cloud storage with an Express app?

easy

A. To store Express app logs locally

B. To speed up the Express server response time

C. To replace the Express router functionality

D. To save and share files online safely

Solution

1. Step 1: Understand cloud storage role

   Cloud storage is used to save files online so they can be accessed safely from anywhere.

2. Step 2: Relate to Express app integration

   Integrating cloud storage with Express allows the app to upload and store files securely in the cloud.

3. Final Answer:

   To save and share files online safely -> Option D

4. Quick Check:

   Cloud storage = safe online file saving [OK]

Hint: Cloud storage means saving files online safely [OK]

Common Mistakes:

• Thinking cloud storage speeds up server response
• Confusing cloud storage with routing features
• Assuming cloud storage is for local logs

2. Which middleware is commonly used in Express to handle file uploads before sending to cloud storage?

easy

A. body-parser

B. cors

C. multer

D. helmet

Solution

1. Step 1: Identify middleware for file uploads

   Multer is a popular Express middleware designed specifically to handle multipart/form-data, which is used for uploading files.

2. Step 2: Confirm other options' roles

   Cors handles cross-origin requests, body-parser parses JSON or urlencoded data, helmet adds security headers. None handle file uploads.

3. Final Answer:

   multer -> Option C

4. Quick Check:

   File upload middleware = multer [OK]

Hint: Multer handles file uploads in Express [OK]

Common Mistakes:

• Choosing cors for file uploads
• Confusing body-parser with file upload handling
• Selecting helmet which is for security headers

3. Given this Express snippet using multer and AWS SDK, what will be the output if the upload succeeds?

const upload = multer({ dest: 'uploads/' });
app.post('/upload', upload.single('file'), async (req, res) => {
  const params = { Bucket: 'mybucket', Key: req.file.filename, Body: fs.createReadStream(req.file.path) };
  await s3.upload(params).promise();
  res.send('Upload successful');
});

medium

A. SyntaxError: Unexpected token

B. Upload successful

C. Error: Missing file parameter

D. Upload failed due to AWS credentials

Solution

1. Step 1: Analyze multer usage

   Multer saves the uploaded file to 'uploads/' and adds file info to req.file, so req.file.filename and req.file.path exist.

2. Step 2: Check AWS upload call

   The s3.upload call uses the file stream correctly and awaits the promise, so if AWS credentials are correct, upload succeeds.

3. Final Answer:

   Upload successful -> Option B

4. Quick Check:

   Correct multer + AWS upload = success message [OK]

Hint: If multer and AWS upload succeed, response is success message [OK]

Common Mistakes:

• Assuming syntax error due to async/await
• Forgetting multer adds req.file
• Ignoring AWS credentials setup

4. Identify the error in this Express route for uploading to Google Cloud Storage:

app.post('/upload', upload.single('file'), (req, res) => {
  const bucket = storage.bucket('mybucket');
  bucket.upload(req.file.path, (err, file) => {
    if (err) res.status(500).send('Upload error');
  });
  res.send('File uploaded');
});

medium

A. Missing await or callback handling before sending response

B. Incorrect bucket name syntax

C. upload.single should be upload.array

D. req.file.path is undefined

Solution

1. Step 1: Check asynchronous upload call

   bucket.upload is asynchronous with a callback, but res.send is called immediately after, not waiting for upload to finish.

2. Step 2: Understand response timing

   Sending response before upload completes can cause wrong success message even if upload fails.

3. Final Answer:

   Missing await or callback handling before sending response -> Option A

4. Quick Check:

   Async upload must finish before response [OK]

Hint: Wait for async upload before sending response [OK]

Common Mistakes:

• Sending response immediately without waiting
• Assuming bucket name syntax is wrong
• Confusing single vs array upload middleware

5. You want to upload multiple files from an Express app to Azure Blob Storage and keep track of their URLs. Which approach correctly handles this scenario? const upload = multer({ dest: 'uploads/' }); app.post('/upload-multiple', upload.array('files'), async (req, res) => { const urls = []; for (const file of req.files) { const blobClient = containerClient.getBlockBlobClient(file.filename); await blobClient.uploadFile(file.path); urls.push(blobClient.url); } res.json({ uploadedUrls: urls }); });

hard

A. Uploads files sequentially, collects URLs, then responds with JSON list

B. Uploads files but responds before uploads finish

C. Uses upload.single instead of upload.array for multiple files

D. Does not push URLs to array, so response is empty

Solution

1. Step 1: Check multer usage for multiple files

   upload.array('files') correctly handles multiple files and stores them in req.files array.

2. Step 2: Analyze upload loop and response

   The for loop uses await to upload each file sequentially, pushes each URL to the urls array, then sends JSON response with all URLs.

3. Final Answer:

   Uploads files sequentially, collects URLs, then responds with JSON list -> Option A

4. Quick Check:

   Sequential upload + URL collection = correct response [OK]

Hint: Use upload.array and await loop to collect URLs before response [OK]

Common Mistakes:

• Using upload.single for multiple files
• Responding before uploads finish
• Forgetting to collect URLs in array