微信小程序中使用TensorFlowJS從環境搭建到模型訓練及推理模型得到預測結果

1、小程序端環境準備

在這里插入圖片描述
app.json

  "plugins": {"tfjsPlugin": {"version": "0.2.0","provider": "wx6afed118d9e81df9"}}

package.json

  "dependencies": {"@tensorflow-models/posenet": "^2.2.2","@tensorflow/tfjs-backend-webgl": "3.5.0","@tensorflow/tfjs-converter": "3.5.0","@tensorflow/tfjs-core": "^3.5.0","@tensorflow/tfjs-layers": "^4.22.0","fetch-wechat": "^0.0.3","lottie-miniprogram": "^1.0.12"}

終端執行

Microsoft Windows [版本 10.0.19045.6093]
(c) Microsoft Corporation。保留所有權利。E:\AAASelfProjectGit\myWxProject> npm i

在微信開發者工具中點擊工具->構建npm

2、訓練模型

python環境

python          3.8.20
protobuf        3.20.3
numpy           1.22.0
tensorflowjs    3.7.0
tensorflow      2.13.0

訓練代碼 (使用手寫數字數據集,keras自帶minist)

import tensorflow as tfmnist = tf.keras.datasets.mnist(x_train, y_train),(x_test, y_test) = mnist.load_data()x_train, x_test = x_train / 255.0, x_test / 255.0model = tf.keras.models.Sequential([tf.keras.layers.Flatten(input_shape=(28, 28)),tf.keras.layers.Dense(128, activation='relu'),tf.keras.layers.Dropout(0.2),  tf.keras.layers.Dense(10, activation='softmax')])model.compile(optimizer='adam',loss='sparse_categorical_crossentropy',metrics=['accuracy'])model.fit(x_train, y_train, epochs=5)model.evaluate(x_test, y_test)model.save('D:\\mnist.h5')

訓練完成后.h5文件會在D盤,下面代碼將.h5轉換成tensorflowjs所需要的.json格式

import os
import subprocessh5_model_path = "D:\\mnist.h5"
output_dir = "D:\\"
os.makedirs(output_dir, exist_ok=True)# 使用絕對路徑調用(需替換為你的實際路徑)
command = ["python","D:\\anaconda\\envs\\ckm\\Scripts\\tensorflowjs_converter.exe",  # Windows 路徑示例"--input_format=keras",h5_model_path,output_dir
]try:subprocess.run(command, check=True)print("轉換成功!")
except subprocess.CalledProcessError as e:print(f"轉換失敗,錯誤代碼: {e.returncode}")

轉換成功后會得到兩個文件

在這里插入圖片描述

將兩個文件上傳到服務器,通過地址訪問.json

3、小程序端代碼預測

在js中引入并使用

var fetchWechat = require('fetch-wechat');
var tf = require('@tensorflow/tfjs-core');
var tfl = require('@tensorflow/tfjs-layers');
var webgl = require('@tensorflow/tfjs-backend-webgl');
var plugin = requirePlugin('tfjsPlugin');Page({async onReady() {//加載相機const camera = wx.createCameraContext(this)// 加載模型const net = await this.loadModel()this.setData({result: 'Loading'})let count = 0//每隔10幀獲取一張相機捕捉到的圖片const listener = camera.onCameraFrame((frame) => {count++if (count === 10) {if (net) {//對圖片內容進行預測this.predict(net, frame)}count = 0}})listener.start()},//加載模型async loadModel() {const net = await tfl.loadLayersModel('https://你的服務器域名.com/model.json')net.summary()return net},async predict(net, frame) {try {const x = tf.tidy(() => {const imgTensor = tf.tensor3d(new Uint8Array(frame.data), [frame.height, frame.width, 4])const d = Math.floor((frame.height - frame.width) / 2)const imgSlice = tf.slice(imgTensor, [d, 0, 0], [frame.width, frame.width, 3])const imgResize = tf.image.resizeBilinear(imgSlice, [28, 28])return tf.mean(imgResize, 2) // [28, 28]})// 添加批次維度 [1, 28, 28]const input = tf.reshape(x, [1, ...x.shape])// 預測并處理結果const prediction = await net.predict(input)// 使用tf.topk替代argMaxconst {values, indices} = tf.topk(prediction, 1)const res = indices.dataSync()[0]this.setData({result: res})// 釋放內存tf.dispose([x, input, prediction, values, indices])} catch (error) {console.error('預測錯誤:', error)this.setData({result: 'Error: ' + error.message})}}})

在wxml中展示{{result}}即可看到預測結果

<view class="landscape-container"><!-- 相機層(橫屏適配) --><camera device-position="back" resolution="high" frame-size="large" style="width: 100%; height: 100vh;z-index:10;" catch:tap="cameraClick" id="myCamera"></camera><view style="position: absolute;bottom: 100px;z-index: 99;left: 50%;transform: translateX(-50%);font-size: 20px;font-weight: 800;color: white;">預測結果:{{result}}</view>
</view>

在這里插入圖片描述

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/diannao/94561.shtml
繁體地址,請注明出處:http://hk.pswp.cn/diannao/94561.shtml
英文地址,請注明出處:http://en.pswp.cn/diannao/94561.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

深入剖析通用目標跟蹤:一項綜述

摘要 通用目標跟蹤仍是計算機視覺領域一項重要且具有挑戰性的任務,其難點在于復雜的時空動態變化,尤其在存在遮擋、相似干擾物和外觀變化的情況下。過去二十年間,為應對這些挑戰,研究者提出了多種跟蹤范式,包括基于孿生網絡的跟蹤器、判別式跟蹤器以及近期突出的基于Tran…

Next.js 鏈接與導航:頁面間無縫切換

鏈接與導航&#xff1a;頁面間無縫切換 關鍵要點 Next.js 提供了 <Link> 組件和程序化導航方法&#xff0c;實現頁面間高效、無縫的切換。<Link> 組件利用客戶端導航和預加載技術&#xff0c;優化用戶體驗和性能。程序化導航通過 useRouter 鉤子&#xff08;Page…

根據經緯度(從nc格式環境數據文件中)提取環境因子

根據經緯度&#xff08;從nc格式環境數據文件中&#xff09;提取環境因子 文章目錄前言一、準備所需文件二、代碼分享總結前言 本文主要利用nc格式環境數據文件和物種經緯度分布文件&#xff0c;根據經緯度&#xff08;從nc格式環境數據文件中&#xff09;提取環境因子 一、準…

Uniapp 自定義 Tabbar 實現教程

Uniapp 自定義 Tabbar 實現教程1. 簡介2. 實現步驟2.1 創建自定義 Tabbar 組件2.2 配置 pages.json3.1 路由映射3.2 樣式設計3.3 圖標處理4. 常見問題及解決方案4.1 頁面跳轉問題4.2 樣式適配問題4.3 性能優化5. 擴展功能5.1 添加徽標5.2 添加動畫效果6. 總結1. 簡介 在 Uniap…

JuiceFS存儲

因語雀與csdn markdown 格式有區別&#xff0c;請查看原文&#xff1a; https://www.yuque.com/dycloud/pss8ys 一、JuiceFS 介紹 1.1 JuiceFS 是什么 JuiceFS 是一款面向云環境設計的高性能 POSIX 文件系統&#xff0c;核心能力是將對象存儲轉化為全功能文件系統。它采用獨…

【HarmonyOS Next之旅】DevEco Studio使用指南(三十八) -> 構建HAR

目錄 1 -> 前言 2 -> 使用約束 3 -> 創建模塊 4 -> 構建HAR 4.1 -> 以debug模式構建HAR 4.2 -> 以release模式構建HAR 4.3 -> 構建字節碼格式的HAR 4.4 -> 對HAR進行簽名 1 -> 前言 構建模式&#xff1a;DevEco Studio默認提供debug和rele…

93、【OS】【Nuttx】【構建】cmake menuconfig 目標

【聲明】本博客所有內容均為個人業余時間創作&#xff0c;所述技術案例均來自公開開源項目&#xff08;如Github&#xff0c;Apache基金會&#xff09;&#xff0c;不涉及任何企業機密或未公開技術&#xff0c;如有侵權請聯系刪除 背景 接之前 blog 【OS】【Nuttx】【構建】cm…

React 表單處理:移動端輸入場景下的卡頓問題與防抖優化方案

文章目錄每日一句正能量前言一、問題場景與表現二、技術攻堅過程三、優化效果與經驗沉淀每日一句正能量 山再高&#xff0c;往上攀&#xff0c;總能登頂&#xff1b;路再長&#xff0c;走下去&#xff0c;終將到達。每日一勵&#xff0c;勇往直前。 前言 在移動端 React 項目開…

數據安全防護所需要的關鍵要素

數據安全防護是一個覆蓋數據全生命周期&#xff08;采集、存儲、傳輸、處理、銷毀&#xff09;、融合技術、管理、流程與人員的系統性工程。其核心目標是保障數據的??保密性&#xff08;Confidentiality&#xff09;、完整性&#xff08;Integrity&#xff09;、可用性&#…

【JavaEE】(8) 網絡原理 HTTP/HTTPS

一、什么是 HTTP 協議 上節說到&#xff0c;應用層的協議需要約定通信的內容和數據格式。我們可以自定義應用層協議&#xff0c;也可以基于現成的應用層協議進行開發。協議的種類很多&#xff0c;最常見的之一就是 HTTP&#xff0c;廣泛用于網站和手機 App。準確來說&#xff0…

C語言的數組與字符串練習題4

C語言的數組與字符串練習題4 16. 數組元素去重 題目描述: 編寫一個C程序,輸入一組整數存儲在數組中,去除數組中的重復元素,并輸出去重后的數組。 解題思路: 遍歷數組,對于每個元素,檢查它之前是否已經存在相同的元素。如果不存在,則將其保留;否則,跳過。可以使用一…

Transformers簡單介紹 - 來源于huggingface

Transformers介紹 - 來源于huggingface 文章目錄Transformers介紹 - 來源于huggingfaceTransformers能做什么pipeline()函數零樣本分類推理API完形填空命名實體識別問答摘要提取翻譯transformers是如何工作的transformers的具體組成注意力層機制transformers原始結構architectu…

template<typename R = void> 意義

在 C 中&#xff0c;template<typename R void> 表示定義一個模板參數 R&#xff0c;其默認類型為 void。這意味著&#xff1a;如果用戶沒有顯式指定 R&#xff0c;則 R 默認為 void。如果用戶顯式指定了 R&#xff08;如 template<typename R void> 后面跟著 &l…

國產3D大型裝配設計新突破①:圖紙打開設計雙加速 | 中望3D 2026

本文為CAD芯智庫整理&#xff0c;未經允許請勿復制、轉載&#xff01;在中望3D 2026的新版中&#xff0c;不僅在設計效率上進行了重大優化&#xff0c;更是在裝配方面實現了突破性的改進&#xff0c;讓每一個項目都能快速、精確地從概念變為現實。 中望3D2026亮點速遞裝配篇將…

游戲開發狀態機與行為樹的優缺點

在游戲開發中&#xff0c;狀態機&#xff08;Finite State Machine, FSM&#xff09; 和行為樹&#xff08;Behavior Tree, BT&#xff09; 是兩種常用的 AI 邏輯控制框架&#xff0c;分別適用于不同場景&#xff0c;其優缺點對比可從靈活性、維護成本、適用場景等多個維度分析…

Linux下ELF文件的介紹

目錄 1.溫故知新 2.ELF文件介紹 3.ELF文件組成 4.ELF文件形成到加載 5.連接過程 1.溫故知新 上一篇博客&#xff0c;我們介紹了我們的動靜態&#xff0c;知道了我們的庫其實也是文件&#xff0c;如果我們想寫一個庫也是可以的&#xff0c;我們的把我們的庫文件編譯成.o文件…

人工智能領域、圖歐科技、IMYAI智能助手2025年6月更新月報

2025年6月AI領域重要模型更新與平臺優化匯總 摘要&#xff1a; 本文匯總了2025年6月期間AI領域發布的多項重要模型更新及平臺功能優化信息&#xff0c;涵蓋Google Gemini、阿里通義萬相、字節豆包、百度文心一言、MiniMax海螺02、Google Veo3、快手可靈2.1、FLUX Kontext等模型…

從零開始學Express,理解服務器,路由于中間件

當我們初學前端時&#xff0c;常常只關注頁面效果和交互&#xff0c;但隨著項目復雜度提升&#xff0c;我們遲早會遇到“服務端”的問題&#xff1a;如何讓一個頁面的數據是從數據庫來的&#xff1f;怎么讓不同的用戶看到不同的內容&#xff1f;這時候&#xff0c;我們就需要一…

Codeforces Round 987 (Div. 2)

ABC 略D預處理出每個位置的前綴最大和后綴最小。從后向前枚舉&#xff0c;如果一個數無法后移&#xff0c;那么答案就是最大前綴&#xff0c;否則答案要不是前綴最大&#xff0c;要不就是這個數先移到前綴最大位置再移到能移到的最大的位置此處的答案。用線段樹維護#include<…

Javascript/ES6+/Typescript重點內容篇——手撕(待總結)

前端核心知識點梳理與面試題詳解 1. Promise 核心知識點 Promise 是異步編程的解決方案&#xff0c;用于處理異步操作三種狀態&#xff1a;pending&#xff08;進行中&#xff09;、fulfilled&#xff08;已成功&#xff09;、rejected&#xff08;已失敗&#xff09;狀態一旦改…