Error uploading large file to CloudFlare using Tus Protocol

Hello there,

I have an app built in react which allows my clients to upload video files to Cloudflare Stream. I’m using tus-js-client for the upload, video file size varies from 300Mb up to 1gig.

We have started experiencing errors for .mp4 video file format,

This error persists even after tus resumes the upload a couple of times, interestingly this is not happening for .avi format (but that is not ideal format).

The code which is handling this:

  const onUpload = async () => {
    const UPLOAD_ENDPOINT = ''
    const UPLOAD_TOKEN = 'token'
    const AUTH_EMAIL = 'email'
    const file = videoFile.videoFile;
    const upload = new tus.Upload(file, {
      endpoint: UPLOAD_ENDPOINT,
      retryDelays: [0, 3000, 5000, 10000, 20000],
      headers: {
        // Authorization: `Bearer ${UPLOAD_TOKEN}`,
        'X-Auth-Email': `${AUTH_EMAIL}`,
        'X-Auth-Key': `${UPLOAD_TOKEN}`,
      metadata: {
        filetype: file.type,
        defaulttimestamppct: 0.5,
      onError(error) {
        console.log(`Failed because: ${error}`)
      onProgress(bytesUploaded, bytesTotal) {
        // eslint-disable-next-line no-mixed-operators
        const percentage = (bytesUploaded / bytesTotal * 100).toFixed(2)
      onSuccess() {
        try {
          if (upload.url) {
            const data = new FormData()
            data.append('thumbnail', video.thumbnail ? video.thumbnail : '')
            data.append('title', video.title)
            data.append('description', video.description)
            data.append('body', video.body)
            data.append('category', video.category)
            data.append('video_id', upload.url)
            data.append('podcast_url', video.podcastUrl ? video.podcastUrl : '')
            data.append('additionalPdfContentLink', video.additionalPdfContentLink ? video.additionalPdfContentLink : '')
            fetch(videoCreateEndpoint, {
              method: 'POST',
              header: { 'content-type': 'multiplart/form-data' },
              body: data,
              .then((response) => response.json)
              .then((data) => {
                setTimeout(() => {
                }, 10000);
        } catch (error) {
          // setOnCreateError(true)
          // setOnCreateMessage('Unable to Create Video')
          console.log('Error from', error)
          console.log('Download %s from %s',, upload.url)
    upload.findPreviousUploads().then((previousUploads) => {
      if (previousUploads.length) {


Code is from your github page on simple file upload, with a little twist for my use case.

Did anyone experience a similar issue once using the JS library before?

Hello Petar,

I cannot explain this behavior with tus-js-client’s point of view, especially since it is only happening for MP4 files and not AVI. Did you also try it with other files (in the same and other formats)? Do they upload fine?

I would also recommend you to contact CloudFlare’s support. It’s possible that their service encountered an error while processing your MP4, which results in the upload connection being aborted. That’s just a theory of mine, but CloudFlare could help shine some light on the situation.

1 Like

Hey @marius, sorry for the late response but I have fixed the issue. The error you see is happening if I directly upload a video to the url that I got once I created a Cloudflare account. Going over the docs once again I have found a [THIS] (, and to be honest this was ignored in the beginning.
After successfully creating a similar worker and changing endpoint to uploadUrl everything is back to normal, and upload is working again.

Hello Petar, glad to read that you found the solution and shared it with the rest of the community!