Skip to content
Deep Thought

Exercise Azure Functions and Storage Account

Exercise Azure Functions and Storage Account

Build the following Application: AzureFunctionsStorageAccountArchitecture.excalidraw.svg

Function App

The function app consists of 6 individual functions:

Input Form

  • HTTP Trigger
  • Route: /input-form
  • Method: GET
  • Returns a text/html content (a HTML website), the search input
  • HTTP Trigger
  • Route: /search
  • Method: POST
  • Performs an image search using some external service using REST (e.g. unsplash)
  • Gathers a list of matching images for the entered search tearm (limited to 20 images maximum per search)
  • Inserts the found image URLs alongside with the search tearm as individual messages into a storage queue
  • Returns a 200 OK result when everything was handled correctly

Image Loader

  • Queue Trigger
  • Receives an individual image url and the corresponding search term from the queue message
  • Downloads the image from the specified URL and uploads it into the blob storage

Thumbnail Generator

  • Blob trigger
  • Acts whenever an image is uploaded to the blob storage
  • Loads the image, generates a smaller thumbnail for it (use a suiting NuGet package for that)
  • Uploads the generated thumbnail to the blob storage
  • Make sure that the thumbnail generator ignores thumbnail uploads. Otherwise it would be called indefinitely
  • Pick a storage scheme that supports differentiating between raw images and thumbnails, but allows inferring the thumbnail blob name/location from the raw blob name/location and vice-versa.
  • HTTP Trigger
  • Route: /gallery?search=value
  • Method: GET
  • Returns a HTML page with a simple list of images (show the thumbnails) for the entered search term. thumbnail images should be links to original (raw images) in the blob storage
  • If the search term hasn’t been searched for previously, return an empty page with a message “Search term not found. Use search first to gather images”

Additional information

You can develop and test the entire system locally on your system using the emulator system that comes with the Azure Toolkit. Use the Azure Storage Explorer to connect to your locally emulated storage account.

For the HTML pages you serve from the Azure Functions, you can use hardcoded strings in code. It might be better though if you use HTML pages uploaded in the blob storage, so you can easily change them without redeploying the application.

For the images to be available publicly (and show up in your HTML page by only using the URL from the blob storage as img src) the storage container must allow public container access. This is a setting to be specified upon storage account creation. An alternative is to generate SAS tokens whenever you want to access the images. This allows you to generate links to the images that contain an access token that will expire after some time. This option is more secure, but a little more development effort for creating the SAS tokens on every access to the Gallery Service.