> For the complete documentation index, see [llms.txt](https://codemash.gitbook.io/codemash/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://codemash.gitbook.io/codemash/cloud/files/browser/upload.md).

# Upload files

Upload one or more files into a folder of a storage.

**Where:** Files → Browser → **Upload file** · `/projects/<project>/files/browser`

## Before you start

* The project has at least one files integration — see [Providers](/codemash/cloud/files/integrations/providers.md). Without one, the browser shows *Connect File Integrations to Use Files in Your Project* and no **Upload file** button.
* For AWS S3, the bucket allows your Cloud address in its CORS rules (the AWS S3 wizard shows the JSON) — the browser sends the bytes straight to the bucket.

## Steps

1. Open **Files → Browser**. If the project has more than one integration, pick the storage in **Integrations**, for example **Product images (Local)**.
2. Open the folder the files should go into, for example `mugs`. The file keeps its name: uploading `blue-mug.png` here stores `mugs/blue-mug.png`.

   <figure><img src="https://712692422-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHy372bqsaex2cqS3ikhL%2Fuploads%2Fgit-blob-ff2aebd96ed4b69835fc6b3d95768fb267b36e7d%2Fupload-1.png?alt=media" alt="Files Browser in the folder mugs with green-mug.png and red-mug.png and the Upload file button at the top right"><figcaption><p>In the folder <code>mugs</code>, before the upload.</p></figcaption></figure>
3. Press **Upload file** and pick one or more files, for example `blue-mug.png`. While they upload the button says **Uploading…**; several files go one after the other, and one failed file does not stop the rest.

## Result

A message **Upload done** (*blue-mug.png uploaded*) shows for five seconds, and the file appears in the list. For several files the message counts them. A file with a name that is already in the folder replaces the old one — see [Replace a file](/codemash/cloud/files/browser/edit.md#steps).

<figure><img src="https://712692422-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHy372bqsaex2cqS3ikhL%2Fuploads%2Fgit-blob-799f04f55ca2f9407eb3d63190440aae34f85209%2Fupload-2.png?alt=media" alt="Files Browser in the folder mugs with blue-mug.png, green-mug.png and red-mug.png"><figcaption><p><code>blue-mug.png</code> is in the folder.</p></figcaption></figure>

Every upload fires the [Files triggers](/codemash/cloud/files/triggers.md) of **When uploaded** whose folder matches.

{% hint style="warning" %}
On a **Local** integration a `.csv` file cannot be uploaded today: the message **Upload failed** says *price-list.csv failed: the storage provider refused the file (HTTP 403)*. The server refuses the CSV content type before it stores anything. Rename the file to `.txt`, or zip it, until this is fixed. Other providers are not affected, because the browser sends the bytes to them directly.
{% endhint %}

<figure><img src="https://712692422-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHy372bqsaex2cqS3ikhL%2Fuploads%2Fgit-blob-e32f309acad2e3e6cf5bbafb5e446e7e954ec672%2Fupload-3.png?alt=media" alt="Upload failed: price-list.csv failed: the storage provider refused the file (HTTP 403), over the folder catalog of Product images (Local)"><figcaption><p>A CSV upload to Local fails.</p></figcaption></figure>

## Change or remove it later

* **Replace** — upload a file with the same name into the same folder; see [Preview, download or replace a file](/codemash/cloud/files/browser/edit.md).
* **Share** — [Public links](/codemash/cloud/files/browser/public-links.md).
* **Delete** — [Delete a file](/codemash/cloud/files/browser/delete.md).

## Do it from code

An upload is three calls: ask for an upload link, send the bytes to it with `PUT`, then commit so Norbix records the file and fires the triggers.

```ts
import fs from 'node:fs';

const bytes = fs.readFileSync('blue-mug.png');
const path = 'mugs/blue-mug-from-code.png';
const { url } = await norbix.api.files.requestUploadUrl({ filesIntegrationId, path, contentType: 'image/png' });
await fetch(url, { method: 'PUT', headers: { 'Content-Type': 'image/png' }, body: bytes }); // 200
await norbix.api.files.commitUpload({ filesIntegrationId, path, contentType: 'image/png', sizeBytes: bytes.length, fileName: 'blue-mug-from-code.png' });
```

```sh
norbix api files upload url request --filesIntegrationId int_45rkbZX4ecZBkiv6gXe5Da --path mugs/green-mug.png --contentType image/png
# then: curl -X PUT -H "Content-Type: image/png" --data-binary @green-mug.png "<url>"
# then: norbix api files upload commit --filesIntegrationId int_45rkbZX4ecZBkiv6gXe5Da --path mugs/green-mug.png --contentType image/png --sizeBytes 1693 --fileName green-mug.png
```

The CLI also has `norbix files upload <file> <path> --integration int_…`, which does the three steps in one command (see the [Files page](/codemash/cloud/files.md#use-it-from-code)). API: [Request Upload Url](/codemash/api-reference/files/upload-url/request-upload-url.md) · [Put File Content](/codemash/api-reference/files/content/put-file-content.md) (Local only) · [Commit Upload](/codemash/api-reference/files/commit/commit-upload.md)