Azure 容器应用，一个基于 Python Flask、Plotly Dash 和 Docker 的数据分析 WebApp
图片由 Tima Miroshnichenko 在 Pexels 提供
当涉及到在 Python 中开发数据分析 Web 应用程序时，Plotly 的 Dash 和 Streamlit 等框架是目前最受欢迎的。但是，如何在考虑可扩展性、效率和成本的同时，利用最新的云计算解决方案来部署这些框架，并超越教程，实现实际应用呢？
在本文中，我们将介绍使用 Plotly Dash 前端和 Flask 后端部署容器化应用程序，这些应用程序使用 Docker 容器化，并部署到 Microsoft Azure 的容器应用服务。我们不会仅仅依赖现成的 Dash 解决方案，而是部署一个定制的 Flask 服务器。这种方法增加了应用程序的灵活性，使得可以在 Dash 和其他框架一起使用，并克服了开源 Dash 相比 Dash Enterprise 的一些限制。
本教程的代码示例可在 Github 上找到。
Microsoft Azure 容器应用服务
图片由 Microsoft 提供
Azure 容器应用提供基于 Kubernetes 平台的成本效益高、可扩展且完全管理的应用服务。使用 Docker 创建的容器化应用程序镜像可以轻松部署，运行在云上时所需的管理量最小。大部分繁重的工作由 Azure 管理，以可管理的成本提供可扩展性。
可扩展的成本选项非常适合基于内部网络的内部应用，其中大部分消费发生在内部，用户以类似于与 PowerBI 或 Tableau 服务交互的方式与应用程序进行交互。然而，与 PowerBI 或 Tableau 不同，托管数据 Web 应用提供了无需用户许可费用的优势，以及克服这些仪表板工具限制的灵活性。当与 Plotly Dash 等框架在 Python 中的开发便利性相结合时，它为其他仪表板解决方案提供了一个强大的替代方案。
Plotly Dash
Dash 珍贵贸易应用截图由 Tanya Lomskaya
Plotly 是一个流行的数据可视化框架，支持多种编程语言，如 Python、R、JavaScript 和 Matlab。由 Plotly 开发的 Dash 是一个用于构建高度交互式数据应用的框架。它使用 Python Flask 服务器，并利用 React 构建交互式 Web 应用，使用户能够完全使用 Python 开发数据应用。此外，它还提供了根据需要集成自定义 HTML/CSS/JavaScript 元素的灵活性。
尽管存在像 Streamlit 这样的替代方案，可以在 Python 中构建数据分析应用，但本文将专门介绍 Dash，因为它使用 Python Flask 作为后端服务。Dash 对 Flask 的使用提供了显著的灵活性，允许在同一网站上共存各种应用。例如，应用的一些部分可以使用纯 HTML/CSS/JavaScript 或 React 构建，而其他部分可能包含嵌入的 PowerBI 报告。
Dash 有两种版本：开源和企业。我们将重点关注开源版本，讨论其限制，如安全管理，这可以通过使用自定义 Flask 服务器得到增强。
Flask
Python 的 Flask 库是一个轻量级但功能强大的 Web 框架。其轻量级设计特别适合可能没有丰富 Web 开发经验的数据分析专业人士，他们更喜欢从一个简约的框架开始。
Flask 还为 Dash 的后端服务器提供动力。当开发者创建一个 Dash 应用时，会自动启动一个 Flask 服务器。然而，在本篇文章中，我们将探讨部署自定义 Flask 服务器。这种方法最大化了 Flask 的灵活性，超出了我们在应用中使用 Dash 的范围。它使整个 Web 应用能够利用除 Dash 之外的其他框架，并促进身份验证管道的构建。这些功能在没有这种定制的情况下不包括在 Dash 的开源版本中，但在企业版本中可用。
本地应用开发
本地开发必备条件
设置本地开发环境有一些先决条件。虽然并非所有这些条件都是严格必需的，但强烈建议遵循以下提供的指南。需要注意的是，本教程是在 Windows 11 机器上创建的。对于其他操作系统，可能需要进行一些修改。
-
下载 Python. 本教程使用 Python 3.10.11。强烈建议在安装期间或安装后添加 Python 到 PATH。
-
下载 Azure CLI. 这将用于通过终端在本地连接到 Azure。
-
VS Code Azure 扩展。
-
VS Code Azure 容器应用扩展。
-
VS Code Docker 扩展。
应用结构
下面是演示应用程序结构的概述，设计用于在 Web 应用程序中托管多个应用程序，所有这些应用程序都由 Flask 服务器提供支持。
AZURE_DATA_ANALYTICS_WEBAPP/
|---|main.py
|---|figures.py
|---|assets/
|---|static/
|------|css/
|------|js/
|------|img/
|---|templates/
|------|home.html
|---|requirements.txt
|---|Dockerfile
|---|.dockerignore
|---|.gitignore
|---|.env
|---|.venv
|---|README.md
Python 本地环境设置
我们将首先在 VS Code 终端中使用以下命令创建一个名为 .venv 的 Python 虚拟环境。请确保在 .gitignore 和 .dockerignore 文件中都包含 .venv，因为这些文件不应上传或部署。
python -m venv .venv
.venv/Scripts/activate
pip install --upgrade pip
pip install -r requirements.txt
图片由作者提供
项目的要求列在 requirements.txt 文件中如下：
# requirements.txt
# Web App Framework Requiremed Files:
Flask==3.0.2
plotly==5.19.0
dash==2.15.0
gunicorn==21.2.0
# Azure required files:
azure-identity==1.15.0
azure-keyvault-secrets==4.7.0
# Other Utilities:
python-dotenv==1.0.1
numpy==1.26.4
pandas==2.2.0
Flask 服务器
应用程序的主要入口点是 main.py，我们将在这里初始化并运行应用程序。在这个文件中，我们将定义 Flask 服务器，它将作为整个应用程序的后端服务器。
在这个阶段，我们没有集成任何 Dash 应用；在我们的应用程序索引页面中只定义了一个路由，用于渲染 home.html 文件。路由是一个 URL 模式，用于处理和执行与该模式匹配的 HTTP 请求。在我们的情况下，我们有一个主页路由。访问 Web 应用程序的主目录 (“/”) 时，将渲染 home.html 文件。
# main.py
from flask import Flask, render_template
# Initialize Flask server:
# Let Flask know where the templates folder is located
# via template_folder parameter
server = Flask(__name__, template_folder = "templates")
# Define Routes:
@server.route("/")
def home():
"""
Index URL to render home.html
"""
return render_template("home.html")
# Run the App:
if __name__ == "__main__":
server.run(host = "0.0.0.0", port = 5000, debug = True)
# Set debug to False during production
<!-- templates/home.html file -->
<!DOCTYPE html>
<html>
<head>
<title>Azure Data Analytics Web Application</title>
</head>
<body>
<h1>Azure Container App Data Analytics Application
with Python Flask, Plotly Dash & Docker
</h1>
</body>
</html>
注意，Flask 期望 HTML 模板存储在 templates 文件夹下。Flask 使用 Jinja 对 HTML 模板进行参数化。
我们现在可以首次在本地运行我们的应用程序。请注意，当前调试模式设置为 true，如上所示。请记住，在生产部署中将此设置为 false。要本地运行应用程序，请执行以下命令，然后在浏览器中访问 http://localhost:5000/。
python main.py
图片由作者提供
我们应该注意，当本地运行时，如上述示例所示，应用程序不使用 HTTPS。然而，Azure Container App 通过处理与 SSL/TLS 终止相关的许多繁重工作，显著简化了开发工作。
还需要提到的是，应用程序的本地执行使用默认的 Flask HTTP 服务器。然而，对于生产部署，我们在创建 Docker 镜像时将应用程序绑定到 Gunicorn 服务器。Gunicorn 是一个适用于 Unix 的 Python WSGI HTTP 服务器，更适合生产环境。Gunicorn 的安装包含在 requirements.txt 文件中。
Dash 应用
现在，我们将修改 main.py 文件以添加一个 Dash 应用实例。在这一步中，我们通过提供 Flask 服务器、指定用于路由到应用的基 URL 路径名以及指示要使用的资产文件夹来初始化 Dash 应用。资产文件夹可以存储 Dash 应用的图片和自定义样式 CSS 文件。
# main.py
from flask import Flask, render_template
from dash import Dash, html
# Initialize Flask server:
server = Flask(__name__, template_folder = "templates")
# Define Routes:
@server.route("/")
def home():
"""
Redirecting to home page.
"""
return render_template("home.html")
# Dash Apps:
app1 = Dash(__name__, server = server,
url_base_pathname = "/sampleDashApp1/",
assets_folder = "assets")
app1.layout = html.Div([
html.H1("Sample Dash App"),
html.P("This is a simple Dash app running on a Flask server.")
])
# Run the App:
if __name__ == "__main__":
server.run(host = "0.0.0.0", port = 5000, debug = True)
# Set debug to False during production
Dash 支持大多数 HTML 标签，可以直接在 Python 中指定，如上例所示。到目前为止，我们已经添加了 H1 标题和 P 段落标签。此外，Dash 还允许添加其他元素，例如 Dash Core 组件。这一功能使我们能够将小部件以及来自 Plotly 库的图表整合进来。
作者提供的图像
添加 Plotly 图表
我们将在figures.py文件中定义一些示例 Plotly 图表，并将其随后整合到 Dash 应用中。
# figures.py
import plotly.express as px
import pandas as pd
import numpy as np
def line_chart():
"""
Sample Plotly Line Chart
"""
df = pd.DataFrame({
"X": np.linspace(0, 10, 100),
"Y": np.sin(np.linspace(0, 10, 100))
})
fig = px.line(df, x = "X", y = "Y", title = "Line Chart")
return fig
def bar_chart():
"""
Sample Plotly Bar Chart
"""
df = pd.DataFrame({
"Category": ["A", "B", "C", "D", "E"],
"Values": np.random.randint(10, 100, size = 5)
})
fig = px.bar(df, x = "Category", y = "Values", title = "Bar Chart")
return fig
如果我们将main.py文件修改为从figures.py文件导入bar_chart和line_chart，然后我们可以将这些图表作为图形元素添加到我们的 Dash 应用中，如下所示。
# main.py file
# ...Rest of the code
from figures import line_chart, bar_chart
# Dash Apps:
app1 = Dash(__name__, server = server,
url_base_pathname = "/sampleDashApp1/",
assets_folder = "assets")
app1.layout = html.Div([
html.H1("Sample Dash App"),
html.P("This is a simple Dash app running on a Flask server."),
html.H2("Sample Line Chart"),
dcc.Graph(figure=line_chart()),
html.H2("Sample Bar Chart"),
dcc.Graph(figure=bar_chart())
])
# ... Rest of the code
作者提供的图像
本地构建和运行 Docker 镜像
我们现在已经为我们的应用程序建立了一个基本代码框架，并准备好构建我们的 Docker 镜像。首先，我们需要从主板的 BIOS 设置中启用虚拟化，这对于 Docker 依赖的虚拟机的创建是必要的。其次，需要安装 Docker 软件和 VS Code Docker 扩展。
完成上述步骤后，我们在主目录中创建一个Dockerfile，并输入以下内容：
# Dockerfile
# Set Python image to use:
FROM python:3.11-slim-bullseye
# Keeps Python from generating .pyc files in the container:
ENV PYTHONDONTWRITEBYTECODE=1
# Turns off buffering for easier container logging:
ENV PYTHONUNBUFFERED=1
# Install requirements:
RUN python -m pip install --upgrade pip
COPY requirements.txt .
RUN python -m pip install -r requirements.txt
# Set Working directory and copy files:
WORKDIR /app
COPY . /app
# Creates a non-root user with an explicit UID
# and adds permission to access the /app folder:
RUN adduser -u 5678 --disabled-password --gecos "" appuser && chown -R appuser /app
USER appuser
# Expose port 5000:
EXPOSE 5000
# Bind to use Gunicorn server
# and specify main entry point main.py/server object:
CMD ["gunicorn", "--bind", "0.0.0.0:5000", "main:server"]
要构建 Docker 镜像，我们在终端中执行以下命令：
docker build --no-cache -t app:version1 .
完成此步骤后，我们应该在 VS Code Docker 扩展中看到创建的 Docker 镜像。在这个例子中，我们指定了应用名称为‘app’和镜像版本为‘version1’。
作者提供的图像
现在我们准备在本地运行应用。为了创建并启动一个本地 Docker 容器，我们在终端中执行以下命令：
docker run --env-file ./.env -p 5000:5000 app:version1
这将在本地启动 Docker 容器，允许我们通过浏览器访问http://localhost:5000/中的应用。在上面的 Docker 运行命令中，我们指示 Docker 使用位于主目录中的.env文件作为环境变量文件。该文件是我们存储应用配置变量和任何机密信息的地方。需要注意的是，.env文件必须包含在.gitignore和.dockerignore文件中，因为我们不希望敏感信息被上传到 Git 或包含在 Docker 容器中。在 Azure Container Apps 上，这些参数可以作为环境变量单独提供。
对于我们的基本 Azure 部署案例，在这个阶段不需要提供任何环境变量。
作者提供的图像
下面是.dockerignore文件的内容：
**/__pycache__
**/.vscode
**/.venv
**/.env
**/.git
**/.gitignore
LICENSE
README.md
Azure 设置与部署
现在我们已经在本地有一个运行中的应用程序，并且成功创建了 Docker 镜像，我们准备设置 Azure 并部署容器应用。
要继续执行以下步骤，必须安装 Azure CLI（一个用于与 Azure 通信的终端应用程序）以及 VS Code Azure 容器应用扩展。
设置 Azure 订阅
图片由作者提供
一旦我们创建了 Azure 账户，第一步就是创建一个订阅。Azure 上的订阅包含一组与账单账户关联的 Azure 资源。对于首次使用 Azure 的用户或学生，有从 100 美元到 200 美元不等的信用额度。然而，在本教程中，我们将专注于设置付费账户。
在注册并登录 Azure 后，我们导航到“订阅”，这将与我们的账单账户相关联。在这里，我们需要为订阅提供一个名称并继续创建它。
注意：在学习期间，应特别注意监控账单。建议设置预算和警报以有效管理成本。
图片由作者提供
设置 Azure 资源组
Azure 管理着一组称为 Azure 资源组的云资源。我们需要创建这样一个组来便于创建必要的云资源。
图片由作者提供
从 Azure 的主页面，我们可以导航到“资源组”以创建一个新的资源组。
图片由作者提供
此资源组将与我们在上一步中创建的订阅相关联。我们需要为资源组提供一个名称并选择一个区域。区域的选择应基于应用程序主要使用的地理位置。
图片由作者提供
设置 Azure 容器注册表
Azure 提供一个名为 Azure 容器注册表的容器注册服务，允许我们托管我们的 Docker 容器镜像。这个容器注册表作为镜像的存储库，使得对容器镜像进行版本控制成为可能。它还促进了它们在各种云容器服务中的部署，不仅限于 Azure 容器应用。通过这项服务，可以根据需要存储和部署应用程序的不同版本。
图片由作者提供
在 Azure 门户的搜索栏中，我们输入“容器注册表”并点击创建按钮。此资源将托管在我们上一步创建的资源组下。我们应该选择之前相同的区域并选择基本计划选项以获得最低成本。
在容器注册库中，有一个重要的设置需要启用，以便我们可以在 Azure 门户内将镜像部署到 Azure 容器应用。转到容器注册库的属性，启用“管理员用户”，然后保存更改。
图片由作者提供
将 Docker 镜像部署到 Azure 容器注册库
现在，我们的本地 Docker 镜像已准备就绪，Azure 容器注册库设置已完成，我们已准备好将容器镜像上传到 Azure。
在 VS Code 终端中，我们使用 Azure CLI（必须已安装）登录到 Azure：
az login
此操作将在您的浏览器中打开一个弹出窗口，提示您登录到 Azure。完成后，我们现在已通过 Azure 进行了身份验证。
图片由作者提供
下一步是使用终端和 Azure CLI 登录到容器注册库。可以通过执行以下命令来完成：
az acr login --name <azureContainerRegistryName>
图片由作者提供
一旦我们成功登录到容器注册库，我们的下一步是首先标记镜像，然后将其推送到 Azure 容器应用。
注意，“app:version1”代表我们应用的名字和版本，这是我们之前在创建 Docker 镜像时指定的。
docker tag app:version1 <azureContainerRegistryName>.azurecr.io/app:version1
docker push <azureContainerRegistryName>.azurecr.io/app:version1
图片由作者提供
完成此步骤后，我们应该能够在容器注册库的“仓库”部分下查看图像，如上所述。
重要的是要注意，上述步骤也可以使用 VS Code Docker 扩展来完成，这是使用 Azure CLI 的替代方案。
图片由作者提供
设置 Azure 容器应用环境与容器应用
Azure 容器应用环境是一种可以管理一组容器应用的资源。虽然我们无法直接创建容器应用环境，但可以在创建初始容器应用时设置它。
要这样做，我们在 Azure 搜索栏中搜索“容器应用”，然后点击“创建”。在这里的第一步是创建容器应用环境，如以下图片中红色方框所示。
图片由作者提供
图片由作者提供
我们选择消费计划，只为使用的内容付费，并提供简化的设置流程。
创建容器应用环境后，我们返回到容器应用的设置页面，继续构建应用。在容器设置页面中，我们选择 Azure 容器注册库并定位我们之前上传的镜像。
图片由作者提供
对于 CPU 和内存，我们选择最低量，因为这个是演示应用程序。如果我们的本地环境中在.env文件中指定了任何环境变量，我们必须在此部分输入它们。或者，这些环境变量可以指向 Azure KeyVault。
对于本教程，我们可以跳过绑定部分，直接进入入口部分。在本节中，我们定义了 Azure 容器应用程序如何处理流量。我们启用入口，并将流量设置为从任何地方接受，如果应用程序要在网络上访问。对于内部应用程序，应使用公司的 VNet。
此外，我们将应用程序的端口设置为 5000，这与代码开发期间设置的 Flask 服务器端口相同。
作者图片
在配置所有这些设置后，我们就可以创建我们的应用程序了！点击“审查 + 创建”。
一旦设置完成，导航到容器应用程序页面以找到应用程序的 URL。
作者图片
作者图片
就这样！我们的应用程序现在已经在 Azure 上运行并启动了！
管理修订版本
现在我们已经部署了应用程序的第一个版本，我们将介绍如何管理修订版本。
一旦我们对代码库进行了更改并准备好修订版本，我们将像以前一样使用新的版本名称运行 Docker 部署。
docker build --no-cache -t app:version2 .
并上传到 Azure 容器注册库：
az acr login --name <azureContainerRegistryName>
docker tag app:version2 <azureContainerRegistryName>.azurecr.io/app:version2
docker push <azureContainerRegistryName>.azurecr.io/app:version2
从现在开始，我们有两种选择。要么使用终端和 Azure CLI，要么转到 Azure 容器应用程序页面并从那里管理修订版本。在这里，我们将介绍从 Azure 进行修订管理。
作者图片
点击“创建新修订版本”并为新修订版本提供后缀。这里我们将命名为“version2”。然后点击“app”复选框并选择编辑。
作者图片
在编辑容器部分，从 Azure 容器注册库中选择新版本的镜像并保存。完成后，按创建按钮，将创建新的修订版本。
作者图片
当我们回到修订版本时，我们看到新的容器修订版本正在占用 100%的流量。尽管旧版本仍然存在，并且可以通过 Azure CLI 停用。
作者图片
进一步考虑
我们已经成功使用 Python Flask & Dash 将容器应用程序部署到 Azure。然而，这个应用程序离生产发布还远。
对于内部应用，需要考虑认证过程。使用 Azure Active Directory 和 Python MSAL 库，可以在公司目录内定义用户角色和访问列表，并通过 Flask 服务器控制认证流程。Dash Enterprise 版本以更简单的方式实现此集成。然而，企业版本可能不是每个人的选择。我们必须再次提醒，在我们 Dash 应用程序中使用自定义 Flask 服务器是为了克服开源版本中认证支持的不足。在未来的文章中，将介绍如何添加 Microsoft Active Directory 认证管道。
在这个阶段，应用程序仅使用一些演示图表和合成数据。随着应用程序在 Azure 上部署，我们有多种方式将数据提供给应用程序。第一种选择是利用 Azure Data Lake Storage 作为成本效益高的基于文件的存储解决方案。虽然这个选项提供了非常低成本的存储，但它将计算负担放在了 Web 应用程序上。另一种选择是利用 Azure Databricks 及其 SQL 端点，将繁重的数据计算卸载到云集群。这些主题将在另一篇教程中再次介绍。
参考文献
码道开发者社区，聚焦华为云码道 CodeArts 代码智能体，沉淀 Agent、Skill、鸿蒙开发实战内容，供开发者查阅资料、交流技术、分享工程实践
更多推荐
3
0- 0
已为社区贡献264条内容
所有评论(0)