load model.json for tensorflowjs in reactjs

Question

我正在尝试从我的react应用程序中的根目录中加载一个带有权重.bin的model.json文件。当我调用我从 storage.googleapis.com 在线找到的示例时，它有效，但从我的根加载不起作用。App.js的内容在我的反应应用程序中...import React from "react";import "./styles.css";const tf = require("@tensorflow/tfjs");// example model - workingasync function predict() {  const model = await tf.loadGraphModel(    "https://storage.googleapis.com/tfjs-models/savedmodel/mobilenet_v2_1.0_224/model.json"  );  console.log(typeof model);}// my model - not workingasync function predictAlt() {  const myModel = await tf.loadLayersModel("file://my-model.json");  console.log(typeof model);}export default function App() {  return (    <div className="App">      <button onClick={predict} style={{ fontSize: "20px" }}>        example model      </button>      <br />      <br />      <button onClick={predictAlt} style={{ fontSize: "20px" }}>        my model      </button>    </div>  );}

Answer 1

文件 URI 方案仅用于加载模型服务器端。要在浏览器中加载模型，可以提示用户选择模型拓扑（model.json）和权重文件。该文档包含一个示例，说明如何通过使用文件输入元素提示用户来加载模型。file://url

如果不要求用户选择模型文件，则需要由服务器提供模型。例如，model.json 和权重可以位于所部署应用程序的资产文件夹中。然后，url只需要指向没有，如下所示：model.jsonfile://

const myModel = await tf.loadLayersModel("assets/my-model.json");

如果在加载模型时出现一些错误，请查看开发人员控制台中的“网络”选项卡将有助于查看是否找到该文件