CODEWITHSUNDEEP
javascriptgoogle-apps-scriptgoogle-drive-apiblob
Jason Allshorn
Jason Allshorn

Reputation: 1625

Convert a .ogg blob into a google drive file

Background

I want to record students speaking and then upload their recordings automatically to Google drive.

Current state of affairs

I have client side code which can produce a blob containing .ogg recording. 

var blob = new Blob(chunks, { 'type' : 'audio/ogg; codecs=opus' });

I can send the blob to a Google apps script standalone script in a doPost() request. In this case I'm using axios with a promise. 

axios.post("https://script.google.com/macros/s/SOME_ID/exec", blob)
  .then((response)=>{
   console.log(response)
  }).catch(error =>{
   console.log(error)
  })

The blob arrives at the standalone script.

The standalone Google apps script

function doPost(e) {


  var params = JSON.stringify(e.parameters);
  createNewSoundFile(params)
  return ContentService.createTextOutput(params); 
}

function createNewSoundFile(blob){
  var title = 'Was created from a recording'
  var folderId = 'SOME_FOLDER_ID'
  var resource = {
    title: title,
    parents: [
      {
        "id": folderId, 
        "kind": "drive#fileLink"
      }
    ],
    mimeType: 'application/vnd.google-apps.audio', 
  };
  try{

  var newfile = Drive.Files.insert(resource, blob).id

  } catch(e){
   // Send error to Google sheet
   // Exception: The mediaData parameter only supports blob types for uploads.

  }
}

Problem

The above apps script code says the blob is not a support media type.

Question

How can I create become a new .ogg file in the Google drive from a .ogg blob created in the browser?

Upvotes: 2

Views: 817

Answers (1)

Tanaike
Tanaike

Reputation: 201388

How about these modifications?

Modification points :

javascript side :

  • Encode blob to base64, and sent it as the string data.

GAS side :

  • Decode base64 to blob, and save it as a ogg file with the mimeType of audio/ogg.
  • Save the file as audio/ogg.
    • In my environment, it couldn't convert from audio/ogg to application/vnd.google-apps.audio.

Modified script : javascript side

From :

axios.post("https://script.google.com/macros/s/SOME_ID/exec", blob)
  .then((response)=>{
   console.log(response)
  }).catch(error =>{
   console.log(error)
  })

To :

var reader = new FileReader();
reader.readAsDataURL(blob);
reader.onloadend = function() {
  base64 = reader.result.replace(/^.*,/, "");
  let data = new URLSearchParams();
  data.append('data', base64);
  axios.post(
    "https://script.google.com/macros/s/SOME_ID/exec",
    data,
    {headers: {'Content-Type': 'application/x-www-form-urlencoded'}}
  ).then((response)=>{
    console.log(response)
  }).catch(error =>{
    console.log(error)
  });
}

Modified script : GAS side

To :

function createNewSoundFile(base64){
  var data = Utilities.base64Decode(base64.parameters.data); // Added
  var blob = Utilities.newBlob(data); // Added

  var title = 'Was created from a recording'
  var folderId = 'SOME_FOLDER_ID'
  var resource = {
    title: title,
    parents: [
      {
        "id": folderId, 
//        "kind": "drive#fileLink" // I didn't know whether this is required.
      }
    ],
    mimeType: "audio/ogg", // Modified
  };
  try{

  var newfile = Drive.Files.insert(resource, blob).id

  } catch(e){
   // Send error to Google sheet
   // Exception: The mediaData parameter only supports blob types for uploads.

  }
}

Note :

  • In my environment, {headers: {'Content-Type': 'application/x-www-form-urlencoded'}} was required for the script of javascript side. If it is not required in your environment, please remove it.

If I misunderstand your question, I'm sorry.

Upvotes: 3

Related Questions