Hi,
I’m using Ionic4 for a PWA that is used as backoffice of a system.
I’d like to open a file chooser to open and read a file on the pc of the user.
I know I can’t use Cordova plugins for this purpose, so I think I have to use the File System Access API, is it right?
But if I use this code:
const fileHandler = await window.showOpenFilePicker();
const file = await fileHandler.getFile();
const fileContent = await file.text();
the method “showOpenFilePicker” doesn’t exist on the window object.
How can I open a file and read its content?
Thank you very much
cld
Have u looked at capacitorjs plugins?
The UI for file selection you would have to bring yourself.
Accessing the local filesystem I believe may not be fully supported by all browsers… U would have to google this.
Otherwise, you may want to use input type=file?
Thank you @Tommertom .
I’ve found this way to read the file:
<div id="import_start">
<ion-input type="file" accept=".csv, text/plain" (change)="chooseFile($event)"></ion-input>
</div>
async chooseFile(event) {
this.sourceFile = event.target.files[0];
const reader = new FileReader();
reader.readAsText(this.sourceFile, 'UTF-8');
reader.addEventListener('load', (event) => {
const result = reader.result;
console.log(result);
});
}
However I have to send also the file to the backend so I have found this tutorial that explain how to do the upload:
1 Like