Upload and Retrieve the Temporary File - React

This guide demonstrates how to upload and retrieve files from VideoSDK's temporary file storage system.

note

This page uses the following asynchronous methods. Refer to their API reference for the errors each Promise may reject with, and handle these rejections appropriately based on your use case.

• uploadBase64File()
• fetchBase64File()

uploadBase64File()

• By using the uploadBase64File() function of the useFile hook, you can upload your file to Videosdk's Temporary storage.

• The uploadBase64File() function only works with base64. Therefore, it is necessary to convert your file into base64 format.

• You have to pass base64Data,token,fileName as parameter in uploadBase64File() function.

• The function will return the corresponding fileUrl, which you can then use to retrieve the file.

const { uploadBase64File } = useFile();

async function uploadFile() {
  const base64Data = "<Your File's base64>"; // Convert your file to base64 and pass here
  const token = "<VIDEOSDK_TOKEN>";
  const fileName = "myImage.jpeg"; // Provide name with extension here
  let url;
  try {
    url = await uploadBase64File({ base64Data, token, fileName });
  } catch (err) {
    console.error("uploadBase64File failed:", err);
  }
  console.log("fileUrl", url);
}

fetchBase64File()

• By using the fetchBase64File() function of the useFile hook, you can retrieve your file from Videosdk's Temporary storage.

• You have to pass the fileUrl which is returned by uploadBase64File() function, and the token as parameters to retrieve a file.

• This function will return the image in the form of base64.

const { fetchBase64File } = useFile();

async function fetchFile() {
  const url = "<Your FileUrl>"; // Provide fileUrl which is returned by uploadBase64File()
  const token = "<VIDEOSDK_TOKEN>";
  let base64;
  try {
    base64 = await fetchBase64File({ url, token });
  } catch (err) {
    console.error("fetchBase64File failed:", err);
  }
  console.log("base64", base64);
}

note

The file stored in the system will be automatically deleted once the current room/meeting comes to an end.