在 reactjs 中为 tensorflowjs 加载 model.json 不工作

Question

我正在尝试从我的 React 应用程序的根目录中加载 model.json 文件 weights.bin。

当我调用从 storage.googleapis.com 在线找到的示例时，它可以工作，但从我的根目录加载则不能。

我的 React 应用中 App.js 的内容...

import React from "react";
import "./styles.css";

const tf = require("@tensorflow/tfjs");

// example model - working
async 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 working
async 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 方案 file://url 仅用于加载模型服务器端。要在浏览器中加载模型，系统会提示用户 select 模型拓扑 (model.json) 和权重文件。 doc 包含一个示例，说明如何通过使用文件输入元素提示用户来加载模型。

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

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

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

在 reactjs 中为 tensorflowjs 加载 model.json 不工作

load model.json for tensorflowjs in reactjs not working

javascript

reactjs

tensorflow.js