Ad

Image Picker Path For Stripe Readfilesync Flutter Web

- 1 answer

I'm using the file_picker package for flutter https://pub.dev/packages/file_picker I have read many times that because you can’t access paths on web browsers, you need to use the bytes property, e.g.

FilePickerResult result = await FilePicker.platform.pickFiles();

if(result != null) {
   var path = print(result.files.single.path); // this will return null
   var bytes = print(result.files.singe.bytes); // this will return a Uint8List of bytes
} else {
   // User canceled the picker
}

But I have to upload the images my users select from their devices via the web (so for all types of devices) to my Stripe Connect API in order for them to have a validated identity_document when they register. The bytes Uint8List will throw an error from firebase, here is my code:

export const uploadIdentityFront = async (uid: any, identityFront: any) => {
    
  const fp = fs.readFileSync(identityFront);
    
  const frontIdentity = await stripe.files.create({
        file: {
            data: fp,
            name: 'identityFront.jpg',
            type: 'application/octet-stream',
        },
        purpose: 'identity_document',
    });

    await updateId(uid, { frontIdentityFileId: frontIdentity.id })
    return frontIdentity;

}

The error thrown:

[firebase_functions/unknown] TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string or an instance of Buffer or URL. Received an instance of Array

I will need to send stripe an image document via the file system's readFileSync property in order to do this, but with Flutter Web not being able to print the path for the image chosen by the user, I am stuck on how to resolve this issue

Ad

Answer

I finally solved it. For anyone trying to upload a file to Stripe via flutter web, don't create a fs.readFileSync in your backend server side code. Instead, remove it and upload a file like this:

export const uploadIdentityFront = async (uid: any, identityFront: any) => {
        
  const frontIdentity = await stripe.files.create({
        file: {
            data: identityFront,
            name: 'identityFront.jpg',
            type: 'image/jpg',
        },
        purpose: 'identity_document',
    });

    await updateId(uid, { frontIdentityFileId: frontIdentity.id })
    return frontIdentity;

}

This way, you can upload the file via the file_picker package and uploading it as a picker.file.first.bytes. But don't wrap it in a string - send it just like this as a callable function in firebase functions:

await uploadFrontPassport.call(
   <dynamic, dynamic>{'identityFront':picked.files.first.bytes}
);
Ad
source: stackoverflow.com
Ad