Links
🎙️

Native Audio Recorder

Available in >=2.8.0 (Bubble Plugin + JS SDK)

🧋 Bubble.io Plugin

[Element] Natively - Audio Recorder

Events:

  • Recorder Result Updated - get called after finished recording
  • Recorder Cancelled - get called after user close recorder (without recordings)
  • File Uploaded - get called after the file was successfully uploaded on S3 (You can find a file URL in element's state)
  • File Size over limit - Triggered when file size is more then File Size Limit param

States:

  • Recorder Result (Base64) - Base64 string representation of a file, can be used for custom uploading
  • Recorder Result (Content Type) - image/png, image/jpeg or video/mp4
  • Uploaded File URL - Amazon S3 file URL
  • File Size - size of latest camera result file in KB

Actions:

  • Show Recorder
    • Upload File - checkbox (Upload file to Amazon S3)
    • File Name - will be used if Upload File is checked
    • File Size Limit - (in KB) prevent uploading big files to Bubble's amazon S3
    • Max Duration (iOS) - max duration of recording in seconds (v2.8.2)

🛠 JavaScript SDK

NativelyAudioRecorder

1
const recorder = new NativelyAudioRecorder()
2
const show_recorder_callback = function (resp) {
3
console.log(resp.base64); // base64 string of media file
4
console.log(resp.content_type); // "audio/m4a" for ios or "audio/wav" for android
5
console.log(resp.size); // 1024 <- file size in KB
6
console.log(resp.status); // "SUCCESS", "CANCELLED" - finish with recording or just closed (cancelled)
7
};
8
recorder.showRecorder(show_recorder_callback);