jjzjj

轻松部署算法到网页端应用：Gradio+HuggingFace

snooby101 2024-01-27 原文

计算机视觉和图像处理的算法具有直观的实用性。作为算法研发人员，将自己的算法部署到网页端的UI接口供大家使用是一件很妙的事。但这个简单的愿望涉及到前后端知识而且需要购买域名，技术复杂且不免费。这里我将介绍一种简单且免费的方案供大家参考。
👉样例项目：可交互的上色Demo

Part 1: 界面设计库Gradio

Gradio是MIT的开源项目，使用时可理解为一个Python包，它的安装命令：pip install gradio。使用Gradio，通过少量的几行Python代码就能自动化生成交互式web页面，并支持多种输入输出格式，图像加载/显示框、文本框、各类按钮等常见控件。同时，还支持生成能外部网络访问的链接，能够迅速让非技术人员体验你的算法。

1. 小试牛刀: 彩图灰度化算法
import gradio as gr
import cv2

def to_black(image):
    output = cv2.cvtColor(image, cv2.COLOR_BGR2GRAY)
    return output

interface = gr.Interface(fn=to_black, inputs="image", outputs="image")
interface.launch(server_name='127.0.0.1',server_port=7788)

运行这个简单的代码文件，就能实现一个本地静态交互页面。在浏览器输入http://127.0.0.1:7788/就能看到如下的页面：

2. 高阶用法

设计符合自己要求的界面需要了解各种控件的用法，建议参考Gradio官方文档。相比高度封装的Interface类，Blocks类更基础一些，提供了更大的设计灵活性。Blocks类具有多个数据流和样式，可以控制组件在页面上出现的位置，处理复杂的数据流，以及根据用户交互更新组件的属性或者组件可见性。

这里提供一个已成功部署的样例项目：可交互的上色Demo，请参考其UI构建文件app.py。


Part 2：在线托管平台HuggingFace

在本地测试完成后，接下来就是考虑如何将程序发布到在线平台的问题了。HuggingFace提供了一个项目托管平台，而且能免费提供如Google Colab的在线计算资源。在使用以下服务前，请先注册账号（官网界面右上角"Sign Up"）。

1. 在线计算空间:Space

在HuggingFace官网登录账号后，切换到Spaces创建一个新的空间。记得选中"Gradio"和"Public"，以生成一个可公开使用的Gradio在线应用。每个项目空间免费配备8个CPU核和16GB 运行内存，而GPU资源需要单独付费。更多关于Spaces的介绍请参考官方文档。
创建完Space之后，我们需要把本地项目文件（UI构建文件必须得命名成app.py且位于根目录）上传到该空间。具体方法与Github项目的上传和版本维护方式完全一样。

  • 克隆space项目到本地：git clone https://huggingface.co/spaces/your_account/proj_name/tree/main
  • 将本地已跑通的项目文件复制到刚才克隆的space项目文件夹。
  • 新建描述运行环境依赖的文件：requirements.txt指定Python依赖的包；packages.txt指定特殊的系统依赖配置。详情参考。
  • 将此更新同步到远程仓库：
    git add -A .
git commit -m "add project files"
git push

完成以上步骤后（等待1~2分钟系统刷新），进入Space项目的App选项卡即可查看部署到web端的应用。


2. 模型托管仓库:Models

如果我们运行的程序是AI模型，那么一般需要提供一个训练好的checkpoint（一般上百兆）供在线加载。这时，我们可以在HuggingFace的Models页面创建一个与Space项目同名的模型仓库，用于存储需要的checkpoint等文件。

  • 上传文件：通过上文提到的git方式，或者直接点击已创建的模型页面的Add file。
  • 获取文件路径：例如上传到模型仓库的文件路径是：https://huggingface.co/menghanxia/disco/tree/main/model.pth.tar，其对应的下载路径则需要将tree修改为resolve，即https://huggingface.co/menghanxia/disco/resolve/main/disco-beta.pth.tar
  • 在Space项目的app.py文件中调用文件下载命令：
    os.system("wget https://huggingface.co/menghanxia/disco/resolve/main/disco-beta.pth.rar")
⭐参考资料
  1. Gradio文档：https://www.gradio.app/docs/
  2. Spaces文档：https://huggingface.co/docs/hub/spaces、
  3. CSDN博文：https://blog.csdn.net/SoulmateY/article/details/117327898
HuggingFaceGradiospanclasstokenpython开发语言

有关轻松部署算法到网页端应用：Gradio+HuggingFace的更多相关文章

  1. ruby - 将差异补丁应用于字符串/文件 - 2

    对于具有离线功能的智能手机应用程序，我正在为Xml文件创建单向文本同步。我希望我的服务器将增量/差异(例如GNU差异补丁)发送到目标设备。这是计划:Time=0Server:hasversion_1ofXmlfile(~800kiB)Client:hasversion_1ofXmlfile(~800kiB)Time=1Server:hasversion_1andversion_2ofXmlfile(each~800kiB)computesdeltaoftheseversions(=patch)(~10kiB)sendspatchtoClient(~10kiBtransferred)Cl

  2. ruby-on-rails - Rails 应用程序之间的通信 - 2

    我构建了两个需要相互通信和发送文件的Rails应用程序。例如，一个Rails应用程序会发送请求以查看其他应用程序数据库中的表。然后另一个应用程序将呈现该表的json并将其发回。我还希望一个应用程序将存储在其公共(public)目录中的文本文件发送到另一个应用程序的公共(public)目录。我从来没有做过这样的事情，所以我什至不知道从哪里开始。任何帮助，将不胜感激。谢谢! 最佳答案 无论Rails是什么，几乎所有Web应用程序都有您的要求，大多数现代Web应用程序都需要相互通信。但是有一个小小的理解需要你坚持下去，网站不应直接访问彼此

  3. ruby - 无法运行 Rails 2.x 应用程序 - 2

    我尝试运行2.x应用程序。我使用rvm并为此应用程序设置其他版本的ruby​​:$rvmuseree-1.8.7-head我尝试运行服务器，然后出现很多错误:$script/serverNOTE:Gem.source_indexisdeprecated,useSpecification.Itwillberemovedonorafter2011-11-01.Gem.source_indexcalledfrom/Users/serg/rails_projects_terminal/work_proj/spohelp/config/../vendor/rails/railties/lib/r

  4. ruby-on-rails - Rails 应用程序中的 Rails : How are you using application_controller. rb 是新手吗？ - 2

    刚入门rails，开始慢慢理解。有人可以解释或给我一些关于在application_controller中编码的好处或时间和原因的想法吗？有哪些用例。您如何为Rails应用程序使用应用程序Controller？我不想在那里放太多代码，因为据我了解，每个请求都会调用此Controller。这是真的？ 最佳答案 ApplicationController实际上是您应用程序中的每个其他Controller都将从中继承的类(尽管这不是强制性的)。我同意不要用太多代码弄乱它并保持干净整洁的态度，尽管在某些情况下ApplicationContr

  5. ruby-on-rails - 如何在我的 Rails 应用程序 View 中打印 ruby​​ 变量的内容？ - 2

    我是一个Rails初学者，但我想从我的RailsView(html.haml文件)中查看Ruby变量的内容。我试图在ruby​​中打印出变量(认为它会在终端中出现)，但没有得到任何结果。有什么建议吗？我知道Rails调试器，但更喜欢使用inspect来打印我的变量。 最佳答案 您可以在View中使用puts方法将信息输出到服务器控制台。您应该能够在View中的任何位置使用Haml执行以下操作:-puts@my_variable.inspect 关于ruby-on-rails-如何在我的R

  6. ruby-on-rails - 每次我尝试部署时，我都会得到 - (gcloud.preview.app.deploy) 错误响应 : [4] DEADLINE_EXCEEDED - 2

    我是Google云的新手，我正在尝试对其进行首次部署。我的第一个部署是RubyonRails项目。我基本上是在关注thisguideinthegoogleclouddocumentation.唯一的区别是我使用的是我自己的项目，而不是他们提供的“helloworld”项目。这是我的app.yaml文件runtime:customvm:trueentrypoint:bundleexecrackup-p8080-Eproductionconfig.ruresources:cpu:0.5memory_gb:1.3disk_size_gb:10当我转到我的项目目录并运行gcloudprevie

  7. ruby-on-rails - 如何在 Gem 中获取 Rails 应用程序的根目录 - 2

    是否可以在应用程序中包含的gem代码中知道应用程序的Rails文件系统根目录？这是gem来源的示例:moduleMyGemdefself.included(base)putsRails.root#returnnilendendActionController::Base.send:include,MyGem谢谢，抱歉我的英语不好 最佳答案 我发现解决类似问题的解决方案是使用railtie初始化程序包含我的模块。所以，在你的/lib/mygem/railtie.rbmoduleMyGemclassRailtie使用此代码，您的模块将在

  8. 世界前沿3D开发引擎HOOPS全面讲解——集3D数据读取、3D图形渲染、3D数据发布于一体的全新3D应用开发工具 - 2

    无论您是想搭建桌面端、WEB端或者移动端APP应用，HOOPSPlatform组件都可以为您提供弹性的3D集成架构，同时，由工业领域3D技术专家组成的HOOPS技术团队也能为您提供技术支持服务。如果您的客户期望有一种在多个平台（桌面/WEB/APP，而且某些客户端是“瘦”客户端）快速、方便地将数据接入到3D应用系统的解决方案，并且当访问数据时，在各个平台上的性能和用户体验保持一致，HOOPSPlatform将帮助您完成。利用HOOPSPlatform，您可以开发在任何环境下的3D基础应用架构。HOOPSPlatform可以帮您打造3D创新型产品，HOOPSSDK包含的技术有：快速且准确的CAD

  9. ruby-on-rails - Ruby on Rails 可以部署在 Azure 网站上吗？ - 2

    我可以在Azure网站上部署RubyonRails吗？ 最佳答案 还没有。目前仅支持.NET和PHP。 关于ruby-on-rails-RubyonRails可以部署在Azure网站上吗？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/12964010/

  10. 叮咚买菜基于 Apache Doris 统一 OLAP 引擎的应用实践 - 2

    导读：随着叮咚买菜业务的发展，不同的业务场景对数据分析提出了不同的需求，他们希望引入一款实时OLAP数据库，构建一个灵活的多维实时查询和分析的平台，统一数据的接入和查询方案，解决各业务线对数据高效实时查询和精细化运营的需求。经过调研选型，最终引入ApacheDoris作为最终的OLAP分析引擎，Doris作为核心的OLAP引擎支持复杂地分析操作、提供多维的数据视图，在叮咚买菜数十个业务场景中广泛应用。作者｜叮咚买菜资深数据工程师韩青叮咚买菜创立于2017年5月，是一家专注美好食物的创业公司。叮咚买菜专注吃的事业，为满足更多人“想吃什么”而努力，通过美好食材的供应、美好滋味的开发以及美食品牌的孵

随机推荐