PyWebIO：像编写终端脚本一样来编写Web应用

导言

1. Web应用需要编写额外的前端代码来实现界面。
2. 由于Http协议的无状态性，Web应用需要在各个后端接口之间转递状态(比如通过session机制或前端的机制)。
3. Web应用在单次HTTP请求中，无法实现实时输出，所以一些耗时操作通常需要离线完成，而前端需要定时轮询来实现“伪实时”。

PyWebIO的使用

安装

pip3 install -U pywebio

Hello, world

from pywebio.input import input, FLOAT
from pywebio.output import put_text

def bmi(height, weight):  # 计算BMI
    bmi_value = weight / (height / 100) ** 2

    top_status = [(14.9, '极瘦'), (18.4, '偏瘦'),
                  (22.9, '正常'), (27.5, '过重'),
                  (40.0, '肥胖'), (float('inf'), '非常肥胖')]

    for top, status in top_status:
        if bmi_value <= top:
            return bmi_value, status

def main():
    height = input("请输入你的身高(cm)：", type=FLOAT)
    weight = input("请输入你的体重(kg)：", type=FLOAT)

    bmi_value, status = bmi(height, weight)

    put_text('你的 BMI 值: %.1f，身体状态：%s' % (bmi_value, status))

if __name__ == '__main__':
    main()

基本使用

from pywebio.input import *

# 文本输入
input("What's your name?")

# 下拉选择
select('Select', ['A', 'B'])

# 多选
checkbox("Checkbox", options=['Check me'])

# 单选
radio("Radio", options=['A', 'B', 'C'])

# 多行文本输入
textarea('Text', placeholder='Some text')

# 文件上传
file_upload("Select a file:")

# 代码编辑
textarea('Code Edit', code={
    'mode': "python",
    'theme': 'darcula',
}, value='import ...')

# 输入组
input_group("Basic info", [
    input('Name', name='name'),
    input('Age', name='age'),
])

# 输入校验
def check(p):
    if p != 2:
        return 'Wrong!'
input("1+1=?", type=NUMBER, validate=check)

from pywebio.output import *

# 输出文本
put_text("Hello world!");

# 输出表格
put_table([
    ['Product', 'Price'],
    ['Apple', '$5.5'],
    ['Banner', '$7'],
]);

# 输出图像
put_image(open('python-logo.png', 'rb').read());

# 输出MarkDown
put_markdown('**Bold text**');

# 输出通知消息
toast('Awesome PyWebIO!!');

# 输出文件
put_file('hello_word.txt', b'hello word!');

# 输出Html
put_html('E = mc2');

# 显示弹窗
with popup('Popup title'):
    put_text("Hello world!")
    put_table([
        ['Product', 'Price'],
        ['Apple', '$5.5'],
        ['Banner', '$7'],
    ])


# 输出可以点击的按钮
def on_click(btn):
    put_markdown("You click `%s` button" % btn)

put_buttons(['A', 'B', 'C'], onclick=on_click);


# 使用行布局
put_row([put_code('A'), None, put_code('B')]);

# 输出进度条
import time
put_processbar('bar1');
for i in range(1, 11):
    set_processbar('bar1', i / 10)  # 更新进度条
    time.sleep(0.1)

GitHub与文档

在线Demo

• 输入演示：演示PyWebIO输入模块的用法
• http://pywebio-demos.wangweimin.site/?pywebio_api=input_usage

• 输出演示：演示PyWebIO输出模块的用法
• http://pywebio-demos.wangweimin.site/?pywebio_api=output_usage

• 数据可视化：在PyWebIO中使用bokeh、plotly、pyecharts等库进行数据可视化
• http://pywebio-charts.demo.wangweimin.site/

• 聊天室：不到80行代码实现的在线聊天室
• http://pywebio-demos.demo.wangweimin.site/?pywebio_api=chat_room