Upload and Retrieve the Temporary File - React
This guide demonstrates how to upload and retrieve files from VideoSDK's temporary file storage system.
uploadBase64File()
By using the
uploadBase64File()
function of theuseFile
hook, you can upload your file to Videosdk's Temporary storage.The
uploadBase64File()
function only works withbase64
. Therefore, it is necessary to convert your file intobase64
format.You have to pass
base64Data
,token
,fileName
as parameter inuploadBase64File()
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
const url = await uploadBase64File({ base64Data, token, fileName });
console.log("fileUrl", url);
}
fetchBase64File()
By using the
fetchBase64File()
function of theuseFile
hook, you can retrieve your file from Videosdk's Temporary storage.You have to pass the
fileUrl
which is returned byuploadBase64File()
function, and thetoken
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>";
const base64 = await fetchBase64File({ url, token });
console.log("base64", base64);
}
The file stored in the system will be automatically deleted once the current room/meeting comes to an end.
Got a Question? Ask us on discord