How to Pick files and Images for upload with flutter web

Issue

I would like to know how to pick an Image from the users computer into my flutter web app for upload

Solution

Using dart:html package directly in Flutter is not recommended.

Instead, use this package: https://pub.dev/packages/file_picker.

Example of how to use in Flutter Web:

class FileUploadButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      child: Text('UPLOAD FILE'),
      onPressed: () async {
        var picked = await FilePicker.platform.pickFiles();

        if (picked != null) {
          print(picked.files.first.name);
        }
      },
    );
  }
}

Note that FilePickerResult.path is not supported in Flutter Web.

Answered By – jnt

Answer Checked By – Timothy Miller (FlutterFixes Admin)