createUiDefinition.json for ARM Azure web app

Question

I have created the ARM template for azure web app. I need to publish the ARM template to azure market place. I have used the azure publish portal https://publish.windowsazure.com/workspace/multi-resource-solutions for publishing the ARM template.

To on-board the ARM template to azure market place zip file must contain a mainTemplate.json and createUiDefinition.json. I found some samples for createUiDefination.json file in https://github.com/Azure/azure-quickstart-templates but all the createUiDefination.json is for VM. I am unable to find the samples or tutorials for createUiDefination.json for Azure web app.

I need to validate the azure web app site name is already exists or not. Also need to create or use the app service plan.

Is there is any tutorial or sample for creating createUiDefination.json for azure web app?

Answer 1

Validating an app service's name is possible in createUiDefinition.json.

The crux of it is the Microsoft.Solutions.ArmApiControl, which can be used to call ARM apis as part of the validation of a text box. Here is an example:

    {
      "$schema": "https://schema.management.azure.com/schemas/0.1.2-preview/CreateUIDefinition.MultiVm.json#",
      "handler": "Microsoft.Azure.CreateUIDef",
      "version": "0.1.2-preview",
      "parameters": {
        "basics": [
          {}
        ],
        "steps": [
          {
            "name": "domain",
            "label": "Domain Names",
            "elements": [
              {
                  "name": "domainInfo",
                  "type": "Microsoft.Common.InfoBox",
                  "visible": true,
                  "options": {
                      "icon": "Info",
                      "text": "Pick the domain name that you want to use for your app."
                  }
              },
              {
                "name": "appServiceAvailabilityApi",
                "type": "Microsoft.Solutions.ArmApiControl",
                "request": {
                  "method": "POST",
                  "path": "[concat(subscription().id, '/providers/Microsoft.Web/checknameavailability?api-version=2021-02-01')]",
                  "body": "[parse(concat('{\"name\":\"', concat('', steps('domain').domainName), '\", \"type\": \"Microsoft.Web/sites\"}'))]"
                }
              },
              {
                "name": "domainName",
                "type": "Microsoft.Common.TextBox",
                "label": "Domain Name Word",
                "toolTip": "The name of your app service",
                "placeholder": "yourcompanyname",
                "constraints": {
                  "validations": [
                    {
                      "regex": "^[a-zA-Z0-9]{4,30}$",
                      "message": "Alphanumeric, between 4 and 30 characters."
                    },
                    {
                      "isValid": "[not(equals(steps('domain').appServiceAvailabilityApi.nameAvailable, false))]",
                      "message": "[concat('Error with the url: ', steps('domain').domainName, '. Reason: ', steps('domain').appServiceAvailabilityApi.reason)]"
                    },
                    {
                      "isValid": "[greater(length(steps('domain').domainName), 4)]",
                      "message": "The unique domain suffix should be longer than 4 characters."
                    },
                    {
                      "isValid": "[less(length(steps('domain').domainName), 30)]",
                      "message": "The unique domain suffix should be shorter than 30 characters."
       

             }
              ]
            }
          },
          {
            "name": "section1",
            "type": "Microsoft.Common.Section",
            "label": "URLs to be created:",
            "elements": [
              {
                "name": "domainExamplePortal",
                "type": "Microsoft.Common.TextBlock",
                "visible": true,
                "options": {
                    "text": "[concat('https://', steps('domain').domainName, '.azurewebsites.net - The main app service URL')]"
                }
              }
            ],
            "visible": true
          }
        ]
      }
    ],
    "outputs": {
      "desiredDomainName": "[steps('domain').domainName]"
    }
  }
}

You can paste that in to the createUiDefinition.json sandbox azure provides to test it out.

To look at how to do an Azure App Service instead of a VM, look in to documentation like this and use it as the maintemplate.json in the app.zip package.