返回文章列表

Streamlit 佈署機器學習網頁應用

本文介紹如何使用 Streamlit 快速建構和佈署機器學習網頁應用,讓非技術使用者也能輕鬆使用。文章涵蓋了 Streamlit 的基本用法,包含建立應用程式、讀取資料、設定互動元件、執行命名實體辨識,並使用 ngrok 佈署至公開網址。同時也示範瞭如何使用 spaCy 進行命名實體辨識,以及如何客製化

網頁開發 機器學習

Streamlit 是一個 Python 函式庫,讓開發者可以輕鬆建立互動式網頁應用,特別適用於資料科學和機器學習專案。透過 Streamlit,即使不熟悉前端技術,也能快速將模型或資料分析結果轉換成網頁應用程式,方便分享和展示。文章中以命名實體辨識模型為例,逐步示範如何使用 Streamlit 建立應用程式、讀取資料、加入互動元件,以及如何使用 spaCy 進行命名實體辨識。此外,也說明瞭如何利用 ngrok 將應用程式佈署到公開網址,讓其他人可以直接透過瀏覽器存取。文章也提供程式碼範例,示範如何客製化應用程式,例如讓使用者輸入自定義文字或處理 AG News 資料集。

簡單的網頁應用佈署

在探討使用 Databricks 進行大規模模型佈署之前,讓我們先來探索如何使用 Streamlit 佈署簡單的機器學習網頁應用。網頁應用是一種讓非技術使用者能夠存取和與機器學習應用互動的便捷方式。

為什麼構建網頁應用?

大多數人並不喜歡從 GitHub 倉函式庫中搜尋程式碼,或是處理 CUDA 記憶體不足的錯誤。構建一個簡單的圖形使用者介面,讓非技術使用者能夠輕鬆與模型互動,是非常有價值的。這不僅能夠讓你更方便地分享專案,也讓使用者能夠直接點選連結檢視演示,而不必處理複雜的環境組態。

網頁應用的開發與佈署

完整的、生產就緒的網頁應用需要專門的工程資源來開發和佈署,通常會使用 JavaScript、Java、Python 等語言,以及 React、Angular 等前端框架。作為機器學習從業者,我們需要與這些工程團隊緊密合作,共同開發真正的機器學習網頁應用。

結語

本章節探討了許多機器學習領域中常見的工具,包括深度學習框架、視覺化與實驗追蹤、AutoML、機器學習基礎設施與計算、邊緣/裝置端推斷、雲端推斷與機器學習即服務,以及 CI/CD。同時,我們也提供了個人推薦,希望能夠幫助讀者做出明智的選擇。在進入下一章節之前,讓我們先來構建一個簡單的機器學習網頁應用,以進一步邁向生產化。

使用Streamlit建立簡易網頁應用程式進行資料與機器學習展示

Streamlit是一個易於使用的開源Python函式庫,能夠讓資料科學家和機器學習工程師將他們的工作成果轉化為網頁應用程式,而無需具備前端開發經驗。本章節將使用Streamlit建立一個簡單的網頁應用程式,以展示如何將spaCy命名實體辨識模型佈署為實際可用的網頁應用程式。

建立第一個Streamlit應用程式

首先,我們將使用Google Colab來建立和佈署這個應用程式。首先,連線到Google雲端硬碟,並在Applied-NLP-in-the-Enterprise目錄下建立一個名為apps的目錄,然後切換到該目錄。

# 連線到Google雲端硬碟
from google.colab import drive
drive.mount('/content/drive', force_remount=True)

# 建立並切換到Apps目錄
%mkdir '/content/drive/My Drive/Applied-NLP-in-the-Enterprise/apps'
%cd '/content/drive/My Drive/Applied-NLP-in-the-Enterprise/apps'

建立Streamlit應用程式指令碼

接下來,在apps目錄下建立一個名為ner_app_agnews.py的Python指令碼。該應用程式將讀取AG News資料集,並顯示控制元件以允許使用者探索資料。此外,應用程式還將使用基本的spaCy模型和自定義的spaCy模型進行命名實體辨識,並顯示結果。

%%writefile ner_app_agnews.py

# 載入必要的函式庫
import spacy
import streamlit as st
import spacy_streamlit
import numpy as np
import pandas as pd
import random

# 設定標題
st.title(':star: AG News資料集')

# 定義讀取資料的函式
@st.cache
def read_data(file):
    read_path = '/content/drive/My Drive/Applied-NLP-in-the-Enterprise'
    data = pd.read_csv(read_path+file)
    return data

# 讀取資料
data = read_data('/data/ag_dataset/prepared/train_prepared.csv')

設定側邊欄控制元件

接下來,定義一個函式來選擇感興趣的類別,並在側邊欄中顯示控制元件,以允許使用者選擇是否要檢視完整資料或單篇文章、要探索的類別以及要顯示的文章。

# 定義選擇類別的函式
@st.cache
def select_category(data, category_option):
    return data.loc[data.class_name==category_option]

# 設定側邊欄控制元件
st.sidebar.header("引數")
display_selections = st.sidebar.multiselect(
    "您想顯示哪些資料?",
    ["完整資料","單篇文章"], None)
category_option = st.sidebar.radio(
    '您想探索哪個類別?',
    data.class_name.unique())
article_option = st.sidebar.number_input(
    '您想探索哪篇文章?',
    data.loc[data.class_name==category_option].index.min(),
    data.loc[data.class_name==category_option].index.max(),
    data.loc[data.class_name==category_option].index.min())

根據使用者選擇設定顯示行為

根據使用者的選擇,設定資料的顯示行為。

# 設定資料的顯示行為
if "完整資料" in display_selections:
    st.header("完整資料")
    st.write(select_category(data, category_option).loc[:, ["title", "description"]])

if "單篇文章" in display_selections:
    st.header("單篇文章")
    st.subheader("標題")
    st.write(data.loc[article_option, "title"])
    st.subheader("描述")
    st.write(data.loc[article_option, "description"])

執行命名實體辨識並顯示結果

最後,使用兩個spaCy命名實體辨識模型(基本模型和自定義模型)執行命名實體辨識,並顯示結果。

# 設定文字
default_text = data.loc[article_option, "description"]

# 顯示命名實體辨識結果
st.header("命名實體辨識結果")
base, custom = st.beta_columns(2)

# 基本spaCy模型
with base:
    base_model = spacy_streamlit.load_model("en_core_web_lg")
    doc_base = base_model(default_text)
    ner_labels = ["ORG", "PERSON", "GPE"]
    show_table = True
    title = "基本SpaCy模型"
    sidebar_title = "基本SpaCy模型"
    spacy_streamlit.visualize_ner(doc_base, labels=ner_labels, show_table=show_table, title=title, sidebar_title=sidebar_title)

# 自定義spaCy模型
with custom:
    custom_ner_model = spacy_streamlit.load_model('/content/drive/My Drive/Applied-NLP-in-the-Enterprise/models/ag_dataset/ner-base-V3/model-best')
    doc_custom = custom_ner_model(default_text)
    ner_labels = ["ORG", "PERSON", "GPE", "TICKER"]
    show_table = True
    title = "自定義SpaCy模型"
    sidebar_title = "自定義SpaCy模型"
    spacy_streamlit.visualize_ner(doc_custom, labels=ner_labels, show_table=show_table, title=title, sidebar_title=sidebar_title)

佈署Streamlit應用程式

現在已經建立了Streamlit應用程式,接下來需要佈署它。首先,需要安裝必要的函式庫,包括spacy和spacy-streamlit。

# 安裝必要的函式庫
!pip install -U spacy[cuda100]
!pip install -U spacy-lookups-data
!pip install cupy-cuda100==7.3.0

# 下載預訓練語言模型(核心模型)
!python -m spacy download en_core_web_lg

# 安裝spacy-streamlit
!pip install spacy-streamlit
內容解密:
  1. Streamlit 簡介:Streamlit 是一個開源的 Python 函式庫,用於建立網頁應用程式。它使資料科學家和機器學習工程師能夠輕鬆地將他們的工作成果轉化為網頁應用程式。
  2. 建立 Streamlit 應用程式:本章節使用 Google Colab 建立和佈署 Streamlit 應用程式。首先,連線到 Google 雲端硬碟並建立一個名為 apps 的目錄。
  3. 讀取資料:使用 read_data 函式讀取 AG News 資料集,並使用 @st.cache 裝飾器快取資料。
  4. 設定側邊欄控制元件:使用 Streamlit 的控制元件(如 multiselectradionumber_input)設定側邊欄,以允許使用者選擇要檢視的資料。
  5. 執行命名實體辨識:使用兩個 spaCy 命名實體辨識模型(基本模型和自定義模型)執行命名實體辨識,並使用 Streamlit 的 visualize_ner 函式顯示結果。
  6. 佈署 Streamlit 應用程式:安裝必要的函式庫,包括 spacy 和 spacy-streamlit,然後佈署 Streamlit 應用程式。
  7. 結論:本章節展示瞭如何使用 Streamlit 建立一個簡單的網頁應用程式,以展示如何將 spaCy 命名實體辨識模型佈署為實際可用的網頁應用程式。

建置與佈署 Streamlit 網頁應用程式於 Google Colab

為了在 Google Colab 中建立與佈署 Streamlit 網頁應用程式,我們需要先安裝必要的套件,包括 Streamlit 與 ngrok。ngrok 將幫助我們在 Google Colab 中建立一個隧道(tunnel),使我們的網頁應用程式可以被外部存取。

安裝必要的套件

首先,我們需要安裝 Streamlit 與 ngrok:

# 安裝 Streamlit
!pip install streamlit
# 安裝 ngrok
!pip install pyngrok

接著,將 Google Drive 掛載到 Google Colab:

# 連線到 Google Drive
from google.colab import drive
drive.mount('/content/drive', force_remount=True)

修改 Streamlit 設定

為了控制網頁應用程式的顯示內容,我們需要修改 Streamlit 的設定檔,禁止自動顯示資料。

定義佈署函式

定義一個函式 deploy,用於佈署 Streamlit 網頁應用程式。這個函式會先終止任何已存在的 ngrok 隧道,然後建立一個新的隧道,並執行 Streamlit 應用程式。

# 定義佈署函式
def deploy(path):
    # 終止已存在的 ngrok 隧道
    try:
        ngrok.kill()
        print("所有 ngrok 工作已終止。")
    except:
        print("沒有 ngrok 工作需要終止。")
    
    # 設定應用程式位置
    app_location = path
    
    # 匯入 ngrok
    from pyngrok import ngrok
    
    # 建立一個隧道到 Streamlit 的 80 連線埠
    public_url = ngrok.connect(port='80')
    print(public_url)
    
    # 執行 Streamlit 應用程式
    !streamlit run $app_location --server.port 80 >/dev/null

# 佈署應用程式
deploy('/content/drive/"My Drive"/Applied-NLP-in-the-Enterprise/apps/ner_app_agnews.py')

內容解密:

  1. deploy 函式的作用:該函式負責佈署 Streamlit 網頁應用程式,包含終止現有 ngrok 隧道、建立新的隧道及執行 Streamlit 應用程式。
  2. ngrok.kill() 的使用:用於終止已存在的 ngrok 隧道,以避免連線埠衝突。
  3. ngrok.connect(port='80'):建立一個到 Streamlit 應用程式的隧道,將外部請求轉發到本地的 80 連線埠。
  4. !streamlit run $app_location --server.port 80 >/dev/null:執行 Streamlit 應用程式,並指定其執行在 80 連線埠。

佈署完成後,您將看到類別似以下的輸出:

No ngrok jobs to kill.
NgrokTunnel: "http://b45166a8492f.ngrok.io" -> "http://localhost:80"

點選第一個 URL,即可在新的瀏覽器分頁中看到 Streamlit 網頁應用程式。

探索 Streamlit 網頁應用程式

網頁應用程式的右側面板顯示了 NER 結果,而左側的側邊欄則包含各種控制元件,用於選擇要檢視的資料、類別及文章編號。

為自定義 NER 建置與佈署 Streamlit 應用程式

現在,我們將為自定義 NER 建置一個新的 Streamlit 網頁應用程式,讓使用者可以輸入自定義的文字進行 NER 分析。

程式碼範例:

%%writefile ner_app_custom.py
# 載入函式庫
import spacy
import streamlit as st
import spacy_streamlit
import numpy as np
import pandas as pd
import random

# 設定標題
st.title(':star: Custom NER')
st.header("Custom Text")
default_text = st.text_area("輸入要分析的文字。", height=250)

# 顯示 NER 結果
st.header("NER Results")
base, custom = st.beta_columns(2)

# 基本 spaCy 模型
with base:
    base_model = spacy_streamlit.load_model("en_core_web_lg")
    doc_base = base_model(default_text)
    ner_labels = ["ORG","PERSON","GPE"]
    show_table = True
    title = "Base SpaCy Model"
    sidebar_title = "Base SpaCy Model"
    spacy_streamlit.visualize_ner(doc_base, labels=ner_labels, show_table=show_table, title=title, sidebar_title=sidebar_title)

# 自定義 spaCy 模型
with custom:
    custom_ner_model = spacy_streamlit.load_model('/content/drive/My Drive/Applied-NLP-in-the-Enterprise/models/ag_dataset/ner-base-V3/model-best')
    doc_custom = custom_ner_model(default_text)
    ner_labels = ["ORG","PERSON","GPE","TICKER"]
    show_table = True
    title = "Custom SpaCy Model"
    sidebar_title = "Custom SpaCy Model"
    spacy_streamlit.visualize_ner(doc_custom, labels=ner_labels, show_table=show_table, title=title, sidebar_title=sidebar_title)

內容解密:

  1. st.text_area 的使用:提供一個文字輸入區域,讓使用者可以輸入自定義的文字。
  2. spacy_streamlit.visualize_ner 的使用:用於視覺化 NER 結果,支援基本與自定義 spaCy 模型。
  3. ner_labels 的設定:定義要顯示的實體標籤型別,例如組織、人物、地點等。

佈署此應用程式後,您將看到一個空白的文字輸入框,可以輸入自定義的文字進行 NER 分析。

為 AG News 資料集的文字分類別建置與佈署 Streamlit 應用程式

最後,我們將為 AG News 資料集的文字分類別建置一個新的 Streamlit 網頁應用程式。

相關程式碼可參考 ch10_build_streamlit_app.ipynb

未來的開發方向可以進一步擴充套件 Streamlit 的功能,例如加入更多互動元件、支援更多 NLP 任務等。