Upload Image to Google Drive And Google Sheet From HTML File Input Element | JavaScript | AppScript
Hello, in today's video i'll be showing you how to upload image in Google drive and Google sheet From HTML File Input Element.
AppScript Code
let app = SpreadsheetApp.openByUrl("Your_Google_Sheet_URL");
let sheet = app.getSheetByName("Your_Google_Sheet_Name");
function doPost(e){
try{
let obj = JSON.parse(e.postData.contents);
let dcode = Utilities.base64Decode(obj.base64);
let blob = Utilities.newBlob(dcode,obj.type,obj.name);
let newFile = DriveApp.createFile(blob);
let link = newFile.setSharing(DriveApp.Access.ANYONE_WITH_LINK,DriveApp.Permission.VIEW).getDownloadUrl();
let lr = sheet.getLastRow();
sheet.getRange(lr+1,1).setFormula(`=IMAGE("${link}")`);
return ContentService.createTextOutput("image uploaded")
}catch(err){
return ContentService.createTextOutput(err)
}
}
Html JavaScript Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="file"accept="image/*">
<img src="" alt="">
<script>
let url = "Api_Endpoint_Url";
let file = document.querySelector("input");
let img = document.querySelector("img");
file.addEventListener('change',()=>{
let fr = new FileReader();
fr.addEventListener('loadend',()=>{
let res = fr.result;
img.src=res;
let spt = res.split("base64,")[1];
// console.log(spt);
let obj = {
base64:spt,
type:file.files[0].type,
name:file.files[0].name
}
fetch(url,{
method:"POST",
body:JSON.stringify(obj)
})
.then(r=>r.text())
.then(data=>console.log(data))
})
fr.readAsDataURL(file.files[0])
})
</script>
</body>
</html>
No comments:
Post a Comment