Processing files on the server
There are several important considerations when handling file uploads on the server, most importantly the file size. In this section, we will learn how to process files in Remix’s action
functions. We will start with a naïve implementation before refactoring the code and taking more concerns into account.
Loading files into memory
Let’s get started by implementing some utilities for working with files:
- Create a new
app/modules/attachments.server.ts
file. - Add the following code to
attachments.server.ts
:import fs from 'fs';import path from 'path';export async function writeFile(file: File) { const localPath = path.join(process.cwd(), 'public', file.name); const arrayBufferView = new Uint8Array(await file.arrayBuffer()); fs.writeFileSync(localPath, arrayBufferView);}
The added
writeFile
function accepts a file and writes it to thepublic
folder. Note that this...