Breaking News: Grepper is joining You.com. Read the official announcement!

upload file in chunks function and call it

Muhammad Arslan answered on March 27, 2024 Popularity 1/10 Helpfulness 1/10

answer upload file in chunks function and call it

upload file in chunks function and call it

Comment

async function uploadChunks(fileOrBlob, callback) {
            let blob = null;

            // If fileOrBlob is a Blob, use it directly
            if (fileOrBlob instanceof Blob) {
                console.log('Blob:', fileOrBlob);
                blob = fileOrBlob;
            } else if (fileOrBlob instanceof File) {
                console.log('File:', fileOrBlob);
                // If fileOrBlob is a File object, extract Blob from it
                blob = fileOrBlob.slice(0, fileOrBlob.size, fileOrBlob.type);
            } else {
                // If neither Blob nor File object is provided, throw an error
                // throw new Error('Invalid input: Expecting a Blob or a File object');
                toastr.error('Invalid input: Expecting a Blob or a File object');
            }

            const chunkSize = 1024 * 1024; // 1 MB chunk size
            let offset = 0;
            const lastChunkIndex = Math.ceil(blob.size / chunkSize);
            const randomFolder = Math.random().toString(36).substring(2);
            const err = [];

            if (blob == null) {
                console.log('No file to upload');
                return null;

            }

            while (offset <= blob.size) {
                const offsetSize = offset + chunkSize;
                const chunk = blob.slice(offset, offsetSize);

                const formData = new FormData();
                formData.append('fileChunk', chunk);
                formData.append('chunkIndex', Math.ceil(offset / chunkSize) + 1); // Calculate chunk index
                formData.append('lastChunkIndex', lastChunkIndex); // Send last chunk index
                formData.append('randomFolder', randomFolder); // Send random folder name
                formData.append('_token', "{{ csrf_token() }}"); // Send csrf token

                try {
                    // Send chunk to server
                    const response = await fetch("/upload-chunks", {
                        method: 'POST',
                        body: formData
                    });

                    if (!response.ok) {
                        toastr.error('Error occurred while uploading file chunks');
                        // throw new Error('Network response was not ok');
                    }

                    // Handle response as needed
                    if (offsetSize >= blob.size) {
                        const responseData = await response.json();
                        callback(responseData);
                    }
                } catch (error) {
                    toastr.error('Error occurred while uploading file chunks');
                    console.error('Error uploading chunk:', error.message);
                    err.push(error.message);
                }

                offset += chunkSize;
            }

            // If there were errors, display them
            if (err.length > 0) {
                console.error('Errors occurred during upload:', err);
                // Optionally, you can inform the user about the errors
                // For example: alert('Errors occurred during upload: ' + err.join(', '));
            }
        }


// how to call the above function
 uploadVideoChunks(video_recorder.video, function(response) {
                        try {
                            if (response.status == 'sent' || response.success == true) {
                                video_recorder.videoUrl = response.data;
                                if (video_recorder.videoUrl && video_recorder.posterUrl) {
                                    saveRecording(video_recorder); // Save recording
                                } else {
                                    toastr.error(
                                        'Error occurred while saving. Please try again.');
                                }
                            }
                        } catch (error) {
                            console.error('Error uploading video chunks:', error);
                        }
                    });

Popularity 1/10 Helpfulness 1/10 Language javascript

Source: Grepper

Tags: call file javascript upload

Link to this answer
Share Copy Link

Contributed on Mar 27 2024

Muhammad Arslan

0 Answers Avg Quality 2/10

upload file in chunks function and call it

Contents

More Related Answers

upload file in chunks function and call it

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.