用 PyWebIO 在 Python 中创建交互式 Web 应用程序

简介: 用 PyWebIO 在 Python 中创建交互式 Web 应用程序

引言


用Python创建Web应用程序比几年前要容易得多。例如Streamlit,它彻底改变了我们在Python中创建和部署应用程序的方式。但是在本文中,我们将来介绍一下PyWebIO。


使用 PywebIO 构建简单的 web 应用程序很容易,不需要使用 HTML 和 Python 中的 Javascript。这个包的概念很简单: 您可以获得输入和输出函数,从而可以创建简单的 GUI 或 web 应用程序。


然后你可以从终端,交互式执行环境(如Python Shell,IPython或Jupyter Notebook)在本地或云中的浏览器中为Web应用程序提供服务。


要安装 PyWebIO,请运行以下命令。


pip install -U pywebio


输入与输出


PyWebIO是直观而直接的,你可以认为它是脚本、终端或交互式环境的扩展,使你能够轻松的创建web应用程序。


让我展示一个在 python 环境中运行的简单示例。在这里,我们创建不同类型的输入,包括文本输入、单选按钮和复选框。

    # Text Input 
    name = input('What is your Name?', type=TEXT) 
    # Number Input 
    name = input('How old are you?', type=TEXT) 
    # Single choice 
    answer = radio("Which Continent?", options=['Africa', 'Asia', 'Australia', 'Europe', 'North America', 'South America']) 
    # Checkbox 
    agree = checkbox("User Term", options=['I agree to terms and conditions'])

    下面的 GIF 显示了如何在运行 python 代码时立即获得代码的浏览器 GUI。

    是不是很酷啊!


    在 Pywebio 有多种输入功能,你可以在这里(https://pywebio.readthedocs.io

    /en/latest/input.html#functions-list)找到输入功能列表。

    在前面的示例中,你已经看到了这些输入函数的几个示例。然而,我们往往倾向于将不同的输入分组,这就是 input_group 的作用。


    让我们回顾一下第一个例子,使用 input _ group 函数将不同的输入打包在一起。注意,我们在所有输入中都有一个 name 参数。稍后我们将为每个输入使用 name 参数。

      from pywebio.input import *
      from pywebio.output import *
      data = input_group(
          "User data",
          [
              input("What is your Name?", name="name", type=TEXT),
              input("Input your age", name="age", type=NUMBER),
              radio(
                  "Which Continent?",
                  name="continent",
                  options=[
                      "Africa",
                      "Asia",
                      "Australia",
                      "Europe",
                      "North America",
                      "South America",
                  ],
              ),
              checkbox(
                  "User Term", name="agreement", options=["I agree to terms and conditions"]
              ),
          ],
      )

      你可能已经意识到,我们没有从前面的示例中得到任何输出,因为我们还没有创建任何输出函数。PyWebIO 有一个丰富的输出函数列表(https://pywebio.readthedocs.io/en/latest/output.html#functions-list),你可以参考它。


      在这个例子中,我们只使用两个输出函数: put _ text_table 和 put _ table。注意,我们使用带有每个输入名称的输入组将它们放入表中。

        put_text("The output in a table:")
        put_table(
            [
                ["Name", data["name"]],
                ["Age", data["age"]],
                ["Continent", data["continent"]],
                ["Agreement", data["agreement"]],
            ]
        )

        下面是显示前面示例的分组输入和输出的 GIF。

        这里最后一个例子向您展示了可以轻松地将 python 代码扩展到 Pywebio 应用程序中,而不需要做太多的更改。这个例子展示了一个简单的函数,它将对坐标进行格式化。


        from pywebio.input import input, FLOAT, input_group
        from pywebio.output import put_text
        from pywebio import start_server
        def print_coords(lat, long):
            lat, long = coordinates["lat"], coordinates["long"]
            ns = "NS"[lat < 0]  # True (1) defaults to "N" and False(0) defaults to "S"
            we = "EW"[long < 0]  # True (1) defaults to "E" and False(0) defaults to "W
            return f"{abs(lat):.2f}°{ns}, {abs(long):.2f}°{we}"
        coordinates = input_group(
            "coordinates in decimal degrees",
            [
                input("Input Latitude:", name="lat", type=FLOAT),
                input("Input Longitude:", name="long", type=FLOAT),
            ],
        )
        put_text(print_coords(coordinates["lat"], coordinates["long"]))

        下面是一个 GIF,显示了使用 PyWebIO 的简单坐标格式化应用程序。


        数据可视化


        PyWebIO把包括Plotly在内的多个数据可视化库集成在一起。以下示例创建一个Plotly映射,并将其与PyWebIO一起使用。

          from pywebio.output import put_html
          import plotly.express as px
          df = px.data.gapminder().query("year==2007")
          fig = px.scatter_geo(df, locations="iso_alpha", color="continent",
                               hover_name="country", size="pop",
                               projection="natural earth")
          html = fig.to_html(include_plotlyjs="require", full_html=False)
          put_html(html).send()

          我们将 Plotly Figure 转换为 HTML,然后将其传递给 PyWebIO 中的 put_html 函数。


          总结


          我喜欢PyWebIO功能和概念的简单性。您可以获得输入和输出功能,这些功能使您可以将python代码转换为浏览器上的简单Web应用程序。此程序包中还有很多值得探索的地方,尤其是它允许您对应用程序进行样式设置和提供服务。一起来探索吧~


          相关文章
          |
          13天前
          |
          设计模式 前端开发 数据库
          Python Web开发:Django框架下的全栈开发实战
          【10月更文挑战第27天】本文介绍了Django框架在Python Web开发中的应用,涵盖了Django与Flask等框架的比较、项目结构、模型、视图、模板和URL配置等内容,并展示了实际代码示例,帮助读者快速掌握Django全栈开发的核心技术。
          96 44
          |
          1天前
          |
          关系型数据库 数据库 数据安全/隐私保护
          Python Web开发
          Python Web开发
          14 6
          |
          6天前
          |
          开发框架 前端开发 JavaScript
          利用Python和Flask构建轻量级Web应用的实战指南
          利用Python和Flask构建轻量级Web应用的实战指南
          19 2
          |
          11天前
          |
          数据可视化 JavaScript 前端开发
          Python中交互式Matplotlib图表
          【10月更文挑战第20天】Matplotlib 是 Python 中最常用的绘图库之一,但默认生成的图表是静态的。通过结合 mpld3 库,可以轻松创建交互式图表,提升数据可视化效果。本文介绍了如何使用 mpld3 在 Python 中创建交互式散点图、折线图和直方图,并提供了详细的代码示例和安装方法。通过添加插件,可以实现缩放、平移和鼠标悬停显示数据标签等交互功能。希望本文能帮助读者掌握这一强大工具。
          36 5
          |
          9天前
          |
          前端开发 API 开发者
          Python Web开发者必看!AJAX、Fetch API实战技巧,让前后端交互如丝般顺滑!
          在Web开发中,前后端的高效交互是提升用户体验的关键。本文通过一个基于Flask框架的博客系统实战案例,详细介绍了如何使用AJAX和Fetch API实现不刷新页面查看评论的功能。从后端路由设置到前端请求处理,全面展示了这两种技术的应用技巧,帮助Python Web开发者提升项目质量和开发效率。
          22 1
          |
          14天前
          |
          安全 数据库 开发者
          Python Web开发:Django框架下的全栈开发实战
          【10月更文挑战第26天】本文详细介绍了如何在Django框架下进行全栈开发,包括环境安装与配置、创建项目和应用、定义模型类、运行数据库迁移、创建视图和URL映射、编写模板以及启动开发服务器等步骤,并通过示例代码展示了具体实现过程。
          28 2
          |
          16天前
          |
          JSON API 数据格式
          如何使用Python和Flask构建一个简单的RESTful API。Flask是一个轻量级的Web框架
          本文介绍了如何使用Python和Flask构建一个简单的RESTful API。Flask是一个轻量级的Web框架,适合小型项目和微服务。文章从环境准备、创建基本Flask应用、定义资源和路由、请求和响应处理、错误处理等方面进行了详细说明,并提供了示例代码。通过这些步骤,读者可以快速上手构建自己的RESTful API。
          24 2
          |
          9天前
          |
          Web App开发 测试技术 数据安全/隐私保护
          自动化测试的魔法:使用Python进行Web应用测试
          【10月更文挑战第32天】本文将带你走进自动化测试的世界,通过Python和Selenium库的力量,展示如何轻松对Web应用进行自动化测试。我们将一起探索编写简单而强大的测试脚本的秘诀,并理解如何利用这些脚本来确保我们的软件质量。无论你是测试新手还是希望提升自动化测试技能的开发者,这篇文章都将为你打开一扇门,让你看到自动化测试不仅可行,而且充满乐趣。
          |
          2天前
          |
          存储 Python
          Python编程入门:打造你的第一个程序
          【10月更文挑战第39天】在数字时代的浪潮中,掌握编程技能如同掌握了一门新时代的语言。本文将引导你步入Python编程的奇妙世界,从零基础出发,一步步构建你的第一个程序。我们将探索编程的基本概念,通过简单示例理解变量、数据类型和控制结构,最终实现一个简单的猜数字游戏。这不仅是一段代码的旅程,更是逻辑思维和问题解决能力的锻炼之旅。准备好了吗?让我们开始吧!
          |
          2天前
          |
          机器学习/深度学习 人工智能 TensorFlow
          人工智能浪潮下的自我修养:从Python编程入门到深度学习实践
          【10月更文挑战第39天】本文旨在为初学者提供一条清晰的道路,从Python基础语法的掌握到深度学习领域的探索。我们将通过简明扼要的语言和实际代码示例,引导读者逐步构建起对人工智能技术的理解和应用能力。文章不仅涵盖Python编程的基础,还将深入探讨深度学习的核心概念、工具和实战技巧,帮助读者在AI的浪潮中找到自己的位置。