> ## Documentation Index
> Fetch the complete documentation index at: https://docs.fivemanage.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Presigned URLs

> Presigned URLs is the safest way to upload files through the client. One example is from NUI in FiveM, where you otherwise would expose the token to every client if you're not using a presigned URL, or uploading your files from the server. 

To get a presigned URL, you first need to request for it. Here we'll go through how you'd do it

<Steps>
  <Step title="Request the presigned URL">
    Start by performing a `GET` request on the server. This needs to contain the endpoint and your API token.

    <Tabs>
      <Tab title="cURL">
        ```bash theme={null}
        curl --request GET \
        	--url 'https://api.fivemanage.com/api/v3/file/presigned-url' \
        	--header 'Authorization: YOUR_API_TOKEN' \
        ```

        You will then get a response that looks like this:

        ```json theme={null}
        {
        	"data": {
            	"presignedUrl": "https://api.fivemanage.com/api/v3/file/presigned-url/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
          	},
        	"status": "ok"
        }
        ```

        This is the url that you will be using in order to upload the file.
      </Tab>

      <Tab title="Node">
        ```javascript theme={null}
        const options = {
        	method: 'GET',
        	headers: {
        		'User-Agent': 'YOUR_SERVICE',
        		Authorization: 'YOUR_API_TOKEN'
        	}
        };

        fetch('https://api.fivemanage.com/api/v3/file/presigned-url', options)
        	.then(response => response.json())
            .then(response => console.log(response))
        	.catch(err => console.error(err));
        ```
      </Tab>
    </Tabs>
  </Step>

  <Step title="Uploading files">
    <Tabs>
      <Tab title="cURL">
        ```http theme={null}
        curl --request POST \
        	--url https://api.fivemanage.com/api/v3/file/presigned-url/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9... \
        	--header 'Content-Type: multipart/form-data' \
        	--form file=path/to/your/file.png
        ```

        ### Response

        The response you get back is like any other file upload using the other uploads API endpoints.

        ```json theme={null}
        {
          "data": {
            "id": "7F9pGhN8qwErT1vx5aZk",
            "url": "https://r2.fivemanage.com/6E9pGhN8qwErT1vx5aZk/7F9pGhN8qwErT1vx5aZk.jpg"
          },
          "status": "ok"
        }
        ```
      </Tab>

      <Tab title="Node">
        ```javascript theme={null}
        const axios = require('axios');
        const fs = require('fs');

        // this is the URL you got from the server-side.
        const url = 'https://api.fivemanage.com/api/v3/file/presigned-url/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...';
             
        const formData = new FormData();
             
        formData.append('file', fs.createReadStream('image.png'));
        // Optional metadata field (JSON string)
        formData.append("metadata", JSON.stringify({
        	name: 'My image',
        	description: 'This is my image',
        }));
             
        axios.post(url, formData).then(res => {
        	console.log(res.data.url);
        }).catch(err => {
        	console.error(err);
        });
        ```

        When using Presigned URLs, you mainly uploads file on the client side or from a UI/NUI.
      </Tab>
    </Tabs>
  </Step>
</Steps>
