From 7a40bbda9dd690a6e8e374ab88fb11fe5f40b498 Mon Sep 17 00:00:00 2001 From: "Marlon B. Buella" Date: Fri, 10 Jan 2025 18:35:50 +0800 Subject: [PATCH] Rewrote fileToUint8Array function to be also NodeJS/Deno compatible. (#2117) ## Motivation for the change, related issues Performing multipart upload and posting of data currently works on the web (client) side. Doing it on PHP WASM instance running on NodeJS or other server runtimes (except Deno) causes this issue due to [FileReader not supported on the runtime](https://developer.mozilla.org/en-US/docs/Web/API/FileReader#browser_compatibility): ``` ReferenceError: FileReader is not defined at file:///c/Users/alonbuella/Documents/projects/php-wasm-vercel/node_modules/@php-wasm/universal/index.js:1717:15 at new Promise () at fileToUint8Array (file:///c/Users/alonbuella/Documents/projects/php-wasm-vercel/node_modules/@php-wasm/universal/index.js:1716:10) at encodeAsMultipart (file:///c/Users/alonbuella/Documents/projects/php-wasm-vercel/node_modules/@php-wasm/universal/index.js:1702:38) at PHPRequestHandler.ce (file:///c/Users/alonbuella/Documents/projects/php-wasm-vercel/node_modules/@php-wasm/universal/index.js:2070:48) at PHPRequestHandler.le (file:///c/Users/alonbuella/Documents/projects/php-wasm-vercel/node_modules/@php-wasm/universal/index.js:2056:33) at process.processTicksAndRejections (node:internal/process/task_queues:95:5) ``` ## Implementation details This PR introduces an alternative to using FileReader in order to determine the `Uint8Array` value for a `File` instance. This is creating a new instance of `Uint8Array` from the file's buffer instead. `File`'s [arrayBuffer](https://developer.mozilla.org/en-US/docs/Web/API/Blob/arrayBuffer#browser_compatibility) instance method and [Uint8Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array#browser_compatibility) class are both supported on NodeJS and Deno, and as well as on most recent browsers. ## Testing Instructions (or ideally a Blueprint) - Tested locally via `npm run test` - CI --- .../universal/src/lib/encode-as-multipart.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/php-wasm/universal/src/lib/encode-as-multipart.ts b/packages/php-wasm/universal/src/lib/encode-as-multipart.ts index 120fbf8c22..f4fb294e18 100644 --- a/packages/php-wasm/universal/src/lib/encode-as-multipart.ts +++ b/packages/php-wasm/universal/src/lib/encode-as-multipart.ts @@ -47,11 +47,9 @@ export async function encodeAsMultipart( } function fileToUint8Array(file: File): Promise { - return new Promise((resolve) => { - const reader = new FileReader(); - reader.onload = () => { - resolve(new Uint8Array(reader.result as ArrayBuffer)); - }; - reader.readAsArrayBuffer(file); - }); + /** + * @mbuella: Use File.arrayBuffer() to get a Uint8Array from a file, avoiding FileReader + * which is browser-specific. This method is supported in major browsers and NodeJS/Deno runtimes. + */ + return file.arrayBuffer().then((fileBuffer) => new Uint8Array(fileBuffer)); }