基于Python构建机器学习Web应用

news2025/7/10 16:55:01

9304ee935f724ca5b215068e1c3506c1.jpeg

目录

一、内容介绍

1.Onnx模型

①skl2onnx库安装

2.Netron安装

二、模型构建

1.数据加载

2.划分可训练特征与预测标签

3.训练模型

①第三方库导入

②数据集划分

③SVC模型构建

④精度评价

二、模型转换及可视化

1.参数配置

2.Onnx模型生成

3.可视化模型

四、构建Web应用程序

1.构建HTML文件

2.构建JavaScript代码

3.测试Web程序

六、总结


本文相关数据资源免费下载

        在本文中,你将学到: 

0 如何构建模型并将其保存为Onnx模型
1 如何使用Netron可视化模型
2 如何在Web应用中使用模型进行预测

         📈 机器学习最有用的实际用途之一是构建推荐系统,今天我们可以朝着这个方向迈出第一步! 

一、内容介绍

        在系列8的文章中,我们构建了一个基于UFO目击事件的回归模型,对其使用pickle库进行封装打包,并基于Flask库构建了Web应用,虽然这个打包方法简单易用,但是对于大多数Web应用,其构建环境是基于JavaScript语言的,因此使用一个JavaScript打包并使用模型更容易拓展和广泛应用。

1.Onnx模型

        构建机器学习模型应用是AI业务系统中的重要组成部分。通过使用Onnx,我们可以在各种Web应用程序中使用模型。Python的第三方库skl2onnx可以帮我们把Scikit-learn模型转换为Onnx模型。

        ONNX(Open Neural Network Exchange),开放神经网络交换,是用于在各种深度学习训练和推理框架转换的一个中间表示格式。在实际业务中,可以使用Pytorch或者TensorFlow训练模型,导出成ONNX格式,然后在转换成目标设备上支撑的模型格式,比如TensorRT Engine、NCNN、MNN等格式。ONNX定义了一组和环境,平台均无关的标准格式,来增强各种AI模型的可交互性,开放性较强。

①skl2onnx库安装

pip install -i https://mirrors.aliyun.com/pypi/simple/ skl2onnx

        看到下图信息代表安装成功:

7ebe637284e64a1a83c9907e174461ab.png

2.Netron安装

        Netron是一个深度学习模型可视化库,其支持以下格式的模型存储文件:

ONNX (.onnx, .pb)

Keras (.h5, .keras)

CoreML (.mlmodel)

TensorFlow Lite (.tflite)

        netron并不支持pytorch通过torch.save方法导出的模型文件,因此在pytorch保存模型的时候,需要将其导出为onnx格式的模型文件,可以利用torch.onnx模块实现这一目标。

Netron安装链接

        安装好以后,双击即可运行,选中我们模型进行可视化查看。

d9fcdaaa71e849bdb7b940bc88a6637a.png

 

二、模型构建

        首先,使用我们之前已清理的亚洲美食数据集训练SVC线性分类模型。

1.数据加载

        导入第三方库并调用查看之前处理好的亚洲美食数据集。

import pandas as pd
data = pd.read_csv('cleaned_cuisines.csv')
data.head()

41434199e24d4d84bfd6d4d2f6c6d5bd.png

2.划分可训练特征与预测标签

        删去不需要的两列数据,并将剩余数据赋值给X,同理将标签另存为Y:

X = data.iloc[:,2:]#X为可训练特征
Y = data['cuisine']#Y为预测标签

3.训练模型

①第三方库导入

        从Scikit-learn库中导入需要的函数:

from sklearn.model_selection import train_test_split#用于数据集的划分
from sklearn.svm import SVC#SVC模型
from sklearn.model_selection import cross_val_score#
from sklearn.metrics import accuracy_score,precision_score,confusion_matrix,classification_report#调用精度评价函数

②数据集划分

        将数据集以7:3的比例划分为训练集与测试集:

X_train, X_test, Y_train, Y_test = train_test_split(X,Y,test_size=0.3)

③SVC模型构建

        构建一个SVC模型,核函数为“linear”。使用划分好的训练集数据进行模型训练。

model = SVC(kernel='linear', C=10, probability=True,random_state=0)
model.fit(X_train,Y_train.values.ravel())

④精度评价

        用训练好的模型预测出预测标签Y_pred,并打印出精度评价表。

Y_pred = model.predict(X_test)
print(classification_report(Y_test,Y_pred))

cbf9de8180dd47febf7c931b6552f46d.png

二、模型转换及可视化

        在前文中,我们以及训练好了SVC模型,其精度达到了79%。现在我们需要将模型转换为Onnx格式。

确保使用正确的张量数进行转换,此数据集中有380个特征,因此我们需要在FloatTensorType函数中设定好特征数量。

1.参数配置

        配置好Onnx模型参数,如数据类型为Float,数据类型为[1,380]的张量。

from skl2onnx import convert_sklearn
from skl2onnx.commmon.data_types import FloatTensorType
initial_type = [('float_input',FloatTensorType([None, 380]))]
options = {id(model):{'nocl': True, 'zipmap': False}}

2.Onnx模型生成

        基于以上参数生成Onnx模型并保存在model.onnx文件中:

onx = convert_sklearn(model, initial_types=initial_type, options=options)
with open("model.onnx", "wb") as f:
    f.write(onx.SerializeToString())

cd31abf6bf574f469e7f3951e01daf13.png

        现在,我们可以在文件夹中看到Onnx模型。

172b53997ba8440491e7cb4cde15f10e.jpeg

 

3.可视化模型

        Onnx模型结构在代码中看起来并不是很明显,我们Netron软件来可视化模型。打开Netron软件,点击Open model,加载模型,选择我们刚刚生成的model.onnx文件。

b15c2fe0d96a49a68259d0bced61f928.png

5bf91698625f4bc0bbca30618f95f491.png

        可以看到,模型的结构已被可视化,其中列出了380个特征输入与所用的分类器。我们可以点击不同的部分查看其数据类型,输出结果类型以及参数配置。

15c0c30bb9754f1b89f0e3882288ff6d.png

四、构建Web应用程序

        现在,我们已经准备在Web应用程序上使用此模型,首先,我们先构建一个Web应用程序。

1.构建HTML文件

        在文件夹下新建index.html,加入以下代码:(简单的Web代码,有点前端基础应该都能看懂)

        <div class="boxCont">
            <input type="checkbox" value="247" class="checkbox">
            <label>pear</label>
        </div>
    
        <div class="boxCont">
            <input type="checkbox" value="77" class="checkbox">
            <label>cherry</label>
        </div>

        <div class="boxCont">
            <input type="checkbox" value="126" class="checkbox">
            <label>fenugreek</label>
        </div>

        <div class="boxCont">
            <input type="checkbox" value="302" class="checkbox">
            <label>sake</label>
        </div>

        <div class="boxCont">
            <input type="checkbox" value="327" class="checkbox">
            <label>soy sauce</label>
        </div>

        <div class="boxCont">
            <input type="checkbox" value="112" class="checkbox">
            <label>cumin</label>
        </div>
    </div>
    <div style="padding-top:10px">
        <button onClick="startInference()">预测</button>
    </div> 
</body>

tip:我们可以看到每个复选框都有一个值value,这个值是食材特征在模型张量中对应的索引。 

2.构建JavaScript代码

        在标签下方继续构建JavaScript脚本。

<script src="https://cdn.jsdelivr.net/npm/onnxruntime-web@1.9.0/dist/ort.min.js"></script> 
<script>
		//创建一个380的向量,并全部赋值为0
		const ingredients = Array(380).fill(0);
		//定义全局检查变量,用于获取复选框值    
		const checks = [...document.querySelectorAll('.checkbox')];
		//foreach语句是for语句特殊情况下的增强版本,简化了编程,提高了代码的可读性和安全性。    
		checks.forEach(check => {
		    check.addEventListener('change', function() {
		            // toggle the state of the ingredient
		            // based on the checkbox's value (1 or 0)
		        ingredients[check.value] = check.checked ? 1 : 0;
		    });
		});
		//定义函数,检查check列表中是否有复选框被勾选,有则返回Ture,否则False
		function testCheckboxes() {
		        
		    return checks.some(check => check.checked);
		}
		//构建异步加载函数
		async function startInference() {
		
		    let atLeastOneChecked = testCheckboxes()
		
		    if (!atLeastOneChecked) {
		        alert('请至少勾选一个复选框.');
		        return;
		    }
		    try {
		        // 创建一个新的 sessio加载模型.    
		        const session = await ort.InferenceSession.create('model.onnx');
				alert('模型加载成功!')
				//创建一个[1,380]的张量对象
		        const input = new ort.Tensor(new Float32Array(ingredients), [1, 380]);
		        const feeds = { float_input: input };
				alert('参数输入成功!')
		       //输入模型session并开始预测,将结果赋值给results
		        const results = await session.run(feeds);
		
		            //读取results的值并以弹出框的形式展示结果
		        alert('你可以享受' + results.label.data[0] + ' 的美味!')
		
		    } catch (e) {
		        console.log(`模型加载失败!`);
		        console.error(e);
		    }
		}
		           
</script>

        代码解析:

0 我们首先创建了一个包含380个值的数组,值默认全为0,这些值需要设置好后输入到模型进行预测,我们可以通过是否勾选复选框来更改某些参数。

1 我们创建了一个复选框数组,当我们选中该复选框时,数组中对应位置的值则会发生变化,变为1。默认为0。

2 我们创建了一个函数testCheckboxes,用于检查是否选中复选框。

3 当按下按钮时,该函数被调用,如果存在被选中的复选框,则加载模型,开始预测结果。

3.测试Web程序

        在文件夹中选中双击我们建立的index.html软件,稍等片刻可以看到,界面已经加载出来。输入参数即可运行。

        部分读者可能运行后没有效果,因为引入的js代码网站有墙。禁止访问,导致引入超时。读者可自行下载相关JavaScript代码,进行本地调用。

561313629de546c4b0aa8233edfaffd8.png

        🏆🏆至此,我们的Web应用测试成功!你可以将其部署到你的服务器上或者硬件上😁。

六、总结

        在本文中,我们基于之前的亚洲美食数据集构建了SVC模型,并介绍了模型可视化工具Netron与Onnx模型格式的使用。与之前基于Python的pkl格式模型相比,Onnx格式的模型适用性更好,可以在多个平台使用。且OnnxRuntime拥有各种语言的API,💻我们可以在各个环境中部署机器学习模型应用!

 

4b3eff2300744e8e85b8eee2f0f80a13.png#pic_center



   如果觉得我的文章对您有帮助,三连+关注便是对我创作的最大鼓励!

“本站所有文章均为原创,欢迎转载,请注明文章出处:https://blog.csdn.net/qq_45590504/category_11752103.html?spm=1001.2014.3001.5482百度和各类采集站皆不可信,搜索请谨慎鉴别。技术类文章一般都有时效性,本人习惯不定期对自己的博文进行修正和更新,因此请访问出处以查看本文的最新版本。”

​系列文章

机器学习系列0 机器学习思想_GISer Liu的博客-CSDN博客

机器学习系列1 机器学习历史_GISer Liu的博客-CSDN博客

机器学习系列2 机器学习的公平性_GISer Liu的博客-CSDN博客_公平机器学习

机器学习系列3 机器学习的流程_GISer Liu的博客-CSDN博客

机器学习系列4 使用Python创建Scikit-Learn回归模型_GISer Liu的博客-CSDN博客

机器学习系列5 利用Scikit-learn构建回归模型:准备和可视化数据(保姆级教程)_GISer Liu的博客-CSDN博客
机器学习系列6 使用Scikit-learn构建回归模型:简单线性回归、多项式回归与多元线性回归_GISer Liu的博客-CSDN博客_多元多项式回归机器学习系列7 基于Python的Scikit-learn库构建逻辑回归模型_GISer Liu的博客-CSDN博客

机器学习系列8 基于Python构建Web应用以使用机器学习模型_GISer Liu的博客-CSDN博客

一文读懂机器学习分类全流程_GISer Liu的博客-CSDN博客

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/406231.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

报错ValidationError: Progress Plugin Invalid Options

背景&#xff1a;我改了文件的名字 他很多配置都没有了 我只能重新来 中途删了删掉node_modules和package-lock.json 也找了很多方法来重复配置着两个文件 最快的方法是 npm i -D vue 后面复原了之后又出现了很多问题 一直困恼我的是下面那个图片内容 背景&#xff1a;他…

Java Web入门 Web环境的搭建

文章目录 一、JDK开发工具包 a、下载JDK b、如何安装 c、配置Java环境变量。 d、测试环境变量是否安装成功 二、下载Tomcat服务器 a、Tomcat是什么&#xff1f;为啥要用它&#xff1f; b、如何下载 c、了解Tomcat的目录 d、如何知道自己Tomcat服务器有没有问题呢&#…

在 js 中,reduce() 的详解 以及使用方法

reduce&#xff08;&#xff09;&#xff1a; reduce&#xff08;&#xff09;方法为归并类方法&#xff0c;最常用的场景就是&#xff0c;计算数组中的每一项的总和。 reduce&#xff08;&#xff09; 方法会遍历数组的每一项&#xff0c;他接收两个参数&#xff1a; 第一个…

22.信息系统安全管理-策略7定.方案.安全体系架构.PKI.PMI

信息系统的安全威胁分成七类&#xff0c;从风险源的角度划分&#xff0c;可以将安全威胁划分为&#xff1a;自然事件风险、人为事件风险、软件风险、软件过程风险、项目管理风险、应用风险、用户使用风险。 信息系统安全四个层次:设备安全、数据安全、内容安全、行为安全。数据…

vite打包配置(静态资源合并打包/清除log/gzip压缩/ENV配置等)

2022/6/2更新 传了一下本项目代码,文章里写到的基本都有用到,可以clone了看一下 下载地址https://github.com/shinjie1210/vite-config.git---------------------------------------------------------------------------------------------------------------------------- …

基于vue的uni-app生态——学习笔记001

目录 vue的简介 什么是vue.js vue相比传统的js开发优势有哪些 vue的优势 与传统的开发文件相比的类型变换 与传统的开发相比开发文件内部架构的变化 uni-app生态&#xff08;编辑器的使用&#xff09; 编辑器的下载 编辑器的使用 基于vue开发的uni-app生态的文件结构…

CANoe中使用CAPL刷写流程详解(Trace图解)(CAN总线)

&#x1f345; 我是蚂蚁小兵&#xff0c;专注于车载诊断领域&#xff0c;尤其擅长于对CANoe工具的使用&#x1f345; 寻找组织 &#xff0c;答疑解惑&#xff0c;摸鱼聊天&#xff0c;博客源码&#xff0c;点击加入&#x1f449;【相亲相爱一家人】&#x1f345; 玩转CANoe&…

Vue初入,了解Vue的发展与优缺点

作者简介&#xff1a;一名计算机萌新、前来进行学习VUE,让我们一起进步吧。 座右铭&#xff1a;低头赶路&#xff0c;敬事如仪 个人主页&#xff1a;我叫于豆豆吖的主页 前言 从本章开始进行Vue前端的学习&#xff0c;了解Vue的发展&#xff0c;以及背后的故事。 一.vue介…

一、Django基础介绍

一、Django介绍 Python下有许多款不同的 Web 框架。Django是重量级选手中最有代表性的一位。许多成功的网站和APP都基于Django。Django 是一个开放源代码的 Web 应用框架&#xff0c;由 Python 写成。Django 遵守 BSD 版权&#xff0c;初次发布于 2005 年 7 月, 并于 2008 年 …

【Spring Cloud Alibaba】(二)微服务调用组件Feign原理+实战

系列目录 【Spring Cloud Alibaba】&#xff08;一&#xff09;微服务介绍 及 Nacos注册中心实战 本文目录系列目录前言什么是RPC&#xff1f;Feign和OpenFeign都是什么&#xff1f;HTTP调用 vs Feign(RPC)调用单独使用Feign实战Feign核心源码解读Feign整体设计架构Spring Clo…

学生为什么要在CSDN写博客?

学生为什么要在CSDN写博客&#xff1f;引言写博客的好处构建知识体系提升写作能力扩展人脉为简历加分帮助他人为什么是CSDN如何写博客记录学习总结错误总结与展望引言 就目前来说&#xff0c;学生应该是使用各种博客最多的人&#xff0c;但却不是写博客的主体。在我看来&#…

软考-软件设计师 知识点整理(一篇就过了 建议收藏)

文章目录一 计算机组成CPU寻址方式校验码奇偶校验码&#xff08;只能检一位错&#xff0c;并且不能纠错&#xff09;循环冗余校验码CRC&#xff08;只能检错&#xff0c;不能纠错&#xff09;海明码计算机体系结构分类Flynn分类法&#xff08;理论存在&#xff1a;多指令单数据…

我用Python写了一个下载网站所有内容的软件,可见即可下,室友表示非常好用

Python 写一个下载网站内容的GUI工具&#xff0c;所有内容都能下载&#xff0c;真的太方便了&#xff01;前言本次要实现的功能效果展示代码实战获取数据GUI部分最后前言 哈喽大家好&#xff0c;我是轻松。 今天我们分享一个用Python写下载视频弹幕评论的代码。 之前自游写了…

VMware17虚拟机:下载和安装教程

签名&#xff1a;但行好事&#xff0c;莫问前程。 文章目录前言一、VMware虚拟机是什么&#xff1f;二、如何下载VMware虚拟机&#xff1f;1.打开VMware官方网站2.找到VMware17下载地址三、安装VMware17虚拟机1.双击exe文件2.点击下一步3.勾选许可协议&#xff0c;点击下一步4.…

Java单元测试介绍

文章目录单元测试单元测试基本介绍单元测试快速入门单元测试常用注解单元测试 单元测试基本介绍 单元测试: 单元测试就是针对最小的功能单元编写测试代码&#xff0c;Java程序最小的功能单元是方法&#xff0c;因此&#xff0c;单元测试就是针对Java方法的测试&#xff0c;进…

Error: EPERM: operation not permitted, mkdir ‘D:\software\nodejs\node_cache\_cacach两种解决办法

目录 报错情况&#xff1a;operation not permitted, mkdir ‘D:\software\nodejs\node_cache\_cacach 解决办法&#xff1a; 第一种&#xff1a;选择管理员身份运行命令行 第二种&#xff1a;node安装目录下设置users用户完全控制权限 报错情况&#xff1a;operation not …

电子工程师必须掌握的硬件测试仪器,你确定你都掌握了?

目录示波器示例1&#xff1a;测量示波器自带的标准方波信号输出表笔认识屏幕刻度认识波形上下/左右移动上下/左右刻度参数调整通道1的功能界面捕获信号设置Menu菜单触发方式触发电平Cursor按钮捕捉波形HLEP按钮参考资料频谱分析仪器信号发生器示波器 示例1&#xff1a;测量示波…

Spring Cloud Alibaba 微服务2,注册中心演变 + Nacos注册中心与配置中心

目录专栏导读一、什么是Nacos&#xff1f;二、注册中心演变及其设计思想1、RestTemplate调用远程服务2、通过Nginx维护服务列表&#xff08;upStream&#xff09;3、通过Nacos实现注册中心4、心跳版Nacos三、Nacos Discovery四、Nacos核心功能1、服务注册2、服务心跳3、服务同步…

【Jetpack】Jetpack 简介 ( 官方架构设计标准 | Jetpack 组成套件 | Jetpack架构 | Jetpack 的存在意义 | AndroidX 与 Jetpack 的关系 )

文章目录一、Google 官方推出的架构设计标准 Jetpack二、Jetpack 组成套件三、Jetpack 架构四、Jetpack 的存在意义1、提高开发效率2、最佳架构方案3、消除样本代码4、设备系统兼容性5、改善应用性能6、测试支持五、AndroidX 与 Jetpack 的关系一、Google 官方推出的架构设计标…

Termux安装完整版Linux(Ubuntu)详细步骤

一、Termux 1.Termux简介 Termux是 Android 平台上的一个终端模拟器&#xff0c;之所以称它为“模拟器”而非“虚拟机”&#xff0c;是因为它并非像 PC 端的 VirtualBox 等虚拟机软件那样&#xff0c;在宿主机中虚拟出一个完全独立且完整的系统环境&#xff0c;而只是提供一个…