Get a list of files from the local storage and display it as a list in flutter web: - flutter

I've been building an ios app and in it, it'll download a bunch of pdf from an API and save it to the local storage using the path_provider package in flutter:
This is the code I use to fetch the path:
Future<String> get localPath async {
final directory = await getApplicationDocumentsDirectory();
currentDir.value = directory.path;
return directory.path;}
And this is how I save it to the device:
Future<void> saveFilesToLocal(String url, String fileName) async {
try {
final path = await localPath;
final file = File('$path/$fileName');
if (await file.exists() == false) {
final response = await Dio().get(url,
options: Options(
responseType: ResponseType.bytes,
followRedirects: false,
receiveTimeout: 0));
final raf = file.openSync(mode: FileMode.write);
raf.writeFromSync(response.data);
await raf.close();
} else {
print("file already exists");
}
} catch (e) {
print('error: $e');
}
}
After I download and save the files to the storage, it'll be displayed as a gridview in the home page. To fetch that list of files I use this:
List<FileSystemEntity> files = [];
Future<void> getFilesList() async {
files.clear();
final path = await localPath;
Directory dir = Directory('$path');
files =
dir.listSync(recursive: true, followLinks: false);
update();
}
And all of this works fine in the ios device. But the current issue I'm facing while trying to run it on web is:
The package path_provider is not available for flutter web. I've been asked to create it as a web app too and I can't find an alternative for it. While looking for one I saw a post saying flutter web won't allow access to a device's local storage like that so it's not possible. Is it true? Is there a workaround? If it's about security, the app will only be run on specific devices. It won't be given to the public.

Related

How to upload a folder directly with ftpconnect in flutter

In the ftpconnect package, there is a way to upload files and create directories. I need to be able to upload a raw folder or somehow extract a zip folder to the remote location.
Future<void> _uploadStepByStep(File fileToUpload) async {
try {
await _ftpConnect.connect();
if(await _ftpConnect.checkFolderExistence('ultimate/mods'))
{
await _log('exists');
await _ftpConnect.changeDirectory('ultimate/mods');
await _log(_ftpConnect.currentDirectory().toString());
bool res = await _ftpConnect.uploadFileWithRetry(fileToUpload, pRetryCount: 2);
print(res);
}
await _ftpConnect.disconnect();
} catch (e) {
await _log('Error: ${e.toString()}');
}
}
Is there any way to upload an entire folder or unzip and upload every part of the contents of a zip file?

Accesing downloaded files from a Flutter app

I am working on an app that should manage downloaded files.
For now I am able to download a file on both platforms, but I would need to know how can I get the downloaded files from the device.
This is the code used to download a file from Internet.
Future<void> downloadFile() async {
bool downloading = false;
var progressString = "";
final imgUrl = "https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4";
Dio dio = Dio();
try {
var dir = await getApplicationDocumentsDirectory();
print("path ${dir.path}");
await dio.download(imgUrl, "${dir.path}/demo.mp4",
onReceiveProgress: (rec, total) {
print("Rec: $rec , Total: $total");
downloading = true;
progressString = ((rec / total) * 100).toStringAsFixed(0) + "%";
});
} catch (e) {
print(e);
}
downloading = false;
progressString = "Completed";
print("Download completed");
}
The path print output for Android is:
path /data/user/0/red.faro.labelconciergeflutter/app_flutter
The path print output for iOS is:
path /var/mobile/Containers/Data/Application/9CFDC9E3-D9A9-4594-901E-427D44E48EB9/Documents
What I need is to know how can an app user access the downloaded files when the app is closed or there is no internet connection to open the file from the original URL?
For getting files from the device you may use file_picker package.
FilePickerResult? result = await FilePicker.platform.pickFiles();
if (result != null) {
File file = File(result.files.single.path);
} else {
// User canceled the picker
}
You also can use the File class from the dart:io library.
Future<File> get _localFile async {
final path = await _localPath;
return File('$path/counter.txt');
}
If your goal is to access commonly used locations on the device’s file system you can use the path_provider plugin.
Directory tempDir = await getTemporaryDirectory();
String tempPath = tempDir.path;
Directory appDocDir = await getApplicationDocumentsDirectory();
String appDocPath = appDocDir.path

path directory in flutter using path_provider

In my app I am downloading a files from server. I need to save this files to downloads folder in mobile phone storage. Can this was possible using path_provider package in android ?
This might be a duplicate of this question.
Checkout this answer.
You might want to consider saving the files in your app directory of your app, as described in the official pub.dev docs of path_provider.
You can use Dio for downloading and downloads_path_provider_28 for getting download folder path collectively for this:
Future download(String url) async {
final Dio dio = Dio();
Directory? downloadsDirectory = await DownloadsPathProvider.downloadsDirectory; // "/storage/emulated/0/Download"
final savePath = downloadsDirectory?.path;
try {
Response response = await dio.get(
url,
onReceiveProgress: (received, total) {
if (total != -1) {
print((received / total * 100).toStringAsFixed(0) + "%");
}
},
options: Options(
responseType: ResponseType.bytes,
followRedirects: false,
validateStatus: (status) {
return status < 500;
}
),
);
print(response.headers);
File file = File(savePath);
var raf = file.openSync(mode: FileMode.write);
// response.data is List<int> type
raf.writeFromSync(response.data);
await raf.close();
} catch (e) {
print(e);
}
}

Flutter web - Uploading image to firebase storage

I am using the firebase_storage: ^8.0.6 package on flutter web. I want to upload image to firebase storage that I get using FilePicker package.
The problem is that the new package uses the putFile() method to upload files. But File from dart:io doesn't work on flutter web and it also doesn't accept the File object from dart:html.
I can upload image as Blob using the putBlob() method but then it doesn't upload it as image type but it's type is application/octet-stream. I don't want to upload the image file as a blob.
Future<String> uploadImage(PlatformFile file) async {
try {
TaskSnapshot upload = await FirebaseStorage.instance
.ref(
'events/${file.name}-${DateTime.now().toIso8601String()}.${file.extension}')
.putBlob(Blob(file.bytes));
String url = await upload.ref.getDownloadURL();
return url;
} catch (e) {
print('error in uploading image for : ${e.toString()}');
return ';
}
}
How to fix this issue?
You can use the putData() method to send the image and set it's metadata as a image.
Future<String> uploadImage(PlatformFile file) async {
try {
TaskSnapshot upload = await FirebaseStorage.instance
.ref(
'events/${file.path}-${DateTime.now().toIso8601String()}.${file.extension}')
.putData(
file.bytes,
SettableMetadata(contentType: 'image/${file.extension}'),
);
String url = await upload.ref.getDownloadURL();
return url;
} catch (e) {
print('error in uploading image for : ${e.toString()}');
return '';
}
}
putData() method takes Uint8List by default.
Uploading images using TaskSnapshot is not working on my flutter web project.
I used firebase_storage: ^8.1.3 .
Following code is working for my web project.
String nameImage = DateTime.now().millisecondsSinceEpoch.toString();
Reference _reference = FirebaseStorage.instance
.ref()
.child('images/$nameImage.png}');
await _reference
.putData(
await image.readAsBytes(),
SettableMetadata(contentType: 'image/jpeg'),
)
.whenComplete(() async {
await _reference.getDownloadURL().then((value) {
user.profilePictureURL = value;
FireStoreUtils.firestore
.collection(USERS)
.doc(user.userID)
.update({'profilePictureURL': user.profilePictureURL});
});
});
You can still use .putFile when you use the File.fromUri() constructor and get the Uri from the PlatformFile object using Uri.dataFromBytes and passing the bytes to it.
The code below contains changes that should remove the error:
TaskSnapshot upload = await FirebaseStorage.instance
.ref(
'events/${file.name}-${DateTime.now().toIso8601String()}.${file.extension}')
.putFile(File.fromUri(Uri.dataFromBytes(file.bytes.toList())));

How to get the absolute path of a file in flutter

I am working on a Flutter project to syntehsise an string to an audio file. For this reason, I have added flutter_tts as a dependency and implemented the following method with different approaches in order to check the existence of the generated file:
/// Synthesises the current audio cue into an audio file
static Future<void> synthesiseStringToAudioFile() async {
Future<String> finalPath;
Future<File> finalFile;
Uri uriToFile;
String absolutePath;
bool existsPath;
bool existsManually;
bool exists3;
await flutterTts
.synthesizeToFile("This is my first audio synthesizer in Flutter",
audioFileName)
.then((value) => {
// File has been successfully created
if (value == 1)
{
// Gets the path to the generated audio file
finalPath = pathToFile,
finalPath.then((path) async => {
print('AFile :Path to audio file: $path'),
// Check if exists
existsPath = FileSystemEntity.typeSync(path) != FileSystemEntityType.notFound,
print("AFile : Exists? $existsPath"),
existsManually = await File('/storage/emulated/0/Android/data/mypath/files/temp_audio_cue.wav').exists(), // Requieres async function
print("AFile : Exists2? $existsManually"), // RETURNS TRUE
exists3 = await File(path).exists(),
print("AFile : Exists3? $exists3")
}),
// Gets the generated file
finalFile = localFile,
finalFile.then((file) => {
// Absolute path
absolutePath = file.absolute.path,
print('AFile : AbsolutePath: $absolutePath'),
// Check the URI
uriToFile = file.uri,
print('AFile : URI to audio file: $uriToFile'),
}),
}
else
{print('There was an error during the synthezisation')}
});
}
static void setAudioFileName() {
audioFileName = Platform.isAndroid ? "temp_audio_cue.wav" : "temp_audio_cue.caf";
}
/// Gets the path to the file to be accessed
static Future<String> get pathToFile async {
final path = await localPath;
return '$path/$audioFileName';
}
/// Gets the path to the local directory
static Future<String> get localPath async {
final dir = await getApplicationDocumentsDirectory();
return dir.path;
}
Once the synthesisation is completed, flutterTts.synthesizeToFile() logs in console the following message:
D/TTS (10335): Successfully created file :
/storage/emulated/0/Android/data/mypath/files/temp_audio_cue.wav
so if I check the existence of the file manually (as I do with existManually) will get a true value, but I am not able to do it trying to get dynamically the path as in the other examples I am trying but the ones I am getting are:
/data/user/0/mypath/app_flutter/temp_audio_cue.wav
so it is missing the beginning
/storage/emulated/0/Android/
I was wondering what is the correct way to get the path to the file (missing)?
With path_provider in Android save in getExternalStorageDirectory and in iOS save in getApplicationDocumentsDirectory..
If you want to get this path : /storage/emulated/0
Use path_provider_ex package, which provides root and app files directory for both "external storage" (internal flash) and SD card (if present), as well as available space for each storage.
you can use path_provider package of flutter
Directory appDocDir = await getApplicationDocumentsDirectory();
String appDocPath = appDocDir.path;
https://pub.dev/packages/path_provider
I am using filesystem_picker to return absolute paths from storage and then using File('path_string') or Directory('path_string') to get the actual file.
Using manageExternalStorage permissions allows this work, but keep in mind:
"The Google Play store has a policy that limits usage of MANAGE_EXTERNAL_STORAGE".
This also may not work depending on the SDK you are using and/or conflicts from other packages.
import 'package:filesystem_picker/filesystem_picker.dart';
import 'package:permission_handler/permission_handler.dart';
Directory? rootDir;
late String tempDir;
_getFile(){
await _pickFile();
String path = tempDir;
var file = File(path);
// Do stuff with file
}
// Call this before _pickFile(), ideally inside initState()
Future<void> _prepareStorage() async {
rootDir = Directory('/storage/emulated/0/');
var storageExternal = await Permission.manageExternalStorage.status;
if (storageExternal != PermissionStatus.granted) {
await Permission.manageExternalStorage.request();
}
bool b = storageExternal == PermissionStatus.granted;
//mPrint("STORAGE ACCESS IS : $b");
}
Future<void> _pickFile(BuildContext context) async {
await FilesystemPicker.open(
title: 'Select file',
context: context,
rootDirectory: rootDir!,
fsType: FilesystemType.file,
pickText: 'Select file to add',
folderIconColor: Colors.teal,
requestPermission: () async => await Permission.manageExternalStorage.request().isGranted,
).then((value){
if (value != null){
tempDir = value.toString();
}
else{
tempDir = "";
}
//mPrint(tempDir);
});
}
Add the following to AndroidManifest.xml:
<uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE" android:minSdkVersion="30" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<application
android:label="test_flutter"
android:name="${applicationName}"
android:icon="#mipmap/ic_launcher"
android:requestLegacyExternalStorage="true"
>
I tried and it worked
import 'package:path_provider/path_provider.dart';
Future<File> getImageFileFromAssets(Asset asset) async {
final byteData = await asset.getByteData();
final tempFile =
File("${(await getTemporaryDirectory()).path}/${asset.name}");
final file = await tempFile.writeAsBytes(
byteData.buffer
.asUint8List(byteData.offsetInBytes, byteData.lengthInBytes),
);
return file;
}