Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tus upload to vimeo upload link fails #3328

Closed
thealpha93 opened this issue Oct 10, 2020 · 2 comments
Closed

Tus upload to vimeo upload link fails #3328

thealpha93 opened this issue Oct 10, 2020 · 2 comments

Comments

@thealpha93
Copy link

Describe the issue

Video upload to vimeo using the tus upload from reactjs application. I have converted the video file into an Blob and tried to upload to the upload link provided by vimeo.

When I use fetch to upload the video, it seems to be working. But with axios, it's not working. I believe it has something to do with the way blob is passed in the body.

Example Code

Code snippet to illustrate your question

// Axios Code
reader.onload = async () => {
        const videoBlob = new Blob([new Uint8Array(reader.result)], { type: video.type });

        try {
          await uploadToVimeoLink(response.url, videoBlob)
        } catch (error) {
          console.log(error)
        }
      }
  
      reader.readAsArrayBuffer(video)

 const uploadToVimeoLink = async (uploadLink, fileBlob) => {
  try {
    const config = {
      headers: {
        "Tus-Resumable": "1.0.0",
        "Upload-Offset": "0",
        "Content-Type": "application/offset+octet-stream",
        Accept: "application/vnd.vimeo.*+json;version=3.4",
        Authorization: ''
      },
    };

    const response = await axios.patch(uploadLink, fileBlob, config);
    return response;
  } catch (error) {
    console.log(error);
  }
};
// Using fetch
fetch(uploadLink, {
    method: "PATCH",
    headers: {
      "Tus-Resumable": "1.0.0",
      "Upload-Offset": "0",
      "Content-Type": "application/offset+octet-stream",
      Accept: "application/vnd.vimeo.*+json;version=3.4",
    },
    body: fileBlob,
  })
    .then((data) => {
      console.log(data);
    })
    .catch((err) => console.log(err));

Expected behavior, if applicable

I expect to get a 204 reponse from the vimeo server. It's working when I use fetch. But when I use axios it gives status 400.

Environment

  • Axios Version [0.20.0]
  • Adapter [e.g. XHR/HTTP]
  • Browser [Brave, Chromei]
  • Browser Version [Version 1.10.90 Chromium: 83.0.4103.97 (Official Build) (64-bit)]
  • Node.js Version [14]
  • OS: [Ubuntu 20]
  • Additional Library Versions [16.13.1]

Additional context/Screenshots

Add any other context about the problem here. If applicable, add screenshots to help explain.
image

@chinesedfan
Copy link
Collaborator

chinesedfan commented Oct 17, 2020

If v0.19.2 works well, it should be caused by #1773. (cc @jasonsaayman)


Updated: #3289 has reverted that, please try with the master branch codes

@github-actions
Copy link
Contributor

Hello! 👋

This issue is being automatically marked as stale because it has not been updated in a while. Please confirm that the issue is still present and reproducible. If no updates or new comments are received the issue will be closed in a few days.

Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants