How to save & share files in your Flutter Chat Application

We often need to save files in our applications, synchronize them across several devices, and share them with friends or groups of people. There are several ways to complete these actions, but it’s always good to find the most efficient.

If you are building a mobile Android/IOS application chat app with the QuickBlox Flutter SDK, we’ve made it easy for you to create a flawless user experience. Our Flutter chat SDK allows your app users to find, download, and save shared files in a chat with maximum ease. In fact, all your app user needs to do is select which file they wish to save and share, then the QuickBlox SDK and server does the rest of the work.

Before you read the helpful guide below, please first read our article How to get Started with QuickBlox Flutter SDK

File Sharing with QuickBlox Flutter SDK

In the schema below we have illustrated the mechanisms for uploading and sharing files.

Get file URL (steps: 1 and 2)

To choose a file from your physical device, use the library file picker
The code is very simple, as the code snippet below shows:

Future chooseFile() async {
   FilePickerResult? result = await FilePicker.platform.pickFiles();
   _fileUrl = result?.files.single.path;
}

_fileUrl – is your global variable where your can save your chosen file URL which you need for the next step

Upload the file URL to QuickBlox SDK (steps: 3-6)

Future upload() async {
   try {
     QBFile? file = await QB.content.upload(_fileUrl!, public: true);
     _fileId = file!.id;
   } on PlatformException catch (e) {
     //Oh, no... some error happened
   }
}

_fileUid – is a unique identifier for your file to access it from any device. You need to use this to retrieve the public url in the next step.

Important Parameter: public: true – this means that the file will have public access so that anybody can see your file. If you don’t set it to the public, the default value will be false, which means that only you will have access to the file.

Sharing file (step 7)

Now you need to get a public url so that you or anyone else can access a file from any device. You need to get the full url for a file that you can send and share with anybody.

Future getPublicURL() async {
   try {
     String? url = await QB.content.getPublicURL(_fileUid!);
   } on PlatformException catch (e) {
     //Oh, no... some error happened
   }
}

Pass the _fileUid parameter from the step before and get the url that you can send and share with anybody.

The url can look like: https://api.quickblox.com/blobs/23d892540e9d4f26aca54ea808b012ee00

Copy the completed URL and share it with your friends in your chat. The link can be used to download or just see the online file. If it’s an image, then you can see it online in any browser.

Conclusion

Now you know how to upload and share files with QuickBlox on any Flutter application. It really is that simple and easy to implement! With QuickBlox you can create powerful chat applications for Android and iOS with huge data and great support. Sign-up for a free account today and get coding!

Have Questions? Need Support?

Join the QuickBlox Developer Discord Community, where you can share ideas, learn about our software, & get support.

Join QuickBlox Discord