新聞中心
今天分享一個(gè)讓開發(fā)交互式 Web app 超級(jí)簡單的工具。不會(huì) HTML,CSS,JAVASCRIPT 也沒事。

創(chuàng)新互聯(lián)專注為客戶提供全方位的互聯(lián)網(wǎng)綜合服務(wù),包含不限于網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、茂名網(wǎng)絡(luò)推廣、微信小程序開發(fā)、茂名網(wǎng)絡(luò)營銷、茂名企業(yè)策劃、茂名品牌公關(guān)、搜索引擎seo、人物專訪、企業(yè)宣傳片、企業(yè)代運(yùn)營等,從售前售中售后,我們都將竭誠為您服務(wù),您的肯定,是我們最大的嘉獎(jiǎng);創(chuàng)新互聯(lián)為所有大學(xué)生創(chuàng)業(yè)者提供茂名建站搭建服務(wù),24小時(shí)服務(wù)熱線:13518219792,官方網(wǎng)址:www.cdcxhl.com
交互式 Web app 非常實(shí)用,比如說做一個(gè)問卷調(diào)查頁面、一個(gè)投票系統(tǒng)、一個(gè)信息收集表單,上傳文件等等,因?yàn)榫W(wǎng)頁是可視化的,因此還可以作為一個(gè)沒有服務(wù)端的圖片界面應(yīng)用程序而使用。
如果你有這樣的開發(fā)需求,那用 Python 真的是太簡單了。
借助于 PyWebIO(pip install pywebio),你可以分分鐘實(shí)現(xiàn)網(wǎng)頁的信息錄入,可以看下面的動(dòng)圖:
上面的頁面,也就僅僅用了這 6 行代碼:
- from pywebio.input import *
- input("This is a simple text input")
- select("This is a drop down menu", ['Option1', 'Option2'])
- checkbox("Multiple Choices!", options=["a",'b','c','d'])
- radio("Select any one", options=['1', '2', '3'])
- textarea('Text Area', rows=3, placeholder='Multiple line text input')
要讓網(wǎng)頁輸出想要的信息也是非常簡單,代碼如下,函數(shù)功能已經(jīng)做了相關(guān)注釋,你很容易看懂:
- from pywebio.output import *
- from pywebio import session
- # 網(wǎng)頁上顯示純文本
- put_text("Hello friend!")
- # 網(wǎng)頁上顯示表格
- put_table([
- ['Object', 'Unit'],
- ['A', '55'],
- ['B', '73'],
- ])
- # 網(wǎng)頁上顯示 MarkDown
- put_markdown('~~PyWebIO~~')
- # 網(wǎng)頁上顯示下載文件的鏈接
- put_file('output_file.txt', b'You can put anything here')
- # 網(wǎng)頁上顯示圖片
- put_image(open('python_logo.png', 'rb').read())
- # 網(wǎng)頁上顯示彈窗
- popup('popup title', 'popup text content')
- # 保持回話是打開狀態(tài),否則頁面顯示完畢程序退出
- session.hold()
運(yùn)行的效果如下:
以上,幾行代碼就實(shí)現(xiàn)了一個(gè)帶有輸入輸出的 Web 應(yīng)用,是不是很神奇?
構(gòu)建基于瀏覽器的 GUI 程序
PyWebIO 提供了一系列命令式的交互函數(shù)來在瀏覽器上獲取用戶輸入和進(jìn)行輸出,將瀏覽器變成了一個(gè)“富文本終端”,可以用于構(gòu)建簡單的 Web 應(yīng)用或基于瀏覽器的 GUI 應(yīng)用。
比如計(jì)算 BMI 指數(shù)的腳本:
- from pywebio import start_server
- from pywebio.input import input, FLOAT
- from pywebio.output import put_text
- def bmi():
- height = input("請(qǐng)輸入你的身高(cm):", type=FLOAT)
- weight = input("請(qǐng)輸入你的體重(kg):", type=FLOAT)
- BMI = 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 <= top:
- put_text('你的 BMI 值: %.1f,身體狀態(tài):%s' % (BMI, status))
- break
- if __name__ == '__main__':
- start_server(bmi, port=80)
效果:
更多示例:
基本 demo
- 聊天室[1]: 和當(dāng)前所有在線的人聊天 (不到 90 行代碼實(shí)現(xiàn))
- Markdown 實(shí)時(shí)預(yù)覽[2]: 可以實(shí)時(shí)預(yù)覽的在線 Markdown 編輯器 (不到 40 行代碼實(shí)現(xiàn))
- 在線五子棋游戲[3]: 多人協(xié)作對(duì)戰(zhàn)的五子棋游戲 (不到 100 行代碼實(shí)現(xiàn))
- 輸入演示[4]: 演示 PyWebIO 輸入模塊的用法
- 輸出演示[5]: 演示 PyWebIO 輸出模塊的用法
數(shù)據(jù)可視化 demo
PyWebIO 還支持使用第三方庫進(jìn)行數(shù)據(jù)可視化
- 使用 bokeh 進(jìn)行數(shù)據(jù)可視化[6]
- 使用 plotly 進(jìn)行數(shù)據(jù)可視化[7]
- 使用 pyecharts 創(chuàng)建基于 Echarts 的圖表[8]
- 使用 pyg2plot 創(chuàng)建基于 G2Plot 的圖表[9]
- 使用 cutecharts.py 創(chuàng)建卡通風(fēng)格圖表[10]
數(shù)據(jù)可視化效果圖:
與現(xiàn)有框架集成
PyWebIO 還可以方便地整合進(jìn)現(xiàn)有的 Web 服務(wù),讓你不需要編寫 HTML 和 JS 代碼,就可以構(gòu)建出具有良好可用性的應(yīng)用。目前支持與 Flask、Django、Tornado、aiohttp、FastAPI 框架集成。
比如說與 Tornado 應(yīng)用整合:
- import tornado.ioloop
- import tornado.web
- from pywebio.platform.tornado import webio_handler
- class MainHandler(tornado.web.RequestHandler):
- def get(self):
- self.write("Hello, world")
- if __name__ == "__main__":
- application = tornado.web.Application([
- (r"/", MainHandler),
- (r"/bmi", webio_handler(bmi)), # bmi 即為上文計(jì)算BMI指數(shù)的函數(shù)
- ])
- application.listen(port=80, address='localhost')
- tornado.ioloop.IOLoop.current().start()
與 Django 整合:
- # urls.py
- from django.urls import path
- from pywebio.platform.django import webio_view
- # `task_func` is PyWebIO task function
- webio_view_func = webio_view(task_func)
- urlpatterns = [
- path(r"tool", webio_view_func),
- ]
與更多框架的整合見文檔[11]
最后
PyWebIO 使用同步而不是基于回調(diào)的方式獲取輸入,代碼編寫邏輯更自然,非聲明式布局,布局方式簡單高效,代碼侵入性小,舊腳本代碼僅需修改輸入輸出邏輯便可改造為 Web 服務(wù),還可以整合到現(xiàn)有的主流 Web 框架。同時(shí)支持基于線程的執(zhí)行模型和基于協(xié)程的執(zhí)行模型,支持結(jié)合第三方庫實(shí)現(xiàn)數(shù)據(jù)可視化,更多知識(shí)請(qǐng)閱讀官方文檔[12]
一句話,PyWebIO 讓交互式的 Web 開發(fā)變得更加簡單,特別適合開發(fā)簡單的 GUI 程序及數(shù)據(jù)可視化。
本文轉(zhuǎn)載自微信公眾號(hào)「Python七號(hào)」,可以通過以下二維碼關(guān)注。轉(zhuǎn)載本文請(qǐng)聯(lián)系Python七號(hào)公眾號(hào)。
分享名稱:開發(fā)交互式Web應(yīng)用,從未如此簡單
文章地址:http://fisionsoft.com.cn/article/djpjieo.html


咨詢
建站咨詢
