I'm using Next.js v13 hosted on Vercel, and I want to allow users to upload videos directly from frontend to the Vimeo servers. I understand how I can upload videos to THEIR accounts, but I need to upload them to MY account. The problem is that I can't just expose my personal access token to the client. (I'd rather not do that even if it only has an upload scope)
Right now, the only option I see is to upload the video to a temporary storage solution (like AWS S3), and then upload to Vimeo from there.
I've tried to upload a video as a formData to my backend and from there upload to Vimeo and that works, but only for small videos because there is a limit to how much a serverless function can take.
To implement direct video upload to a centralized account on Vimeo servers from frontend of your application you can use the resumable upload method described here: https://developer.vimeo.com/api/upload/videos#resumable-approach
The approach is:
upload.upload_link
field you get from the VimeoAPI response back to frontend as a response of your API endpoint.From here you can do whatever you want, roll your own tus upload implementation (similar to what link above describes), or use a library tus implementation, I recommend tus-js-client, which is what I used to solve this problem. They have built-in support for "Vimeo-flavored" tus upload that I find very nice.