Guides
Login
Start typing to search…

Upload videos directly

FastPix Direct Uploads provide a streamlined solution for uploading media (video and audio) directly to your platform from client applications. This guide will simplify the process and highlight how users can effectively utilize authenticated upload URLs for seamless content delivery.


Why to use FastPix direct uploads

FastPix Direct Uploads can be used in multiple scenarios:

  • Mobile app uploads: Users can upload videos directly from their mobile devices, enhancing user-generated content (UGC) capabilities.
  • Web app uploads: Web applications can facilitate direct uploads, allowing users to share content easily.
  • Server-side content uploads: Large platforms can upload media files in batches from their servers, streamlining content management.
  • Command-line tool uploads: Developers can leverage command-line tools for quick and efficient uploads, perfect for automated workflows.

GETTING STARTED

If you are exploring FastPix as a first time user, we suggest to also see our Getting started in 5 minutes guide to understand the workflow from making API requests to getting your video playbacks.


How to make a direct upload to FastPix


FastPix supports both:

  • Direct uploads using signed URLs.
  • Uploads via the FastPix Web, iOS and Android - Resumable Uploads SDK.

Step-by-step guide: Uploading directly to FastPix


Step 1: Get your signed upload URL

Make a POST request to:

https://api.fastpix.io/v1/on-demand/upload

Use your Access Token credentials (Token ID and Secret) for Basic Auth. The response will contain a signedUrl. Go to the FastPix documentation to create a new Upload Media From Device with your desired asset settings


Web (Browser uploads):

  • You must include the header: X-Client-Type: web-browser.
  • This is required to fetch a signed URL that supports uploads initiated from the browser.

Android & iOS uploads:

  • Do not include the X-Client-Type header.
  • The fetched signedUrl can be used.

 <script>
        const url = 'https://api.fastpix.io/v1/on-demand/upload';

        // Replace with your actual FastPix Access Token credentials

        const username = ''; // Token ID
        const password = ''; // Token Secret

        // Define your upload request settings
        const data = {
            corsOrigin: '*',
            pushMediaSettings: {
                accessPolicy: 'public',
                metadata: {
                    key1: 'value1',
                },
                generateSubtitles: false,
                normalizeAudio: true,
                maxResolution: '1080p',
            },
        };

        // Set up request options with required headers

        const options = {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                Authorization: 'Basic ' + btoa(username + ':' + password),
                'X-Client-Type': 'web-browser', // Required for browser uploads
            },
            body: JSON.stringify(data),
        };

        // Fetch the signed URL
        fetch(url, options)
            .then(response => {
                if (!response.ok) {
                    throw new Error(`Failed to fetch signed URL: ${response.statusText}`);
                }
                return response.json();
            })
            .then(data => {
                const signedUrl = data.signedUrl;
                console.log('Signed URL for upload:', signedUrl);

                // Use the signedUrl in Step 2 (manual upload or SDK)
            })
            .catch(error => {
                console.error('Error fetching signed URL:', error);
            });
 </script>

NOTE

The signedUrl can also be passed directly to the FastPix Resumable Uploads SDK (Web,Android or iOS). The SDK will automatically Initiate the upload session, Handle chunked uploading and Resume on interruptions.

Along with the URL, you will receive a unique ID for this direct upload. Make sure to save this ID for tracking the upload progress later through the API


Step: 2 Begin the upload session (Web Only)

Once you have the signedUrl, you must initiate a resumable upload session if you're manually uploading in the browser (i.e., not using the SDK).


Direct resumable upload

  1. Send a POST request to the signedUrl with header: x-goog-resumable: start
  2. The response will contain a Location header and a resumable upload URL.
  3. Upload the file in a PUT request to that URL.

<script>
    /* 
    * FastPix Client-Side Upload Process 
    * 
    * Step 1: Fetch a signed upload URL using your credentials. 
    * Step 2: Use the URL for direct media upload or pass it to the SDK. 
    */

    const url = 'https://api.fastpix.io/v1/on-demand/upload';

    // Replace with your actual FastPix Token credentials 
    const username = ''; // Token ID 
    const password = ''; // Token Secret 

    // Define media upload settings 
    const data = {
        corsOrigin: '*',
        pushMediaSettings: {
            accessPolicy: 'public',
            metadata: {
                key1: 'value1',
            },
            generateSubtitles: false,
            normalizeAudio: true,
            maxResolution: '1080p',
        },
    };

    const options = {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            Authorization: 'Basic ' + btoa(username + ':' + password),
            'X-Client-Type': 'web-browser',
        },
        body: JSON.stringify(data),
    };

    // Step 1: Fetch signed URL 
    fetch(url, options)
        .then(response => {
            if (!response.ok) {
                throw new Error(`Failed to fetch signed URL: ${response.statusText}`);
            }
            return response.json();
        })
        .then(data => {
            const signedUrl = data.signedUrl;

            console.log('Signed URL for upload:', signedUrl);

            // Step 2A: Manual upload (optional example) 
            /* 
            fetch(signedUrl, { 
            method: 'POST', 
            headers: { 
            'x-goog-resumable': 'start' 
            } 
            }) 
            .then(res => { 
            const resumableUploadUrl = res.headers.get('Location'); 
            console.log('Resumable Upload URL:', resumableUploadUrl); 
            // Use PUT with this URL to upload media 
            }); 
            */

            // Step 2B: SDK upload 
            // Pass the `signedUrl` to FastPix Web Resumable Uploads SDK 
        })
        .catch(error => {
            console.error('Error fetching signed URL:', error);
        });
</script>

Step 3: Initiate the upload:

Once you have the upload URL, you’re ready to upload the file using a PUT request.


For SDK users:

Skip this step, our SDK will handles it.


For manual uploads:

  • Use the upload URL.
  • Send the media file in the body of a PUT request.

<script> 
    fetch(resumableUploadUrl, { 
    method: 'PUT', 
    headers: { 
    'Content-Type': mediaFile.type || 'application/octet-stream', 
    }, 
    body: mediaFile, 
    }); 
</script>

Step 4 : Track your upload:

Check your FastPix dashboard to confirm successful uploads. You'll see new assets listed with the settings you specified during setup, along with the uploaded video.


curl --request POST \
     --url https://api.fastpix.io/v1/on-demand/upload \
     --header 'accept: application/json' \
     --header 'content-type: application/json' \
     --data '
{
  "corsOrigin": "*",
  "pushMediaSettings": {
    "accessPolicy": "public"
  }
}
'

Resumable uploading of large files

Resumable uploading is a technique that allows large files to be uploaded in smaller, manageable chunks rather than as a single request. This approach ensures that if an upload is interrupted due to network issues, server timeouts, or other disruptions, it can resume from where it left off rather than restarting the entire process.

By breaking files into chunks, resumable uploads improve reliability, reduce the risk of data loss, and optimize bandwidth usage. This method is particularly beneficial for handling large media files, ensuring smoother user experiences, and enabling efficient uploads even in unstable network conditions. Additionally, resumable uploading supports error handling, retry mechanisms, and progress tracking, making it an essential feature for modern file transfer systems.



Uploading large media files

FastPix resumable uploads SDK allows large files to be uploaded in smaller, manageable chunks rather than as a single request. This approach ensures that if an upload is interrupted due to network issues, server timeouts, or other disruptions, it can resume from where it left off rather than restarting the entire process.By breaking files into chunks, resumable uploads improve reliability, reduce the risk of data loss, and optimize bandwidth usage. This method is particularly beneficial for handling large media files, ensuring smoother user experiences, and enabling efficient uploads even in unstable network conditions.

Additionally, resumable uploading supports error handling, retry mechanisms, and progress tracking, making it an essential feature for modern file transfer systems.

Updated 14 days ago