React native and Expo - Multiplataform
luizcarlospedrosogomes opened this issue · comments
EDIT: The "React Native" section of the "iOS and Android Apps" demo include complete verified examples for React Native + Expo as well as with other third-party document pickers and file processing libraries.
` const pickDocument = async (e) => {
try {
let result = await DocumentPicker.getDocumentAsync({copyToCacheDirectory: false, type: ['application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']});
console.log(result)
let content = result.uri.split(',')[1];
console.log("content",content)
console.log("uri", result.uri)
//const fileXLS = await FileSystem.readFile(result.uri)
//const workbook = await XLSX.read(content, {type: 'base64'}) WEB
//const fileXLS = await XLSX.readFile(result.uri, {})
const workbook = await XLSX.read(result.uri)
console.log("workbook",workbook)
const sheetName = workbook.SheetNames[0];
const worksheet = workbook.Sheets[sheetName];
console.log(worksheet)
const json = XLSX.utils.sheet_to_json(worksheet, {header: 'A1'});
console.log(json)
//setItemsInventario({data: json, count: json.length, name: result.name});
} catch (error) {
console.error(error)
}
};`
not read file
You need to get the data from the URI using FileSystem.readAsStringAsync
Starting from console.log("uri", result.uri):
const uri = result.uri;
const b64 = await FileSystem.readAsStringAsync(uri, { encoding: FileSystem.EncodingType.Base64 });
const workbook = XLSX.read(b64, {type: "base64"});Note that XLSX.read is synchronous and no await is needed for that step.
We'll add an example of React Native + Expo to the docs
At this point, the bug is entirely with Expo. Raised an issue, please continue the discussion with expo/expo#18534 OR consider dropping Expo and using the raw React Native libraries. As described in the documentation the library has been tested with react-native-file-access and react-native-fs
` const pickDocument = async (e) => {
try {
let result = await DocumentPicker.getDocumentAsync({copyToCacheDirectory: false, type: ['application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']});
let content = result.uri.split(',')[1];
let workbook = null;
if (content){
workbook = await XLSX.read(content, {type: 'base64'});
}else{
const uri = FileSystem.documentDirectory+result.name;
await FileSystem.copyAsync({
from: result.uri,
to: uri
})
const b64 = await FileSystem.readAsStringAsync(uri, { encoding: FileSystem.EncodingType.Base64 });
workbook = XLSX.read(b64, {type: "base64"});
}
const sheetName = workbook.SheetNames[0];
const worksheet = workbook.Sheets[sheetName];
const json = XLSX.utils.sheet_to_json(worksheet, {header: 'A1'});
setItemsInventario({data: json, count: json.length, name: result.name});
} catch (error) {
console.error(error)
}
};`
this code working. thanks
@luizcarlospedrosogomes - if you just set copyToCacheDirectory: true then you don't need to write any of the code for copying to the document directory
notice in the docs for expo-document-picker:
