Back
404 for file view of image in react native expo go, opens up on browser tho
TL;DR
Developers are experiencing a 404 error when trying to view images in a React Native Expo Go app, even though the images can be viewed in the browser. The problem seems to be specific to filepreview images from Appwrite. The file permissions have been deleted for the owner, but the bucket permissions are set to create and read for all users. The developers are seeking advice on how to resolve this issue.
what are permissions on the file and bucket?
file permissions are delete for the owner
bucket permissions are create and read for all users
TypeScript
const bucketId = process.env.EXPO_PUBLIC_BUCKET_ID!;
const renderPost = ({ item }: { item: Post }) => {
const imageUrl = appwrite.getFilePreview(bucketId, item.fileId).toString();
console.log(imageUrl);
return (
<TouchableOpacity
onPress={() => {
router.push({
pathname: '/profileFlatList',
params: { selectedPostId: item.$id },
});
}}
className="w-1/3"
>
<Image
source={{
uri: imageUrl,
headers: { Accept: 'image/*' },
}}
className="h-32"
/>
</TouchableOpacity>
);
};
getFilePreview(bucketId: string, fileId: string): URL {
try {
const previewUrl = this.storage.getFilePreview(bucketId, fileId);
const urlWithParams = new URL(previewUrl.toString());
urlWithParams.searchParams.append('mode', 'admin');
return urlWithParams;
} catch (error) {
console.error('Appwrite service :: getFilePreview() :: ', error);
throw error;
}
}
images not hosted on appwrite are rendering
only the filepreview ones are throwing 404
even with hard-coding the url same issue, appwrite hosted images are giving 404
