次の方法で共有

Electron 用 WinML アドオンの作成

このガイドでは、Electron アプリで Windows Machine Learning (WinML) を使用する C# ネイティブ アドオンを作成する方法について説明します。 WinML を使用すると、画像分類、物体検出などのタスクのために、Windows デバイス上で machine learning モデル (ONNX 形式) をローカルで実行できます。

[前提条件]

  • 開発環境のセットアップが完了しました
  • Windows 11 またはWindows 10 (バージョン 1809 以降)

注

WinML は、任意のWindows 10 (1809 以降) またはWindows 11デバイスで実行されます。 パフォーマンスを最大限に高めるには、GPU または NPU を搭載したデバイスをお勧めしますが、API は CPU でも動作します。

手順 1: C# ネイティブ アドオンを作成する

npx winapp node create-addon --template cs --name winMlAddon

これにより、Windows SDK とWindows App SDK参照で構成された C# projectを使用して、winMlAddon/ フォルダーが作成されます。

アドオンをビルドします。

npm run build-winMlAddon

手順 2: SqueezeNet モデルをダウンロードする

  1. AI 開発ギャラリーをインストールする
  2. 画像の分類のサンプルに移動する
  3. SqueezeNet 1.1 モデルをダウンロードする
  4. project ルートの .onnx フォルダーに models/ ファイルをコピーします

注

モデルは、ONNX Model Zoo GitHub リポジトリからダウンロードすることもできます。

手順 3: 必要な NuGet パッケージを追加する

プロジェクトのルートにあるDirectory.packages.propsを更新します。

<PackageVersion Include="Microsoft.ML.OnnxRuntime.Extensions" Version="0.14.0" />
<PackageVersion Include="System.Drawing.Common" Version="9.0.9" />

winMlAddon/winMlAddon.csprojを更新してパッケージ参照を追加します。

<PackageReference Include="Microsoft.ML.OnnxRuntime.Extensions" />
<PackageReference Include="System.Drawing.Common" />

手順 4: サンプル コードを追加する

AI Dev Gallery では、画像分類の完全な実装が、SqueezeNet で提供されます。 適合したコードは、electron-winml サンプルで確認できます。

サンプルから winMlAddon/ フォルダーをコピーするか、サンプル コードで winMlAddon/addon.cs を手動で更新します。

主要な実装の詳細

Project ルート パス: アドオンでは、ONNX モデルとネイティブ依存関係を見つけられるように、projectルート パスを渡す JavaScript コードが必要です。

ネイティブ依存関係の事前読み込み: アドオンには、開発と運用の両方のシナリオで機能する必要な DLL を読み込むためのメソッドが含まれています。

Electron Forge の構成: ネイティブ ファイルをアンパックするようにパッケージャーを構成します。

module.exports = {
  packagerConfig: {
    asar: {
      unpack: "**/*.{dll,exe,node,onnx}"
    },
    ignore: [
      /^\/.winapp\//,
      "\\.msix$",
      /^\/winMlAddon\/(?!dist).+/
    ]
  },
};

手順 5: アドオンをビルドする

npm run build-winMlAddon

手順 6: アドオンをテストする

src/index.jsを開き、アドオンを読み込みます。

const winMlAddon = require('../winMlAddon/dist/winMlAddon.node');

テスト関数を追加します。

const testWinML = async () => {
  try {
    let projectRoot = path.join(__dirname, '..');
    if (projectRoot.includes('app.asar')) {
      projectRoot = projectRoot.replace('app.asar', 'app.asar.unpacked');
    }

    const addon = await winMlAddon.Addon.createAsync(projectRoot);
    console.log('Model loaded successfully!');

    const imagePath = path.join(projectRoot, 'test-images', 'sample.jpg');
    const predictions = await addon.classifyImage(imagePath);

    console.log('Top predictions:');
    predictions.slice(0, 5).forEach((pred, i) => {
      console.log(`${i + 1}. ${pred.label}: ${(pred.confidence * 100).toFixed(2)}%`);
    });
  } catch (error) {
    console.error('Error testing WinML:', error.message);
  }
};

サンプル イメージを含む test-images/ フォルダーを作成してテスト イメージを準備し、次を実行します。

npm start

手順 7: デバッグ ID を更新する

npx winapp node add-electron-debug-identity

注

Windowsで疎にパッケージ化したElectronアプリケーションに関連する既知のバグがあり、これによりクラッシュや空白のウィンドウが発生する可能性があります。 回避策については、 セットアップ ガイド を参照してください。

次のステップ

  • Last updated on