Streamlit:用Python快速构建交互式Web应用
在传统的Web开发中,开发者常常需要编写大量的前端和后端代码,才能实现一个简单的交互式Web应用。Streamlit 通过简化这一过程,使得你只需要用Python编写代码,就能快速创建具有丰富交互功能的Web应用。本文将介绍如何使用Streamlit,从基本概念到简单的代码示例,帮助你迅速上手。
什么是Streamlit?
Streamlit 是一个基于Python的开源框架,用于快速创建数据应用。它的设计目标是让数据科学家和分析师无需具备前端开发技能,也能轻松构建出交互性强、视觉化效果良好的Web应用。其主要特点包括:
- 简单直观:只需几行代码即可创建应用。
- 无需前端开发经验:通过Python代码控制前端的元素和布局。
- 实时更新:Streamlit会在每次代码变更时自动重新加载页面。
安装Streamlit
要开始使用Streamlit,首先需要安装它。你可以通过pip进行安装:
pip install streamlit
安装完成后,运行以下命令来启动你的第一个Streamlit应用:
streamlit hello
这将启动一个示例应用,并自动在浏览器中打开。通过这个例子,你可以看到Streamlit的基本功能。
创建第一个Streamlit应用
下面是一个简单的例子,展示如何使用Streamlit构建一个交互式的Web应用。我们将创建一个应用,允许用户输入文本,并根据输入的内容生成一个简单的响应。
import streamlit as st# 标题
st.title("Streamlit Demo")# 获取用户输入
user_input = st.text_input("请输入你的名字:")# 根据用户输入生成响应
if user_input:st.write(f"你好,**{user_input}**!欢迎使用Streamlit!")
在上面的代码中,我们使用 st.title() 来设置应用的标题, st.text_input() 来获取用户输入,最后通过 st.write() 来显示输出。只需几行代码,我们就构建了一个带有输入框和动态响应的Web应用。
显示数据和图表
Streamlit不仅可以处理文本,还能方便地显示数据和图表。我们来扩展一下上面的例子,展示如何在Streamlit中展示数据和绘制图表。
import streamlit as st
import pandas as pd
import numpy as np
import matplotlib.pyplot as plt# 标题
st.title("数据展示与图表")# 生成数据
data = pd.DataFrame({'列A': np.random.randn(10),'列B': np.random.randn(10)
})# 显示数据表
st.write("生成的随机数据:")
st.dataframe(data)# 绘制图表
st.write("生成的随机数据图表:")
plt.figure(figsize=(10,5))
plt.plot(data['列A'], label='列A')
plt.plot(data['列B'], label='列B')
plt.legend()
st.pyplot(plt)
在这个例子中,我们使用 st.dataframe() 来显示表格数据,使用 st.pyplot() 来嵌入matplotlib生成的图表。你可以看到,Streamlit让数据可视化变得非常简单,而且可以直接使用熟悉的Python库(如Pandas和Matplotlib)。
交互式组件
除了文本和数据展示,Streamlit还提供了各种交互式组件,如按钮、滑块、下拉菜单等。下面是一个简单的例子,展示如何使用这些组件。
import streamlit as stst.title("交互式组件演示")# 滑块
age = st.slider("选择你的年龄:", 0, 100, 25)
st.write(f"你选择的年龄是:**{age}**")# 按钮
if st.button("点击我"):st.write("按钮被点击了!")
在这个例子中,我们使用 st.slider() 来创建一个滑块, st.button() 来创建一个按钮。用户可以通过滑动或点击与应用交互,Streamlit会实时更新 页面内容。
使用Streamlit实现OpenAI Chat页面
接下来,我们通过Streamlit实现一个OpenAI Chat 页面,让用户能够输入问题并获取ChatGPT的回答。这个功能可以通过结合Streamlit和OpenAI的API轻松实现。
前提条件
- 获取 OpenAI API Key。
- 安装Streamlit和OpenAI库:
pip install streamlit openai
实现代码
下面是一个简单的例子,展示如何通过Streamlit实现聊天功能:
import streamlit as st
import openai# 设置OpenAI API密钥
openai.api_key = '你的OpenAI API Key'# 标题
st.title("OpenAI Chatbot with Streamlit")# 输入框:获取用户输入
user_input = st.text_input("请输入你的问题:")# 聊天按钮
if st.button("发送"):if user_input:# 调用OpenAI API生成回复response = openai.Completion.create(engine="text-davinci-003", # 或其他你想使用的模型prompt=user_input,max_tokens=150)# 显示回复st.write(f"ChatGPT: **{response.choices[0].text.strip()}**")else:st.write("请输入问题后再点击发送按钮。")
代码说明
- API密钥设置:使用
openai.api_key设置你的API密钥。 - 用户输入:通过
st.text_input()提供一个输入框让用户提交问题。 - 生成回复:通过OpenAI API调用
openai.Completion.create()获取ChatGPT的回复,并通过st.write()显示出来。
部署聊天应用
构建好应用后,只需在终端运行以下命令来启动应用:
streamlit run app.py
这样,你就可以在本地体验一个简单的OpenAI Chatbot,用户可以输入问题并得到即时的回复。
部署Streamlit应用
Streamlit还提供了一个专门的部署平台:Streamlit Cloud,通过它你可以轻松将应用部署到云端。
部署步骤:
- 将你的代码推送到GitHub等代码仓库。
- 访问 Streamlit Cloud,选择代码仓库并部署。
- 应用几分钟后即可上线。
总结
Streamlit 是一个非常强大且易于使用的工具,尤其适合那些希望快速构建Web应用的Python开发者。无论是数据分析、机器学习,还是构建与OpenAI结合的聊天应用,Streamlit都能让你快速实现功能,无需前端开发经验。
相关文章:
Streamlit:用Python快速构建交互式Web应用
在传统的Web开发中,开发者常常需要编写大量的前端和后端代码,才能实现一个简单的交互式Web应用。Streamlit 通过简化这一过程,使得你只需要用Python编写代码,就能快速创建具有丰富交互功能的Web应用。本文将介绍如何使用Streamlit…...
深入浅出Vue.js组件开发:从基础到高级技巧
解锁Python编程的无限可能:《奇妙的Python》带你漫游代码世界 Vue.js 是一个轻量级且功能强大的 JavaScript 框架,专注于构建用户界面。它的核心优势之一是组件系统,它允许开发者通过模块化、可复用的方式构建复杂的应用程序。在这篇文章中,我们将详细探讨如何开发 Vue.js…...
Python并发编程挑战与解决方案
Python并发编程挑战与解决方案 并发编程是现代软件开发中的一项核心能力,它允许多个任务同时运行,提高程序的性能和响应速度。Python因其易用性和灵活性而广受欢迎,但其全局解释器锁(GIL)以及其他特性给并发编程带来了…...
LeetCode从入门到超凡(五)深入浅出---位运算
引言 大家好,我是GISer Liu😁,一名热爱AI技术的GIS开发者。本系列文章是我跟随DataWhale 2024年9月学习赛的LeetCode学习总结文档;本文主要讲解 位运算算法。💕💕😊 一、 位运算简介 1.什么是位…...
一些 Go Web 开发笔记
原文:Julia Evans - 2024.09.27 在过去的几周里,我花了很多时间在用 Go 开发一个网站,虽然不知道它最终会不会发布,但在这个过程中我学到了一些东西,想记录下来。以下是我的一些收获: Go 1.22 现在有了更…...
[Go语言快速上手]初识Go语言
目录 一、什么是Go语言 二、第一段Go程序 1、Go语言结构 注意 2、Go基础语法 关键字 运算符优先级 三、Go语言数据类型 示例 小结 一、什么是Go语言 Go语言,通常被称为Golang,是一种静态类型、编译型的计算机编程语言。它由Google的Robert Gr…...
基于STM32的智能风扇控制系统设计
引言 本项目将基于STM32微控制器设计一个智能风扇控制系统,通过温度传感器实时检测环境温度,并根据预设的温度范围自动调节风扇的转速。该系统展示了STM32的PWM输出、传感器接口以及自动控制应用的实现。 环境准备 1. 硬件设备 STM32F103C8T6 开发板…...
OpenCV 形态学相关函数详解及用法示例
OpenCV形态学相关的运算包含腐蚀(MORPH_ERODE),膨胀(MORPH_DILATE),开运算(MORPH_OPEN),闭运算(MORPH_CLOSE),梯度运算(MORPH_GRADIENT),顶帽运算(MORPH_TOPHAT),黑帽运算(MORPH_BLACKHAT),击中…...
Kafka学习笔记(三)Kafka分区和副本机制、自定义分区、消费者指定分区
文章目录 前言7 分区和副本机制7.1 生产者分区写入策略7.1.1 轮询分区策略7.1.2 随机分区策略7.1.3 按key分区分配策略7.1.4 自定义分区策略7.1.4.1 实现Partitioner接口7.1.4.2 实现分区逻辑7.1.4.3 配置使用自定义分区器7.1.4.4 分区测试 7.2 消费者分区分配策略7.2.1 RangeA…...
华为 HCIP-Datacom H12-821 题库 (31)
🐣博客最下方微信公众号回复题库,领取题库和教学资源 🐤诚挚欢迎IT交流有兴趣的公众号回复交流群 🦘公众号会持续更新网络小知识😼 1. 默认情况下,IS-IS Level-1-2 路由器会将 Level-2 区域的明细路由信息发布到Lev…...
占位,凑满减
占位,凑满减...
SpringBoot校园资料平台:从零到一的构建过程
1系统概述 1.1 研究背景 如今互联网高速发展,网络遍布全球,通过互联网发布的消息能快而方便的传播到世界每个角落,并且互联网上能传播的信息也很广,比如文字、图片、声音、视频等。从而,这种种好处使得互联网成了信息传…...
czx前端
一、盒模型 标准盒模型:box-sizing: content-box。 外边距边框内边距内容区。 IE盒模型,怪异盒模型:box-sizing: border-box。 外边距内容区(边框内边距内容区)。 二、CSS特性 继承性: 父元素的字体大小…...
Perforce演讲回顾(上):从UE项目Project Titan,看Helix Core在大型游戏开发中的版本控制与集成使用策略
日前,Perforce携手合作伙伴龙智一同亮相Unreal Fest 2024上海站,分享Helix Core版本控制系统及其协作套件的强大功能与最新动态,助力游戏创意产业加速前行。 Perforce解决方案工程师Kory Luo在活动主会场,带来《Perforce Helix C…...
【含文档】基于Springboot+Andriod的成人教育APP(含源码+数据库+lw)
1.开发环境 开发系统:Windows10/11 架构模式:MVC/前后端分离 JDK版本: Java JDK1.8 开发工具:IDEA 数据库版本: mysql5.7或8.0 数据库可视化工具: navicat 服务器: SpringBoot自带 apache tomcat 主要技术: Java,Springboot,mybatis,mysql,vue 2.视频演示地址 3.功能 系统定…...
CentOS7系统配置Yum环境
新安装完系统的服务器往往缺少我们常用的依赖包,故需要设置好yum源,方便软件安装,以下是CentOS7为例,系统安装后yum默认安装。 //备份之前的配置文件 mv /etc/yum.repos.d /etc/yum.repos.d.bak mkdir -p /etc/yum.repos.d 1…...
pyqt打包成exe相关流程
1、首先是安装pyinstaller, 在cmd中输入以下安装命令: pip3 install pyinstaller -i https://mirrors.tuna.tsinghua.edu.cn/pypi/web/simple/ 2、安装完毕之后,下一步就是找到你要打包的工程,打包的logo放置如下位置: 3、将log…...
设计模式、系统设计 record part02
软件设计模式: 1.应对重复发生的问题 2.解决方案 3.可以反复使用 1.本质是面向对象 2.优点很多 1.创建型-创建和使用分离 2.结构型-组合 3.行为型-协作 571123种模式 UML-统一建模语言-Unified Modeling Language 1.可视化,图形化 2.各种图(9…...
github双重验证(2FA)启用方法
一、双重验证-2FA 在去年看到过说github启用双重验证的通知,觉得做为一个普通开发者,可能没有这么快会要求启用。结果,今天早晨一来就收到了邮件,要求说在11月底完成2FA的认证,否则权限受限。真是无了语。所谓2FA好理…...
《Linux从小白到高手》理论篇:Linux的系统服务管理
值此国庆佳节,深宅家中,闲来无事,就多写几篇博文。本篇详细深入介绍Linux的系统服务管理。 系统服务通常在系统启动时自动启动,并在后台持续运行,为系统和用户提供特定的功能。例如,网络服务、打印服务、数…...
深入浅出Asp.Net Core MVC应用开发系列-AspNetCore中的日志记录
ASP.NET Core 是一个跨平台的开源框架,用于在 Windows、macOS 或 Linux 上生成基于云的新式 Web 应用。 ASP.NET Core 中的日志记录 .NET 通过 ILogger API 支持高性能结构化日志记录,以帮助监视应用程序行为和诊断问题。 可以通过配置不同的记录提供程…...
Cesium1.95中高性能加载1500个点
一、基本方式: 图标使用.png比.svg性能要好 <template><div id"cesiumContainer"></div><div class"toolbar"><button id"resetButton">重新生成点</button><span id"countDisplay&qu…...
抖音增长新引擎:品融电商,一站式全案代运营领跑者
抖音增长新引擎:品融电商,一站式全案代运营领跑者 在抖音这个日活超7亿的流量汪洋中,品牌如何破浪前行?自建团队成本高、效果难控;碎片化运营又难成合力——这正是许多企业面临的增长困局。品融电商以「抖音全案代运营…...
【JavaSE】绘图与事件入门学习笔记
-Java绘图坐标体系 坐标体系-介绍 坐标原点位于左上角,以像素为单位。 在Java坐标系中,第一个是x坐标,表示当前位置为水平方向,距离坐标原点x个像素;第二个是y坐标,表示当前位置为垂直方向,距离坐标原点y个像素。 坐标体系-像素 …...
在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?
uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件,用于在原生应用中加载 HTML 页面: 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...
python报错No module named ‘tensorflow.keras‘
是由于不同版本的tensorflow下的keras所在的路径不同,结合所安装的tensorflow的目录结构修改from语句即可。 原语句: from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后: from tensorflow.python.keras.lay…...
Ubuntu Cursor升级成v1.0
0. 当前版本低 使用当前 Cursor v0.50时 GitHub Copilot Chat 打不开,快捷键也不好用,当看到 Cursor 升级后,还是蛮高兴的 1. 下载 Cursor 下载地址:https://www.cursor.com/cn/downloads 点击下载 Linux (x64) ,…...
【SpringBoot自动化部署】
SpringBoot自动化部署方法 使用Jenkins进行持续集成与部署 Jenkins是最常用的自动化部署工具之一,能够实现代码拉取、构建、测试和部署的全流程自动化。 配置Jenkins任务时,需要添加Git仓库地址和凭证,设置构建触发器(如GitHub…...
git: early EOF
macOS报错: Initialized empty Git repository in /usr/local/Homebrew/Library/Taps/homebrew/homebrew-core/.git/ remote: Enumerating objects: 2691797, done. remote: Counting objects: 100% (1760/1760), done. remote: Compressing objects: 100% (636/636…...
02.运算符
目录 什么是运算符 算术运算符 1.基本四则运算符 2.增量运算符 3.自增/自减运算符 关系运算符 逻辑运算符 &&:逻辑与 ||:逻辑或 !:逻辑非 短路求值 位运算符 按位与&: 按位或 | 按位取反~ …...
