Simple Dash App runs on localhost but will not run on Microsoft Azure Web App

Mick McCafferty 0 Reputation points
2023-09-17T01:21:25.88+00:00

I am using the latest version of VSCode and have written the simplest of dash apps:

from dash import Dash, dcc, html
app = Dash(__name__)
app.layout = html.Div([
dcc.Markdown(''' ### Ayup python world ''')
])
if __name__ == '__main__'
    app.run_server()

This runs on my localhost without issue.

I have a folder on my desktop named "practice" and I used "python -m venv venv" to set up a virtual environment. I then activated the venv using "venv\Scripts\activate", downloaded dash using "pip install dash" and generated a requirements.txt file "pip freeze > requirements.txt".

folder structure:

practice:

>venv
app.py
requirements.text

To learn how to use Microsoft Azure I set-up a free trail acount and also installed Docker on my laptop.

I then installed the Azure and Docker extensions in VScode and then generated an image of my app using Docker:

CTRL-SHIFT P Docker Images: Build Image... <enter>

Couldn't find a Dockerfile in your workspace. Would you like to add Docker files to the workspace? <Yes> Python General Enter a Python module instead - app.py include optional Docker Compose files? - No

Here's the Dockerfile:

# For more information, please refer to https://aka.ms/vscode-docker-python
FROM python:3.10-slim

# Keeps Python from generating .pyc files in the container
ENV PYTHONDONTWRITEBYTECODE=1

# Turns off buffering for easier container logging
ENV PYTHONUNBUFFERED=1

# Install pip requirements
COPY requirements.txt .
RUN python -m pip install -r requirements.txt

WORKDIR /app
COPY . /app

# Creates a non-root user with an explicit UID and adds permission to access the /app folder
# For more info, please refer to https://aka.ms/vscode-docker-python-configure-containers
RUN adduser -u 5678 --disabled-password --gecos "" appuser && chown -R appuser /app
USER appuser

# During debugging, this entry point will be overridden. For more information, please refer to https://aka.ms/vscode-docker-python-debug
CMD ["python", "-m", "app.py"]

New folder structure

practice:

>venv
>.vscode
.dockerignore
app.py
Dockerfile
requirements.text

I then went to my Azure subscription and setup a container registry, a resource group and an App service:

Create a resource Container Registry - Create Subscription - Azure subscription 1 Resource group - Create new - mick-practice-resource-group Registry name - mickPracticeRegistry Location - Canada Central Pricing plan - Basic Review and Create - Validation passed Create - Deployment succeeded

App Services Create - Web App Subscription - Azure subscription 1 Resource group - Create new - mick-practice-resource-group Name - mickPracticeApp Publish - Docker Container Operating System - Linux Location - Canada Central Linux plan - (New) ASP-mickpracticeresorucegroup-809e Pricing plan - Free F1 (Shared infrastructure) Zone redundancy - Disabled Review and Create Create - Your deployment is complete

I then went back to VSCode to the Docker extension: under Images Right Click on Practice:latest Push - mickpracticeregistry.azurecr.io/practice:latest Push successful

App opened on http://127.0.0.1:8050/ without issue

In Docker went to Registries, clicked connect icon and connected. clicked refresh and practice folder appeared dropdown revealed latest right clicked on latest and selected Deploy Image to Azure App Service... Name: mickPracticeWebApp Resource group: mick-practice-resource-group Service plan: ASP-mickpracticeresorucegroup-809e

Successfully created web app "mickPracticeWebApp" https://mickpracticewebapp.azurewebsites.net

Clicked Open Site

Do you want Code to open external website? Open

New window opens with Loading and circling ellipse until ":( Application Error If you are the application administrator, you can access the diagnostic resources."

I have spent a couple of days trying to understand what's happening to no avail. I think this has something to do with the app.run_server() line. I have also tried with app.run_server(host='0.0.0.0', port='8050) and app.run_server(host='0.0.0.0', port='80).

It's driving me crazy. Can anyone point me in the right direction please.

Azure App Service
Azure App Service
Azure App Service is a service used to create and deploy scalable, mission-critical web apps.
7,756 questions
{count} votes

1 answer

Sort by: Most helpful
  1. brtrach-MSFT 16,346 Reputation points Microsoft Employee
    2023-09-25T02:08:18.35+00:00

    @Mick McCafferty It seems like you have done everything correctly so far. However, there are a few things that you can check to see if they are causing the issue.

    Firstly, make sure that you have exposed the correct port in your Dockerfile. In your case, you are using port 8050, so you need to add the following line to your Dockerfile:

    EXPOSE 8050

    This will allow the port to be exposed to the outside world.

    Secondly, make sure that you have set the correct startup command in your App Service. You can do this by going to your App Service in the Azure portal, clicking on "Configuration" in the left-hand menu, and then scrolling down to the "Startup Command" section. In your case, the startup command should be:

    python -m app
    
    
    

    This will start your Dash app when the container is started.

    Finally, make sure that you have set the correct environment variables in your App Service. You can do this by going to your App Service in the Azure portal, clicking on "Configuration" in the left-hand menu, and then scrolling down to the "Application settings" section. Here, you need to add two settings:

    • WEBSITES_PORT: set this to 8050
    • WEBSITES_CONTAINER_START_TIME_LIMIT: set this to 1800

    The first setting tells Azure which port to use for your app, and the second setting tells Azure how long to wait for your app to start up before timing out.

    Once you have made these changes, try redeploying your app and see if it works. If you still have issues, you can check the logs in the Azure portal to see if there are any error messages that might help you diagnose the problem.

    1 person found this answer helpful.
    0 comments No comments

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.