blockBlobClient.uploadFile getting a [TypeError: Cannot read property 'size' of undefined]
Kaia Hansen
0
Reputation points
I have a project that uses react native with expo. I have a screen in my app that works like a camera, allowing the user to take pictures and save them. Right now, Pictures are successfully saving to the users camera roll. I also want the pictures to be saved to my Azure Blob Storage. my TakePicture method:
const TakePicture = async () => {
const photo = await camera.takePictureAsync();
setPreviewVisible(true);
setCapturedImage(photo);
SavePhoto(photo.uri);
};
My uploadToAzureBlobStorage and SavePhoto:
const uploadToAzureBlobStorage = async (localUri, filename) => {
const credentials = new StorageSharedKeyCredential(accountName, accountKey);
const blobServiceClient = new BlobServiceClient(
`https://${accountName}.blob.core.windows.net`,
credentials
);
const containerClient = blobServiceClient.getContainerClient(containerName);
const blockBlobClient = containerClient.getBlockBlobClient(filename);
try {
// Fetch file size using expo-file-system
const fileInfo = await FileSystem.getInfoAsync(localUri);
const fileSize = fileInfo.size;
if (!fileSize) {
console.error("Unable to determine file size.");
return false;
}
const options = {
blockSize: 4,
concurrency: 20,
onProgress: (ev) => console.log(ev),
};
// Upload file to Azure Blob Storage
await blockBlobClient.uploadFile(localUri, options);
console.log(`File uploaded successfully. Size: ${fileSize} bytes`);
return true;
} catch (error) {
console.error("Error uploading file to Azure Blob Storage:", error);
return false;
}
};
const SavePhoto = async () => {
if (!capturedImage || !capturedImage.uri) {
return;
}
const { uri } = capturedImage;
const filename = uri.split("/").pop(); // Extract filename from the URI
const localuri = `${FileSystem.documentDirectory}${filename}`;
try {
await FileSystem.moveAsync({
from: uri,
to: localuri,
});
// Upload to Azure Blob Storage
await uploadToAzureBlobStorage(localuri, filename);
const asset = await MediaLibrary.createAssetAsync(localuri);
const album = await MediaLibrary.createAlbumAsync("DownLoads", asset);
console.log("Photo saved successfully!");
} catch (error) {
console.error("Error saving photo:", error);
}
};
I'm getting an error with blockBlobClient.uploadFile(localUri, options). The error logs as: ERROR Error uploading file to Azure Blob Storage: [TypeError: Cannot read property 'size' of undefined] Thanks for the help.
Azure Blob Storage
Azure Blob Storage
An Azure service that stores unstructured data in the cloud as blobs.
3,199 questions
Sign in to answer