maierfelix / WebGPU-Path-Tracer

Toy path tracer using WebGPU RT

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Fix for WebAssembly File Loading in Node.js Environment

alivemachine opened this issue · comments

Issue Description
When attempting to run the WebGPU Path Tracer in a Node.js environment locally, the application fails to load the WebAssembly (Wasm) binary file due to an "unknown scheme" error. This issue arises because the application uses the fetch API to load the Wasm file, which is not compatible with local file paths in Node.js.

Environment
Node.js Version: 18.17.1
Operating System: Windows 10
Path to Wasm File: ...WebGPU-Path-Tracer\node_modules\tolw\tolw.wasm

Detailed Error Output

node:internal/deps/undici/undici:11576
    Error.captureStackTrace(err, this);
          ^

TypeError: fetch failed
    at Object.fetch (node:internal/deps/undici/undici:11576:11) {
  cause: Error: unknown scheme
      at makeNetworkError (node:internal/deps/undici/undici:6893:35)
      at schemeFetch (node:internal/deps/undici/undici:11036:18)
      at node:internal/deps/undici/undici:10909:26
      at mainFetch (node:internal/deps/undici/undici:10926:11)
      at fetching (node:internal/deps/undici/undici:10883:7)
      at fetch2 (node:internal/deps/undici/undici:10761:20)
      at Object.fetch (node:internal/deps/undici/undici:11574:18)
      at fetch (node:internal/process/pre_execution:229:25)
      at instantiateAsync (C:\...\node_modules\tolw\tolw.js:693:7)
      at createWasm (C:\...\WebGPU-Path-Tracer\node_modules\tolw\tolw.js:717:3)
}

Steps to Reproduce
Clone the WebGPU Path Tracer repository.
Run npm install to install dependencies.
Execute npm run start to start the application.
Proposed Solution
The solution involves modifying the instantiateAsync function to bypass the fetch API in Node.js environments and instead use Node.js's fs module to read the Wasm file directly from the filesystem. This approach ensures compatibility with local file paths in Node.js.

To correct this bug got to WebGPU-Path-Tracer\node_modules\tolw\tolw.js
Here's an adjustment to the instantiateAsync function taht worked for me:

  async function instantiateAsync() {
    // Check if running in Node.js environment
    if (ENVIRONMENT_IS_NODE) {
      const fs = require('fs').promises;
      try {
        const path = require('path');
        // Ensure the path is correctly resolved, especially if running from different directories
        const wasmPath = path.resolve(__dirname, wasmBinaryFile);
        const wasmBinary = await fs.readFile(wasmPath);
        const wasmObject = await WebAssembly.instantiate(new Uint8Array(wasmBinary), info);
        receiveInstance(wasmObject.instance);
      } catch (err) {
        console.error('Error during Wasm instantiation:', err);
        abort(err);
      }
    } else if (typeof WebAssembly.instantiateStreaming === 'function' && !isDataURI(wasmBinaryFile) && typeof fetch === 'function') {
      // Existing fetch logic for web environments...
      fetch(wasmBinaryFile, { credentials: 'same-origin' })
        .then(response => {
          const result = WebAssembly.instantiateStreaming(response, info);
          return result.then(receiveInstantiatedSource, reason => {
            console.error('Wasm streaming compile failed:', reason);
            console.error('Falling back to ArrayBuffer instantiation');
            instantiateArrayBuffer(receiveInstantiatedSource);
          });
        });
    } else {
      return instantiateArrayBuffer(receiveInstantiatedSource);
    }
  }

Hope tht works for you!