【Python】神器：Streamlit，僅使用Python開發一個運維管理後臺（不需要編寫html，js，css）

鄭立賽發表於2021-06-03
Python運維HTMLJSCSS

背景

作為SRE，我們有很多很多自動化的工具，大部分都是自動執行的，還有一部分是CLI，我們一直苦於沒有一個自己的管理後臺網站，受限於前端能力薄弱，開發出來的網頁只能說湊活能用，但是不好用。

現在我們有了Streamlit這個神奇，可以僅使用Python就開發一個簡單的後臺管理網站，同時也可以作為我們的內容輸出渠道。

簡介

官網：https://streamlit.io/

本身streamlit是給做機器學習的人開發的，作為一個實時的資料展示和輸出工具，但是自從我們發現它具有一些互動功能（Form表單，按鈕，單選框，核取方塊）等功能後，我們藉助這些特性，可以開發一個管理網站。

官方Demo

首先安裝庫：pip3 install streamlit

執行自帶的demo：命令列或者CMD輸入：streamlit hello

開啟網頁即可看到Demo

我們的Demo：一個簡易的運維管理網站後臺

先上截圖：

首頁

 

 專案管理

 

 使用者管理

 

 許可權管理

 

 這裡只是寫了幾個demo的功能，每家公司的業務需求不一樣，需要根據自己公司實際情況，修改程式碼

直接上原始碼

需要的解析都已經寫在程式碼註釋裡了，這裡就不展開說了。

import streamlit as st
import time
# 設定網頁標題，以及使用寬屏模式
st.set_page_config(
    page_title="運維管理後臺",
    layout="wide"

)
# 隱藏右邊的選單以及頁尾
hide_streamlit_style = """
<style>
#MainMenu {visibility: hidden;}
footer {visibility: hidden;}
</style>
"""
st.markdown(hide_streamlit_style, unsafe_allow_html=True)
# 左邊導航欄
sidebar = st.sidebar.radio(
    "導航欄",
    ("首頁", "專案管理", "使用者管理", "許可權管理")
)
if sidebar == "專案管理":
    st.title("專案管理")
    # 專案選擇框
    project_name = st.selectbox(
        "請選擇專案",
        ["專案A", "專案B"]
    )
    if project_name:
        # 表單
        with st.form(project_name):
            project_info_1 = st.text_input("專案資訊1", project_name)
            project_info_2 = st.text_input("專案資訊2", project_name)
            project_info_3 = st.text_input("專案資訊3", project_name)
            submitted = st.form_submit_button("提交")
            if submitted:
                # 在這裡新增真實的業務邏輯
                # 這是一個進度條
                bar = st.progress(0)
                for i in range(100):
                    time.sleep(0.01)
                    bar.progress(i)
                st.write("專案資訊1:%s, 專案資訊2:%s, 專案資訊3:%s" % (project_info_1, project_info_2, project_info_3))
                st.success("提交成功")


elif sidebar == "使用者管理":
    st.title("使用者管理")
    # 將頁面分為左半邊和右半邊
    left, right = st.beta_columns(2)
    # 左半邊頁面展示部分
    with left:
        st.header("檢視、更新使用者資訊")
        user_name = st.selectbox(
            "請選擇使用者",
            ["鄭立賽", "賈伯斯", "王大拿"]
        )
        if user_name:
            with st.form(user_name):
                phone_num = st.text_input("手機號", user_name)
                role = st.multiselect(
                    "使用者角色",
                    ["大神", "大拿"],
                    ["大神"]
                )
                user_group = st.multiselect(
                    "請選擇使用者組",
                    ["大神組", "大拿組"],
                    ["大神組"]
                )
                submitted = st.form_submit_button("提交")
                if submitted:
                    # 這裡新增真實的業務邏輯
                    st.write("使用者名稱:%s, 手機號:%s, 使用者角色:%s, 使用者組:%s" % (user_name, phone_num, role, user_group))
                    st.success("提交成功")
    # 右半邊頁面展示部分
    with right:
        st.header("新增、刪除使用者")
        user_action = st.selectbox(
            "請選擇操作",
            ["新增使用者", "刪除使用者"]
        )
        if user_action:
            with st.form(user_action):
                if user_action == "新增使用者":
                    phone_num = st.text_input("手機號", user_name)
                    role = st.multiselect(
                        "使用者角色",
                        ["大神", "大拿"]
                    )
                    user_group = st.multiselect(
                        "請選擇使用者組",
                        ["大神組", "大拿組"]
                    )
                    submitted = st.form_submit_button("提交")
                    if submitted:
                        # 請在這裡新增真實業務邏輯，或者單獨寫一個業務邏輯函式
                        st.write("user_name:%s, phone_num:%s, role:%s, user_group:%s" % (user_name, phone_num, role, user_group))
                        st.success("提交成功")
                else:
                    user_group = st.multiselect(
                        "請選擇要刪除的使用者",
                        ["鄭立賽", "賈伯斯", "王大拿"]
                    )
                    submitted = st.form_submit_button("提交")
                    if submitted:
                        # 請在這裡新增真實業務邏輯，或者單獨寫一個業務邏輯函式
                        st.write("user_name:%s, phone_num:%s, role:%s, user_group:%s" % (user_name, phone_num, role, user_group))
                        st.success("提交成功")
elif sidebar == "許可權管理":
    st.title("許可權管理")
    with st.form("auth"):
        user = st.multiselect(
            "選擇使用者",
            ["鄭立賽", "賈伯斯", "王大拿"]
        )
        role = st.multiselect(
            "選擇使用者角色",
            ["大神", "大拿"]
        )
        user_group = st.multiselect(
            "請選擇使用者組",
            ["大神組", "大拿組"]
        )
        submitted = st.form_submit_button("提交")
        if submitted:
            # 請在這裡新增真實業務邏輯，或者單獨寫一個業務邏輯函式
            st.write(
                "使用者:%s, 角色:%s, 使用者組:%s" % (user, role, user_group))
            st.success("提交成功")
else:
    st.title("運維管理後臺")
    st.write("歡迎使用運維管理後臺")

如果是windows直接在CMD輸入，假設你把上面的程式碼儲存為demo.py

streamlit run demo.py

開啟瀏覽器即可看到上面的截圖

安全性

Web型別程式一定避不開安全性的問題，Streamlit不支援安全認證

 

即不提供使用者名稱密碼等基本的認證方式，查了官方的論壇，目前沒有好的辦法，官方後續有計劃做，但是也是在For Team版本里面，開源版是不提供的。

解決辦法：在程式前面加上一個nginx，利用nginx的basic_auth做認證，然後將請求轉發給streamlit。這應該是最簡單的辦法了。

 

 

 

附錄

開發者文件

https://docs.streamlit.io/en/stable/api.html

 

相關文章