Skip to content

Instantly share code, notes, and snippets.

@neno-tech

neno-tech/code.gs

Last active December 21, 2023 09:22
Show Gist options
  • Save neno-tech/552055f71a5f503e8b5fb32e308c29da to your computer and use it in GitHub Desktop.
Save neno-tech/552055f71a5f503e8b5fb32e308c29da to your computer and use it in GitHub Desktop.
Download ZIP
แจกโค้ดฟอร์มอัปโฟลดไฟล์ + ส่งเตือนไลน์
Raw
code.gs
function doGet(e) {
var htmlOutput = HtmlService.createTemplateFromFile('index');
htmlOutput.message = '';
return htmlOutput.evaluate();
}
function doPost(e) {
var folder = DriveApp.getFolderById('xxx');//เปลี่ยนเป็นไอดีโฟลเดอร์เก็บไฟล์ของท่าน;
var data = Utilities.base64Decode(e.parameter.fileData);
var blob = Utilities.newBlob(data, e.parameter.mimeType, e.parameter.fileName);
var file = folder.createFile(blob);
var fileURL = file.getUrl();
recordData(
e.parameter.username,
e.parameter.nickname,
e.parameter.phone,
fileURL
);
var htmlOutput = HtmlService.createTemplateFromFile('success');
htmlOutput.message = 'อัปโหลดไฟล์เรียบร้อยแล้ว';
return htmlOutput.evaluate();
}
function recordData(username, nickname, phone, fileURL){
var token = 'xxx'
msg = 'มีนักเรียนส่งงาน ชื่อ '+username
var ss = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet()
ss.appendRow([
new Date(),
username,
nickname,
"'"+phone,
fileURL
]);
NotifyApp.sendNotify(token,msg)
}
function getUrl() {
var url = ScriptApp.getService().getUrl();
return url;
}
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mitr:wght@300&family=Prompt:wght@300&display=swap" rel="stylesheet">
<style>
body{
font-family: 'Mitr', sans-serif;
}
</style>
</head>
<body>
<div class="container">
<!-- <div class="card mt-3 mx-auto text-center" style="width: 22rem;">
<div class="card-header bg-primary text-white">
ฟอร์มอัปโหลดไฟล์
</div> -->
</div>
<div class="card mt-3 mx-auto " style="width: 22rem;">
<!-- <div class="card-header bg-primary text-white">
ฟอร์มอัปโหลดไฟล์
</div> -->
<img src="https://www.mindphp.com/images/articles/202001/article-meaning/web-banner.png" class="card-img-top" alt="...">
<div class="card-body">
<?var url = getUrl();?>
<form method="post" onsubmit="wait()" action="<?= url ?>">
<div class="mb-3">
<label for="username" class="form-label"> ชื่อ สกุล</label>
<input type="text" class="form-control" name="username" placeholder="ชื่อ สกุล" required>
</div>
<div class="mb-3">
<label for="nickname" class="form-label"> ชื่อเล่น</label>
<input type="text" class="form-control" name="nickname" placeholder="ชื่อเล่น" required>
</div>
<div class="mb-3">
<label for="phone" class="form-label"> เบอร์โทร</label>
<input type="text" class="form-control" name="phone" placeholder="เบอร์โทร" required>
</div>
<div class="mb-3">
<label class="form-label"> อัปโหลดไฟล์</label>
<input type="file" class="uploader form-control" name="file" onchange="LoadFile(event)">
<input type="hidden" id="fileData" name="fileData">
<input type="hidden" id="mimeType" name="mimeType">
<input type="hidden" id="fileName" name="fileName">
</div>
<div class="mb-3">
<button type="submit" class="btn btn-primary"> อัปโหลด</button>
</div>
</form>
</div>
</div>
</div>
<script>
function LoadFile(event) {
var file = event.target.files[0];
var reader = new FileReader();
reader.onload = function (e) {
var fileData = e.target.result.substr(e.target.result.indexOf(",") + 1);
var mimeTypeStart = e.target.result.indexOf("data:") + 5;
var mimeTypeEnd = e.target.result.indexOf(";");
var mimeType = e.target.result.substr(mimeTypeStart, mimeTypeEnd - mimeTypeStart);
var fileName = file.name;
document.getElementById("fileData").value = fileData;
document.getElementById("mimeType").value = mimeType;
document.getElementById("fileName").value = fileName;
};
reader.readAsDataURL(file);
}
function wait(){
Swal.fire({
position: 'center',
icon: 'info',
title: 'โปรดรอ..กำลังอัปโหลดข้อมูล',
allowOutsideClick: false,
showConfirmButton: false,
})
}
</script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</body>
</html>
Raw
success.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mitr:wght@300&family=Prompt:wght@300&display=swap" rel="stylesheet">
<style>
body{
font-family: 'Mitr', sans-serif;
}
</style>
</head>
<body>
<?=message?>
<script>
onload = function(){
Swal.fire({
position: 'center',
icon: 'success',
title: 'อัปโหลดไฟล์เรียบร้อยแล้ว',
showConfirmButton: false,
timer: 1500
})
}
</script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment