使用Google App Script讓學生可以不用登入,就能直接上傳檔案到老師的Google雲端硬碟
1.開啟程式碼(三選一): http://goo.gl/H91BDn
- 檔案上傳系統程式碼(阿正老師修改版):http://goo.gl/9yf0ke
- 檔案上傳系統程式碼(多檔版):http://goo.gl/CBRO3c
4.部署網路應用程式
5.複製並公佈網址
•可在檔案的「詳細資料」中看到上傳者資訊
•重複檔名一樣可以儲存
修改 server.gs
以下為純文字內容,方便大家直接複製使用:
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('form.html');
}
function uploadFiles(form) {
try {
var dropbox = "Google Apps Script上傳Demo";
var folder, folders = DriveApp.getFoldersByName(dropbox);
if (folders.hasNext()) {
folder = folders.next();
} else {
folder = DriveApp.createFolder(dropbox);
}
var blob = form.myFile;
var file = folder.createFile(blob);
file.setDescription("由 " + form.myName + " 上傳" );
file.setName(form.myName)
return "檔案已經上傳成功囉!謝謝您!<br><br>■<a href='" + folder.getUrl() + "' target='_blank'>瀏覽雲端硬碟資料夾</a><br><br>■<a href='" + file.getUrl() + "' target='_blank'>瀏覽雲端硬碟單一檔案";
} catch (error) {
return error.toString();
}
}
修改 form.html
以下為純文字內容,方便大家直接複製使用:
<form id="myForm">
<h3>全國海報比賽作品上傳</h3>
<input type="text" name="myName" placeholder="請輸入學校名稱+姓名">
<input type="file" name="myFile">
<input type="submit" value="開始上傳檔案(檔案上限25MB)"
onclick="this.value='檔案上傳中,請稍候!';
google.script.run.withSuccessHandler(fileUploaded)
.uploadFiles(this.parentNode);
return false;">
</form>
<div id="output"></div>
<script>
function fileUploaded(status) {
document.getElementById('myForm').style.display = 'none';
document.getElementById('output').style.display = 'block';
document.getElementById('output').innerHTML = status;
}
document.getElementById('output').style.display = 'none';
</script>
<style>
h3 { text-align:center; }
form, #output { width:400px; height: 300px; margin:auto; border: 1px solid #333;
background-image: url(http://www.photovaco.com/wp-content/uploads/2011/09/free-photo-background-986-m.jpg);
background-repeat: no-repeat;
background-position: top center; }
input { display:block; margin: 20px; width:90%; height:2em;}
#output { padding:20px;word-wrap:break-word; }
</style>
沒有留言:
張貼留言