Python 在Javascript网页中加载在Colab中创建的对象识别模型

我通过以下示例创建了对象识别模型：
我使用Colab创建了这个模型，现在我从Colab中得到了.py和.ipynb中的一个模型

使用此指令，我将模型保存在.h5中：

model.compile（loss='mean\u squared\u error'，optimizer='adam'，metrics=['binary\u accurity']）

model.save（'./modelname.h5'）

现在，我可以尝试以另一种格式保存此模型，我使用此代码将其保存在.json和group1 shard°of°。bin文件中：

！pip安装tensorflowjs

！mkdir型号

！tensorflowjs_转换器——输入格式keras modelname.h5 model/

！zip-r modelname.zip模型

现在我的目标是能够用Javascript将此模型加载到我的webapp中，并使用它识别图像
问题在于能否加载模型
有解决办法吗

更新
我使用页面视图的屏幕截图作为图像来识别
这是我的代码的基本部分：

async function LoadModel() {
    Model = await tf.loadLayersModel('http://localhost/..../model.json'); //caricamento mio modello
    console.log('conferma caricamento modello ' + Model);
try {
    maxPredictions = Model.getTotalClasses();
    console.log("durante");
}
catch (e){}
if (Model) {
    //controllo caricamento modello
    console.log(Model);
}
console.log("dopo e modello " + Model);
}

然后

这是可识别的图像

async function recognizeImage(Image) {
var cont;
var data = "";
var maxClassName = "";
var maxProbability = "";
const prediction = await Model.predict(Image);
for (let i = 0; i < maxPredictions; i++) {
    if (i==0) {
        maxClassName = prediction[i].className;
        maxProbability = prediction[i].probability;
    }
    else if (prediction[i].probability>maxProbability) {
        maxClassName = prediction[i].className;
        maxProbability = prediction[i].probability;
    }
}
if(maxProbability > 0.90 ) {
        console.log(maxProbability + '  than' + maxClassName);
    return;
} 
else {
    console.log(maxProbability + maxClassName + "Nothing" );
    }
}

异步函数识别图像（图像）{
var cont；
var数据=”；
var maxClassName=“”；
var最大概率=”；
const prediction=wait Model.predict（图像）；
for（设i=0；i最大概率）{
maxClassName=prediction[i].className；
最大概率=预测[i]。概率；
}
}
如果（最大概率>0.90）{
log（maxProbability+'than'+maxClassName）；
返回；
} 
否则{
log（maxProbability+maxClassName+“Nothing”）；
}
}

您可以使用

tf.loadLayersModel(modelUrl)

---

在节点上，可以直接访问文件。但浏览器无法访问文件系统；因此model.json需要首先由服务器提供服务。这篇文章已经讨论过了，我正在使用React js加载模型（图像分类和更多机器学习内容）

Tensorflow.js不支持Api来读取以前训练过的模型

const file=new Blob（）
file.src=modelJSON
const files=new Blob（）
files.src=modelWeights
console.log（文件）
const model=wait tf.loadLayersModel（tf.io.browserFiles（[file，files]）；

如果您使用web应用程序（对于tensorflow.lite，您可以使用opencv.readTensorflowmodel（model.pb，weight.pbtxt），则可以在Express.js中创建一个APi来为您的模型（model.json和weigths.bin）提供服务器

参考资料：

const classifierModel=wait tf.loadLayersModel（
"https://rp5u7.sse.codesandbox.io/api/pokeml/classify"
); 
常量im=新图像（）
im.src=imagessample/'../../../../../../Models/shapeClassification/Samples/images（2.png'）；
const abc=此预处理图像（im）；
const preds=await classifierModel.predict（abc）/.argMax（-1）；
log（“”，preds，'Principal'，preds.shape[0]，'DATA'，preds.dataSync（））
const responde=[…preds.dataSync（）]
log（'Maxmimo Valor'，Math.max.apply（Math，response.map（函数（o）{return o；}）））
设indiceMax=this.indexOfMax（响应）
console.log（indiceMax）
console.log（“”，this.labelReturn（indiceMax））

加载模型时您遇到了什么问题？我无法从一开始就加载模型，我找不到正确加载模型的方法或过程我收到了此错误

错误：检查模型时出错：传递给模型的张量数组不是模型预期的大小。预期会看到1个张量在新的e（tf.min.js:2）在Bm（tf.min.js:2）在e.predict（tf.min.js:2）在e.predict（tf.min.js:2）在HTMLImageElement.ResizeImage.onload（index.js:519）在recognizeImage（index.js:528）中得到了0个张量

您能用抛出错误的js代码更新您的问题吗？我不知道这是否是我的错误，更重要的是我正在将页面视图的屏幕作为图像进行识别，我立即加载涉及到的部分代码这是对上述问题的回答？我看不到连接，您的图像似乎表明我编写了一个Express.js服务器（references:）。现在，我的React.js web应用程序使用了一个axios，它向我在Express中托管的tensorflow.js模型提交了一份请愿书。

async function recognizeImage(Image) {
var cont;
var data = "";
var maxClassName = "";
var maxProbability = "";
const prediction = await Model.predict(Image);
for (let i = 0; i < maxPredictions; i++) {
    if (i==0) {
        maxClassName = prediction[i].className;
        maxProbability = prediction[i].probability;
    }
    else if (prediction[i].probability>maxProbability) {
        maxClassName = prediction[i].className;
        maxProbability = prediction[i].probability;
    }
}
if(maxProbability > 0.90 ) {
        console.log(maxProbability + '  than' + maxClassName);
    return;
} 
else {
    console.log(maxProbability + maxClassName + "Nothing" );
    }
}

tf.loadLayersModel(modelUrl)

     const classifierModel = await tf.loadLayersModel(            
            "https://rp5u7.sse.codesandbox.io/api/pokeml/classify"
        ); 
        const im = new Image()
            im.src =imagenSample//'../../../../../Models/ShapesClassification/Samples/images (2).png';
        const abc= this.preprocessImage(im);
const preds = await classifierModel.predict(abc)//.argMax(-1);
            console.log('<Response>',preds,'Principal',preds.shape[0],'DATA',preds.dataSync())
            const responde=[...preds.dataSync()]
            console.log('Maxmimo Valor',Math.max.apply(Math, responde.map(function(o) { return o; })))
            let indiceMax = this.indexOfMax(responde)
            console.log(indiceMax)
            console.log('<<<LABEL>>>',this.labelsReturn(indiceMax))