背景
作為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