How to Deploy Docker Image in Azure App Service for Container in JavaScript (ES5) PDF Viewer control

17 Mar 2023 / 2 minutes to read

Prerequisites

Have Azure account and Azure CLI setup in your environment.
Run the following command to open the Azure login page. Sign into your Microsoft Azure account.

az login

Step 1: Create a resource group.

Create a resource group using the az group create command.

The following example creates a resource group named pdfviewerresourcegroup in the eastus location.

az group create --name pdfviewerresourcegroup --location "East US"

Step 2: Create an Azure App Service plan.

Create an App Service plan in the resource group with the az appservice plan create command.

The following example creates an App Service plan named pdfviewerappservice in the Standard pricing tier (—sku S1) and in a Linux container (—is-linux).

az appservice plan create --name pdfviewerappservice --resource-group pdfviewerresourcegroup --sku S1 --is-linux

Step 3: Create a Docker Compose app.

Create a multi-container web app in the pdfviewerappservice App Service plan with the az webapp create command. The following command creates the web app using the provided Docker compose file. Please look into the section for getting started with Docker compose to create the Docker compose file for the PDF Viewer server and use the created Docker compose file here.

az webapp create --resource-group pdfviewerappservice --plan pdfviewerappservice --name pdfviewer-server --multicontainer-config-type compose --multicontainer-config-file pdfviewer-server-compose.yml

Step 4: Browse to the app.

Browse to the deployed app at http://<app_name>.azurewebsites.net,. i.e. http://pdfviewerappservice.azurewebsites.net. Open this link in a browser and navigate to the PDF Viewer Web API control http://pdfviewerappservice.azurewebsites.net/api/pdfviewer. It returns the default get method response.

Append the app service running the URL http://pdfviewerappservice.azurewebsites.net/api/pdfviewer to the service URL in the client-side PDF Viewer control. For more information about how to get started with the PDF Viewer control, refer to this getting started page.

For more information about the app container service, please look deeper into the Microsoft Azure Container Service for a production-ready setup.