Back
Seeding storage/table issue
Hello, I have encountered some issue with uploading an image to the bucket.
Usually, image upload is done from local point, however on some tutorial that was done recently, image url does point to the remote url, instead of local path to the image, and it does work there.
TypeScript
async function uploadImageToStorage(imageUrl: string) {
try {
const response = await fetch(imageUrl);
const blob = await response.blob();
const fileObj = {
name: imageUrl.split("/").pop() || `file-${Date.now()}.jpg`,
type: blob.type,
size: blob.size,
uri: imageUrl,
};
const file = await storage.createFile({
bucketId: appwriteConfig.bucketId,
fileId: ID.unique(),
file: fileObj,
});
return storage.getFileViewURL(appwriteConfig.bucketId, file.$id);
} catch (error) {
console.log("Returned an error:", error);
}
}
Here is sample data (sorry if included image url). So it does not pass the point to create a file, as uri is remote.
TypeScript
{
name: "Classic Cheeseburger",
description: "Beef patty, cheese, lettuce, tomato",
image_url:
"https://static.vecteezy.com/system/resources/previews/044/844/600/large_2x/homemade-fresh-tasty-burger-with-meat-and-cheese-classic-cheese-burger-and-vegetable-ai-generated-free-png.png",
price: 25.99,
rating: 4.5,
calories: 550,
protein: 25,
category_name: "Burgers",
customizations: ["Extra Cheese", "Coke", "Fries", "Onions", "Bacon"],
},
TypeScript
for (const item of data.menu) {
const uploadedImage = await uploadImageToStorage(item.image_url);
Is there any flag/permission that I can add to obj that allows pull from remote url, so I don't need to use local images?
TL;DR
Developers are having an issue with uploading images to a storage bucket when the URI is remote instead of local. The code provided shows an async function that fetches an image from a URL and attempts to create a file in the storage but fails. They are looking for a flag/permission to pull from a remote URL without using local images.
Solution: The issue arises because the function is trying to create a file using a remote URI. Instead, developers should directly upload the file from the remote URL without creating a local copy. Use the remote URL directly when creating the storage file rather than downloading and re-uploading the image.