Webnn: Uncaught (in promise) Error: External mounted files are not available.

[janani-suresh-97]

I am trying to infer a model in Qualcomm NPU. I try to load the model and this is the error I get:

This is my index.html code

<title>ONNX Runtime WebNN Example</title>

WebNN Image Classifier

Select an image to classify.

<script src="https://cdn.jsdelivr.net/npm/onnxruntime-web/dist/ort.all.min.js"></script> <script src="main.js"></script>

This is my inference code while trying to infer on Qualcomm NPU (main.js):

const modelPath = 'model.onnx';
const classesPath = 'classes.txt';

const options = {
executionProviders: [
{
name: 'webnn',
deviceType: 'npu',
powerPreference: 'default',
},
],
};

let classLabels = [];

async function loadClasses() {
const response = await fetch(classesPath);
const text = await response.text();
classLabels = text.split('\n').map(label => label.trim()).filter(label => label.length > 0);
}

async function loadModel() {
try {
const session = await ort.InferenceSession.create(modelPath, options);
return session;
} catch (err) {
document.getElementById('result').textContent = Model load failed: ${err.message};
throw err;
}
}

function preprocessImage(imageElement) {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = 224;
canvas.height = 224;
ctx.drawImage(imageElement, 0, 0, 224, 224);
const imageData = ctx.getImageData(0, 0, 224, 224).data;

const input = new Float32Array(3 * 224 * 224);
for (let i = 0; i < 224 * 224; i++) {
input[i] = imageData[i * 4] / 255.0;
input[i + 224 * 224] = imageData[i * 4 + 1] / 255.0;
input[i + 2 * 224 * 224] = imageData[i * 4 + 2] / 255.0;
}

return new ort.Tensor('float32', input, [1, 3, 224, 224]);
}

async function classifyImage(file) {
const img = new Image();
img.src = URL.createObjectURL(file);
await img.decode();

const session = await loadModel();
const inputTensor = preprocessImage(img);

const feeds = { image_tensor: inputTensor }; // ✅ Correct input name
const results = await session.run(feeds);
const outputData = results.class_logits.data; // ✅ Correct output name

const topIndex = outputData.indexOf(Math.max(...outputData));
const predictedLabel = classLabels[topIndex] || Class ${topIndex};

document.getElementById('result').textContent = Prediction: ${predictedLabel};
}

document.getElementById('imageInput').addEventListener('change', async (e) => {
const file = e.target.files[0];
if (file) {
await loadClasses();
classifyImage(file);
}
});

I don't know why I am getting this error