A serverless Azure Function that provides an HTTP endpoint to upload an image, compress it into WebP format, and store it in Azure Blob Storage.
This function is designed to be a lightweight, scalable, and cost-effective solution for handling image uploads. It intercepts a multipart/form-data request, extracts the image file, uses the high-performance sharp library to compress it, and uploads the result to a specified Azure Blob Storage container. This is ideal for web or mobile applications that need to process user-uploaded images efficiently.
- HTTP Trigger: Simple and accessible via a standard POST request.
 - Multipart Form Parsing: Handles file uploads from web forms or clients.
 - Image Compression: Automatically compresses images to the modern, efficient WebP format using sharp.
 - Configurable Quality: Image compression quality can be controlled via an environment variable.
 - Azure Blob Storage Integration: Securely uploads the processed image to a designated blob container.
 - Scalable & Serverless: Built on Azure Functions to handle load automatically.
 
Before you begin, ensure you have the following installed:
- Node.js (v18 or later recommended)
 - Azure Functions Core Tools
 - Azure CLI
 - An Azure Subscription and an Azure Storage Account
 
git clone https://github.com/gsamansharma/image-upload-compress
cd image-upload-compressnpm installCreate a local.settings.json file in the root of the project. This file is used for local development and should not be committed to source control.
local.settings.json Template:
{
  "IsEncrypted": false,
  "Values": {
    "AzureWebJobsStorage": "",
    "FUNCTIONS_WORKER_RUNTIME": "node",
    "AZURE_STORAGE_CONNECTION_STRING": "DefaultEndpointsProtocol=https...your-connection-string",
    "AZURE_STORAGE_CONTAINER_NAME": "your-container-name",
    "IMAGE_QUALITY": "80"
  }
}AZURE_STORAGE_CONNECTION_STRING: Get this from your Azure Storage Account access keys.AZURE_STORAGE_CONTAINER_NAME: The name of the blob container where images will be stored (e.g.,images).IMAGE_QUALITY: (Optional) A number from 1-100. Defaults to 80.
To start the function on your local machine, run the following command from the project root:
func startThe terminal will display the local URL for your uploadImage function, typically http://localhost:7071/api/uploadImage.
Uploads and processes a single image file.
- Method: POST
 - Headers:
- Content-Type: 
multipart/form-data 
 - Content-Type: 
 - Body: The request body must be 
multipart/form-dataand contain a file field. The field name can be anything (e.g.,image,file,upload). 
Example Request using cURL:
curl -X POST \
  http://localhost:7071/api/uploadImage \
  -F "image=@/path/to/your/image.jpg"{
  "message": "Image uploaded & compressed successfully!",
  "blobUrl": "https://yourstorageaccount.blob.core.windows.net/your-container/uuid-goes-here.webp",
  "originalSize": 102400,
  "compressedSize": 25600
}- 400 Bad Request: Sent if the Content-Type is not 
multipart/form-dataor if no file is found in the request. - 500 Internal Server Error: Sent if an error occurs during compression or upload. The response body will contain the error message.
 
The function's behavior can be customized using the following environment variables:
| Variable | Description | Default | 
|---|---|---|
AZURE_STORAGE_CONNECTION_STRING | 
The connection string for the Azure Storage Account. | null | 
AZURE_STORAGE_CONTAINER_NAME | 
The name of the blob container for storing images. | null | 
IMAGE_QUALITY | 
The quality setting (1-100) for WebP compression. | 80 | 
This project is licensed under the MIT License — see the LICENSE file for details.
Contributions, issues, and feature requests are welcome!
Aman Sharma
📩 contact@amansharma.cv
🌐 amansharma.cv
🌟 Star this repo if you found it useful!