can mit app inventor store .3gp files and load it back for firebase storage?

607 views
Skip to first unread message

AuA只是一隻蚊子

unread,
Dec 6, 2019, 2:31:32 AM12/6/19
to mitappinv...@googlegroups.com
I can't run my app right, can someone get a look for me? (also, I'm Chinese, so sorry for my poor use of English )
if firebase infro is needed, please let me know too
block_form.bmp
project_recorder.aia

TimAI2

unread,
Dec 6, 2019, 3:42:59 AM12/6/19
to MIT App Inventor Forum
You can't save sound files (any binary files) to the database, you have to use Storage.
Although you can do it without an extension, it is easier to use the Firebase Storage Extension

See HERE for example blocks

TimAI2

unread,
Dec 6, 2019, 4:26:18 AM12/6/19
to MIT App Inventor Forum
Also, If you wish/prefer, you could encode your sound files to base64 (text string) and save those to firebase database, then decode when called back to the app
Message has been deleted

Evan Patton

unread,
Dec 6, 2019, 2:19:32 PM12/6/19
to MIT App Inventor Forum
CloudDB will store binary files up to 5 MB or so. You have to store the absolute filename (it can't be nested in another data structure) and the path must start with either file:/// or /storage. On the other devices, the file will be stored in a special directory with a random filename which you'll be handed as the value of the corresponding tag.

Regards,
Evan

AuA只是一隻蚊子

unread,
Dec 7, 2019, 2:32:26 AM12/7/19
to MIT App Inventor Forum
sadly, base64 keeps running errors and shut down the app, also can't load the files and listen from the app. and Firebase Storage Extension can't download no matter how hard I tried.

TimAI2

unread,
Dec 7, 2019, 5:08:46 AM12/7/19
to MIT App Inventor Forum
Please show your relevant blocks, so we can see what you are trying to do

Right Click in Blocks Editor and select "Download Blocks as Image"
(use image editor to crop etc. if required)

In the forum, click on the image button to upload your blocks image



TimAI2

unread,
Dec 7, 2019, 6:18:38 AM12/7/19
to MIT App Inventor Forum
These blocks work for me

blocksrecordsavedownloadFB.png

AuA只是一隻蚊子

unread,
Dec 7, 2019, 8:43:11 PM12/7/19
to mitappinv...@googlegroups.com
do I also need to give you firebase image too?



AuA只是一隻蚊子

unread,
Dec 7, 2019, 9:17:40 PM12/7/19
to mitappinv...@googlegroups.com
Also what is ibsoundfilenamed?

blocks.png

TimAI2

unread,
Dec 8, 2019, 5:30:18 AM12/8/19
to MIT App Inventor Forum
A few issues with your blocks:

blocksfbsissues.png


1. You save the file to a node named by the textbox1. You will need this value to retrieve your data (your structure on firebase would be "projectbucket" / textbox1 (node) / project.3gp )

2. You need to enter a tag name here

3. You need to enter a node name here


I suggest you simplify, following my blocks, get that working, then you can develop on from there.


lbSoundFileName is a label, to show the output



You could always play the sound file direct from firebase instead of downloading and saving the file ?
You may need a clock timer to give the Player time to handle the setting of the sound file source before calling Play

AuA只是一隻蚊子

unread,
Dec 8, 2019, 7:44:15 AM12/8/19
to mitappinv...@googlegroups.com
ok, I'll try. and also I'm trying to make an app that can store value(like sound files) to clouds( firebase) and bring it back to play it in app.
Answer2 is that if you don't type anything you can access all the tag in firebase database.
Answer 3 whats a node?


AuA只是一隻蚊子

unread,
Dec 11, 2019, 6:49:26 AM12/11/19
to MIT App Inventor Forum
Question: I'm now using firebasestorage2.0 and keep having this error(invalid HTTP method/URL pair), how can I fix this?
also I have tried to delete gp:// and /.
blocks (1).png

TimAI2

unread,
Dec 11, 2019, 8:41:22 AM12/11/19
to MIT App Inventor Forum
Look at your Firebase upload blocks
The path to the file is the local path on the device e.g. file:///mnt/sdcar/SOUNDS/myrecording.3gp

You have what looks like a firebase storage url of some kind?

AuA只是一隻蚊子

unread,
Dec 11, 2019, 7:20:43 PM12/11/19
to MIT App Inventor Forum
but I don't have sd card on my phone. and that's the question. 

Chris Ward

unread,
Dec 11, 2019, 8:34:09 PM12/11/19
to MIT App Inventor Forum
Hello AuA只是一隻蚊子

Your Smartphone has a "virtual" SD Card, it is a permanent part of the memory reserved for on-phone storage.

Chris Ward

unread,
Dec 11, 2019, 8:36:00 PM12/11/19
to MIT App Inventor Forum
file:///mnt/sdcard/SOUNDS/myrecording.3gp

AuA只是一隻蚊子

unread,
Dec 11, 2019, 8:48:03 PM12/11/19
to mitappinv...@googlegroups.com
I tried it, and here is the consequence
Screenshot_2019-12-12-15-30-31-519_appinventor.ai_thomasseesk123456789.project_recorder[1].png

TimAI2

unread,
Dec 12, 2019, 3:48:38 AM12/12/19
to MIT App Inventor Forum
Check the path that the sounds are saved to, it probably won't be /storage/emulated/0/SOUNDS/

You also need to set the mimetype for the file

Please refer back to the blocks I posted that work. Setup a simple example to get that working, then develop on from there.

AuA只是一隻蚊子

unread,
Dec 12, 2019, 6:54:06 AM12/12/19
to mitappinv...@googlegroups.com
what is : the path may not end with '/' or contain two consecutive '/'s.
alos can you give me an example, my brain got overheat after solving all these goddam questions. QAQ

TimAI2

unread,
Dec 12, 2019, 9:23:59 AM12/12/19
to MIT App Inventor Forum
"what is : the path may not end with '/' or contain two consecutive '/'s."

Do not understand this ?

Here are my blocks with a working example, again.
blocksrecordsavedownloadFB.png

AuA只是一隻蚊子

unread,
Dec 12, 2019, 6:29:42 PM12/12/19
to MIT App Inventor Forum
I know, but still didn't work.

TimAI2

unread,
Dec 12, 2019, 7:51:55 PM12/12/19
to MIT App Inventor Forum
Have you set up a new project with just the blocks in my example?
Are you certain your firebase storage is correctly setup?

"I know, but still didn't work."

This doesn't help, you need to be more specific about what doesn't work....

AuA只是一隻蚊子

unread,
Dec 13, 2019, 4:34:56 AM12/13/19
to mitappinv...@googlegroups.com
Now it just keeps showing [invalid HTTP method/URL pair] and I very sure that every path is right, just don't know where's the problem know, here's the block image.
(also I didn't copy your blocks, just feel very depressed after sucking in the same question for five days.)
blocks.png

AuA只是一隻蚊子

unread,
Dec 14, 2019, 8:20:53 PM12/14/19
to mitappinv...@googlegroups.com
timai2, do you know how to fix error "permission denied", I have seen some examples but still suck at the same point.
blocks (1).png

TimAI2

unread,
Dec 15, 2019, 6:37:15 AM12/15/19
to MIT App Inventor Forum
What "permissions error" ? When and where does it appear? In what context, a built app or in companion ?

AuA只是一隻蚊子

unread,
Dec 15, 2019, 7:41:57 AM12/15/19
to mitappinv...@googlegroups.com
after when I push the save button, it just showed permissions
57017_new.jpg

TimAI2

unread,
Dec 15, 2019, 8:05:35 AM12/15/19
to MIT App Inventor Forum
Despite my repeated efforts, it seems you are still not using the blocks I provided. You need to provide the correct path to the sound file in order to save it to firebase

blockssavetoFB.png


When the sound file is saved by the recorder it returns a file path like this: (if it is saved to the root of your sdcard)


/storage/emulated/0/33423uwfjioe49w39.3gp


you need to convert this to:


file://mnt/sdcard/33423uwfjioe49w39.3gp


That is what my blocks show you.


AuA只是一隻蚊子

unread,
Dec 15, 2019, 6:18:48 PM12/15/19
to MIT App Inventor Forum
I have tried yours, but It will keep running errors like  {invalid HTTP method/URL pair} or {need specific URL}, 
also, my path is the same as your path, just now stuck at the permissions thing.
I now don't know what permission I miss, do I need to throw my firebase here too?

TimAI2

unread,
Dec 15, 2019, 6:54:18 PM12/15/19
to MIT App Inventor Forum
Check your rules, to start off with they can be like this:

rules_version = '2';
service firebase.storage {
  match /b/timai2.appspot.com/o {   << change to your project
    match /{allPaths=**} {
      allow read, write;
    }
  }
}


AuA只是一隻蚊子

unread,
Dec 16, 2019, 4:58:10 AM12/16/19
to MIT App Inventor Forum
IT WORK, THANK YOU SO MUCH.QAAAAAAAAAQ
(Now for the download part)

AuA只是一隻蚊子

unread,
Dec 16, 2019, 8:20:39 AM12/16/19
to MIT App Inventor Forum
Question:
1. can you explain the load functions like web 1 in your example, I have little problems in it.
2. If my save file name is Text box's text, then can I replace mysound.3gp to      .3gp for it to show in list picker?
3. Is web1's filename is equal to my sound files location? cause I tried your way to load and run out error()

blocks (2).png
57071.jpg

TimAI2

unread,
Dec 16, 2019, 8:48:34 AM12/16/19
to MIT App Inventor Forum
Before doing any more work on this there is more work to do!, can we understand your intended workflow? I have drawn up a draft based upon what you have said and done so far. Please amend or advise accordingly:


Workflow:

CREATE and UPLOAD a recording

1. User Records Sound (Start recording / Stop recording)
2. After sound recorded, AI2 sets filepath/filename (as created by the sound recorder) to a variable, and label
3. User provides a name for the recording (Textbox)
4. User uploads recording to Firebase (Upload Recording) - AI2 gets filename and sets the correct path for the upload function
5. (?AI2 deletes original recording ?)
6. (?AI2 adds the user provided filename (Textbox) to a list (of filenames) ?) 
7. (?AI2 adds the list of filenames to a listpicker Elements ?) 

RETRIEVE RECORDING and PLAY IT

1. (?User selects a filename from the listpicker ?)
2. (?AI2 uses web component to fetch the filename and download url from Firebase, then downloads the file to the designated folder ?)
3. (?AI2 then plays the downloaded file ?)

CLEAN UP

1. (?At some point AI2 or user manually deletes any downloaded sound recordings ?)

AuA只是一隻蚊子

unread,
Dec 16, 2019, 8:34:44 PM12/16/19
to mitappinv...@googlegroups.com
Ok, here's my amend and advice:

CREATE and UPLOAD a recording

1.(?AI2 deletes original recording ?)      no, I would like to keep it.
2.(?AI2 adds the user provided filename (Textbox) to a list (of filenames) ?)  yes, cause this is what I'm challenging for.
3. (?AI2 adds the list of filenames to a listpicker Elements ?)  yes, cause this is what I'm challenging for.

RETRIEVE RECORDING and PLAY IT

1. (?User selects a filename from the listpicker ?) yes, cause this is what I'm challenging for.
2. (?AI2 uses web component to fetch the filename and download url from Firebase, then downloads the file to the designated folder ?)
yes, cause this is what I'm challenging for.
3. (?AI2 then plays the downloaded file ?) yes, cause this is what I'm challenging for.

CLEAN UP

1. (?At some point AI2 or user manually deletes any downloaded sound recordings ?) no need, I'll just save it for the record.

TimAI2

unread,
Dec 17, 2019, 6:23:35 AM12/17/19
to MIT App Inventor Forum
OK

Is there really any need to use Firebase Storage at all ?

Why not just use the recordings saved on the device?

AuA只是一隻蚊子

unread,
Dec 17, 2019, 7:15:18 AM12/17/19
to MIT App Inventor Forum
cause my challenge is to use a cloud to save files and also can download to another person's cellphone.

Also, I can't work throw the part [web/response filename/to/(location)] part it keeps running error the operation Elements cannot accept the arguments: (location).

How come?

TimAI2

unread,
Dec 17, 2019, 7:40:41 AM12/17/19
to MIT App Inventor Forum
"use a cloud to save files and also can download to another person's cellphone"

Does this mean your app will need to get a full list of files uploaded to firebase by all devices with app?
(this was not in your workflow....)

TimAI2

unread,
Dec 17, 2019, 10:02:40 AM12/17/19
to mitappinv...@googlegroups.com
Here attached is a recording aia project that doesn't use firebase, but ticks all your other boxes. It includes Taifun's file extension for the file deletion.

Project will be added after posting this.
Recording3gp.aia

AuA只是一隻蚊子

unread,
Dec 18, 2019, 6:03:47 AM12/18/19
to mitappinv...@googlegroups.com
ok,I'll give it a shot(also how to use getfile in firebase storage. does the path need to be exactly the same as the upload one?)

TimAI2

unread,
Dec 18, 2019, 7:03:39 AM12/18/19
to MIT App Inventor Forum
You use the downloadurl and filename provided by the extension get block in your web component
SEE the blocks I provided

TimAI2

unread,
Dec 18, 2019, 7:09:39 AM12/18/19
to MIT App Inventor Forum
With your firebase storage, you have a lot more work to do on the blocks. Before uploading a new sound, you will need to fetch a list of all the files already on firebase, to check against duplicate filenames when naming the new recording.

If you were clever, you could present a list of only those files on firebase that are not already on your device (created by others) to save having to download them and take up unnecessary space on your device.

I have created the on device project, as I believe it would be better to have this working, then to add on the firebase elements as needed

AuA只是一隻蚊子

unread,
Dec 18, 2019, 7:22:56 AM12/18/19
to MIT App Inventor Forum
ok, I fix it, for the last question: how to make list picker selection? do I need to make an empty list first? and how to show all the files on firebase storage on it?

TimAI2

unread,
Dec 18, 2019, 9:01:00 AM12/18/19
to MIT App Inventor Forum
"how to make list picker selection? do I need to make an empty list first? and how to show all the files on firebase storage on it?"

On investigation, there does not appear to be an extension that can help with this (get a list of filenames/download urls for all files in firebase storage)

The only method I can think of, with the tools available, given you will have multiple users uploading recordings (all using the same app?), is as follows:

  1. Create a list for the required information: fileList: ((filename url)(filename url))
  2. Using firebase database, upload this list to a tag
  3. When a recording is uploaded, immediately get the filename and download url for that recording
  4. then either:
    Download the tag with the file information
    Add the new data to the list, then save the list to the tag on firebase again
  5. or
    add the new data directly to the firebase data under the tag
I have a few other things to do today, but will have a look at this in a project later on

AuA只是一隻蚊子

unread,
Dec 18, 2019, 9:03:24 AM12/18/19
to MIT App Inventor Forum
Sounds hard but I'll try, it's 10p.m.here now so i'll do tomorrow

TimAI2

unread,
Dec 18, 2019, 4:48:55 PM12/18/19
to MIT App Inventor Forum
I have all the parts to make this work, but before I do any work, I need you to write down how the app will work from beginning to end. With this, we can make sure that we do everything in the correct order.
Please give this some thought, it is much easier to code your app when you have a clearly written plan of how it will work, then you don't have to make a mess with adding extra code (and complexity later)

What I have so far:

  1. App opens and fetches list of sound files stored on Firebase Storage (from Firebase database), and also loads the local sound file list from a tinydb
  2. User can then either:
    a) Make a New Recording
    b) Listen to an existing recording, either one of their own, or one from Firebase by other users, with the same app

  3. a) Make a New Recording
  4. User makes a new recording
  5. App asks for filename
  6. App checks against filenames from Firebase to prevent duplicate names, and also checks against local tinydb - though this is probably not necessary....
  7. App uploads recording to firebase storage with unique filename
  8. App adds this filename and its download url to the firebase database, AND to a local variable, which is saved to a tinydb of local sound files (files created on the device)

  9. b) Listen to an existing recording, either one of their own, or one from Firebase by other users, with the same app
  10. User opens a list of recordings available (from firebase list) and selects a recording to listen to
  11. App checks the selection against the local tinydb list of sound files
  12. If local, then plays file from device
  13. If not local, then downloads the file from firebase storage and plays it, also adding this file to the local list and saving to the tinydb
That is all I have, if there is more.....

Notes:
  1. A firebase database will be needed, along with the AI2 Firebase components (this is in addition to the firebase storage extension)
  2. There is no method for the deletion of sound files (this can be restricted to the users own files using the extension blocks? / otherwise the developer can do this using the Firebase console, but local files will remain with this method)

AuA只是一隻蚊子

unread,
Dec 18, 2019, 6:54:16 PM12/18/19
to mitappinv...@googlegroups.com
I'll choose b, also I have already set up a database for a long time.
so how to get started?

TimAI2

unread,
Dec 18, 2019, 7:01:19 PM12/18/19
to MIT App Inventor Forum
It wasn't meant to be a choice :)

Surely you need all of it ?

Good that you have a Firebase database :)

AuA只是一隻蚊子

unread,
Dec 18, 2019, 7:23:58 PM12/18/19
to mitappinv...@googlegroups.com
is it possible to end this at the end of December?
and where can we start? 

TimAI2

unread,
Dec 18, 2019, 7:34:34 PM12/18/19
to MIT App Inventor Forum
End of this week, I hope :)

AuA只是一隻蚊子

unread,
Dec 18, 2019, 8:02:35 PM12/18/19
to mitappinv...@googlegroups.com
I had store URL in firebase database,
then the next step is to make the value to the listpicker and after selected the URL will download the file and so the app can play the .3gp. right?
(can't see anything in list picker, it should like the first one on this blog)

blocks (5).png

AuA只是一隻蚊子

unread,
Dec 19, 2019, 7:34:26 AM12/19/19
to MIT App Inventor Forum
Can't load any text in listpicker somehow, it should work like the very first blog I post.
I set the value to URL, is that correct?
blocks.png

TimAI2

unread,
Dec 19, 2019, 9:20:01 AM12/19/19
to mitappinv...@googlegroups.com
Believe I have a working example for you that follows the workflow I put up yesterday

I will attach a blank aia project file to this post after I have posted so you need to revisit the forum if reading this by email

You will need to add your Firebase API key for both Firebase database and Firebase Storage extension
then add the service URLs for each.
The Storage Bucket for the database is left as Storage3gp, you can keep this or change it, but to start with make sure there are no records in there
The project saves recordings to a folder called "Recordings". This happens to match the folder on my sdcard: /storage/emulated/0/My Documents/Recordings
where the original sound recordings are saved. You may need to adjust things if your file paths are different

Blocks attached 
blocksRecordingsOnFirebase_blank.png
RecordingsOnFirebase_blank.aia

AuA只是一隻蚊子

unread,
Dec 19, 2019, 7:08:39 PM12/19/19
to MIT App Inventor Forum
I'm a little confused, where can I change and put the textbox1 to change names?

TimAI2

unread,
Dec 19, 2019, 8:34:56 PM12/19/19
to MIT App Inventor Forum
Change names ? (that wasn't in the script....)

There is no textbox because you use the notifier to set the filename

AuA只是一隻蚊子

unread,
Dec 20, 2019, 3:05:52 AM12/20/19
to MIT App Inventor Forum
do you know what type of error is this? (and here's the full blocks)

57203.jpg
blocks (1).png

TimAI2

unread,
Dec 20, 2019, 4:11:29 AM12/20/19
to MIT App Inventor Forum
Possibly here:

askPermission.png


You need to ask for a specific permission e.g. WRITE_EXTERNAL_STORAGE


AuA只是一隻蚊子

unread,
Dec 20, 2019, 6:39:31 AM12/20/19
to mitappinv...@googlegroups.com
Fix it, files have successful upload to firebase storage and database, but know I can't see any thing in listpicker.

AuA只是一隻蚊子

unread,
Dec 21, 2019, 12:39:26 AM12/21/19
to mitappinv...@googlegroups.com
after fixing WRITE_EXTERNAL_STORAGE error, I can't see any DB store in firebase data? i now so confused about where's the problem

TimAI2

unread,
Dec 21, 2019, 5:32:47 AM12/21/19
to MIT App Inventor Forum
Can't see how those two things are related

Check your firebase connection settings
Check your call to firebase for the data and how you handle it when it comes in 

AuA只是一隻蚊子

unread,
Dec 21, 2019, 6:42:53 AM12/21/19
to MIT App Inventor Forum
Still can't upload, also have check every path from upload to download.
57279.jpg
1576928382136.jpg
1576928241307.jpg

TimAI2

unread,
Dec 21, 2019, 7:35:39 AM12/21/19
to MIT App Inventor Forum
Please show latest blocks

TimAI2

unread,
Dec 21, 2019, 7:38:05 AM12/21/19
to MIT App Inventor Forum
And are the files being stored in firebase storage ?

AuA只是一隻蚊子

unread,
Dec 21, 2019, 9:24:28 AM12/21/19
to mitappinv...@googlegroups.com
Here you go.
1576938209057.jpg
blocks (2).png

TimAI2

unread,
Dec 21, 2019, 10:46:32 AM12/21/19