I just started learning expo by it’s get started tutorial and got stuck at handling platform differences. I am trying to use 'anonymous-files'
by calling uploadToAnonymousFilesAsync
as in docs
let remoteUri = await uploadToAnonymousFilesAsync(pickerResult.uri);
but keep getting 522 error
.
Unhandled Rejection (TypeError): Failed to fetch
I assume that the problem is in my side, but even if I copy the code from there repo I still get this error. Any ideas what can be the reason ? Here is the hole code
import React from 'react';
import { Image, Platform, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import * as ImagePicker from 'expo-image-picker';
import * as Sharing from 'expo-sharing';
import uploadToAnonymousFilesAsync from 'anonymous-files';
export default function App() {
let [selectedImage, setSelectedImage] = React.useState(null);
let openImagePickerAsync = async () => {
let permissionResult = await ImagePicker.requestMediaLibraryPermissionsAsync();
if (permissionResult.granted === false) {
alert('Permission to access camera roll is required!');
return;
}
let pickerResult = await ImagePicker.launchImageLibraryAsync();
if (pickerResult.cancelled === true) {
return;
}
if (Platform.OS === 'web') {
let remoteUri = await uploadToAnonymousFilesAsync(pickerResult.uri);
}
setSelectedImage({ localUri: pickerResult.uri, remoteUri });
} else {
setSelectedImage({ localUri: pickerResult.uri, remoteUri: null });
}
};
let openShareDialogAsync = async () => {
if (!(await Sharing.isAvailableAsync())) {
alert(`The image is available for sharing at: ${selectedImage.remoteUri}`);
return;
}
Sharing.shareAsync(selectedImage.remoteUri || selectedImage.localUri);
};
if (selectedImage !== null) {
return (
<View style={styles.container}>
<Image source={{ uri: selectedImage.localUri }} style={styles.thumbnail} />
<TouchableOpacity onPress={openShareDialogAsync} style={styles.button}>
<Text style={styles.buttonText}>Share this photo</Text>
</TouchableOpacity>
</View>
);
}
return (
<View style={styles.container}>
<Image source={{ uri: 'https://i.imgur.com/TkIrScD.png' }} style={styles.logo} />
<Text style={styles.instructions}>
To share a photo from your phone with a friend, just press the button below!
</Text>
<TouchableOpacity onPress={openImagePickerAsync} style={styles.button}>
<Text style={styles.buttonText}>Pick a photo</Text>
</TouchableOpacity>
</View>
);
}
const styles = StyleSheet.create({...});
It seems to me that it’s cors error, should I create server to serve this app and change cors settings for using 'anonymous-files'
library ?