Retrieving API Fields from an Azure Static Web App Using a Bash Script

Azure Static Web Apps provide a streamlined full-stack development experience for static site hosting and serverless API endpoints. If you need to retrieve detailed configuration information about your Azure Static Web App, you can use the Azure CLI combined with a simple Bash script to automate this task. 

In this blog post, I'll walk you through a Bash script that retrieves all the API fields from an Azure Static Web App.

Prerequisites

Before running the script, ensure you have the following:

• Azure Account.
• Access to Azure Shell: You want to launch https://shell.azure.com and run the Bash console.

The Bash Script

Below is the Bash script that retrieves all the API fields from an Azure Static Web App.

#!/bin/bash

# Variables
subscriptionId="<subscriptionId>"
resourceGroup="<resourceGroup>"
appName="<appName>"
apiVersion="2023-12-01"

# Get the access token using Azure CLI
echo "Retrieving access token..."
accessToken=$(az account get-access-token --query accessToken --output tsv)
if [ -z "$accessToken" ]; then
    echo "Error: Unable to retrieve access token. Make sure you are logged in with Azure CLI."
    exit 1
fi

# URL for the GET request
url="https://management.azure.com/subscriptions/${subscriptionId}/resourceGroups/${resourceGroup}/providers/Microsoft.Web/staticSites/${appName}?api-version=${apiVersion}"

echo "Making GET request to URL: $url"

# Make the GET request and store the response
response=$(curl -s -w "\nHTTP_STATUS_CODE:%{http_code}" -X GET "$url" \
    -H "Authorization: Bearer $accessToken" \
    -H "Content-Type: application/json")

# Extract HTTP status code from response
http_status=$(echo "$response" | tail -n1 | sed 's/.*HTTP_STATUS_CODE://')

# Extract the response body
response_body=$(echo "$response" | sed '$d')

# Check the HTTP status code
if [ "$http_status" -ne 200 ]; then
    echo "Error: Received HTTP status code $http_status"
    echo "Response body: $response_body"
    exit 1
fi

# Print the entire response body
echo "Response body:"
echo "$response_body" | jq .

Script Explanation

Let's take a look at what each section of the script means.

Variable Definitions: The script starts by defining the variables 'subscriptionId', 'resourceGroup', 'appName', and 'apiVersion'. Replace the placeholders with your actual Azure subscription ID, resource group name, and app name.

Access Token Retrieval: 

accessToken=$(az account get-access-token --query accessToken --output tsv)

The script retrieves an access token using the Azure CLI. This token is required for authentication when making API requests to Azure.

URL Definition:

url="https://management.azure.com/subscriptions/${subscriptionId}/resourceGroups/${resourceGroup}/providers/Microsoft.Web/staticSites/${appName}?api-version=${apiVersion}"

 The script constructs the URL for the GET request using the provided subscription ID, resource group, app name, and API version.

Making the GT Request:

response=$(curl -s -w "\nHTTP_STATUS_CODE:%{http_code}" -X GET "$url" \
-H "Authorization: Bearer $accessToken" \
-H "Content-Type: application/json")

The script makes a GET request to the constructed URL using `curl`. The `-s` flag suppresses progress output, and `-w "\nHTTP_STATUS_CODE:%{http_code}"` appends the HTTP status code to the response.

HTTP Status Code Handling:

http_status=$(echo "$response" | tail -n1 | sed 's/.*HTTP_STATUS_CODE://')
response_body=$(echo "$response" | sed '$d')

 The script extracts the HTTP status code and the response body from the `curl` output. If the HTTP status code is not 200, it prints an error message and exits.

Printing the Response:

echo "$response_body" | jq .

The script uses jq to pretty-print the JSON response body, which contains all the API fields of the Azure Static Web App.

Running the Script

• Open your web browser.
• Navigate to https://shell.azure.com/
• Log in with your Azure account credentials.
  •   - If you don't have an account, you will need to create one.

• Select the Bash environment (if prompted to choose between Bash and PowerShell).
• To create a new file to store your script in, type the following command and press Enter:

touch get_static_web_app_details.sh

• To open the VS Code editor built into the Azure Cloud Shell, type in the following command:

code get_static_web_app_details.sh

• Copy your bash script from above into the new file you've created.

• After pasting your script, save the file by using the command Ctrl + S (Cmd + S on Mac).
• To close VSCode and return to the Bash shell, use the command Ctrl + Q.

We now need to make the file executable within our environment. Type in the following command:

chmod +x get_static_web_app_details.sh

It's now time to run the script, we can do this by typing the command:

./get_static_web_app_details.sh

Conclusion

This Bash script provides a simple and effective way to retrieve all the API fields from your Azure Static Web App. By leveraging the Azure CLI and `curl`, you can automate the retrieval of detailed configuration information, which can be helpful for monitoring, troubleshooting, or documenting your web app's setup.