我有一个HTML表单,可让用户上传文件。然后,我想将该文件上传到我的Google驱动器。
用户单击提交时的我的Javascript。
var data = new FormData();
data.append('resume', document.getElementById('file'));
fetch(scriptURL, {method: 'POST', body: data })
.then(response => console.log('Success!', response))
.catch(error => console.error('Error!', error.message))
我的Google脚本
doPost(e){
uploadFile(e.parameter['file])
}
function uploadFile(file, name){
var blob = file.myFile;
var name = "file";
var contentType = "application/pdf";
var fileBlob = Utilities.newBlob(blob, contentType, name);
var file = folder.createFile(fileBlob);
}
我希望将已上传的pdf存储在我的google驱动器中,但是我当前的代码是给我一个9字节的pdf文件,只是说未定义
尝试一下-
Code.gs
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('Form').setTitle('Form')
}
function upload(obj) {
var blob = Utilities.newBlob(Utilities.base64Decode(obj.data), obj.mimeType, obj.fileName)
DriveApp.createFile(blob);
return 'Done';
}
Form.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<base target="_top">
<link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Montserrat', sans-serif;
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script>
function uploadData() {
const f = document.getElementById('upFile');
[...f.files].forEach((file, i) => {
const fr = new FileReader();
fr.onload = (e) => {
const data = e.target.result.split(",");
const obj = {
fileName: f.files[i].name,
mimeType: data[0].match(/:(\w.+);/)[1],
data: data[1]
};
var buttonID = document.getElementById('uploadButton');
$(buttonID).attr("disabled", "disabled");
google.script.run.withSuccessHandler((id) => {
M.toast({
html: id
});
$(buttonID).removeAttr("disabled");
}).upload(obj);
}
fr.readAsDataURL(file);
});
}
</script>
</head>
<body>
<div class="container center">
<div id="upload" class="col s12">
<form onsubmit="event.preventDefault(); uploadData()">
<div class="row">
<div class="input-field col s12 m6 l4 offset-m3 offset-l4">
<div>
<h4><br /></h4></div>
<div class="file-field input-field">
<div class="btn blue">
<span>File</span>
<input type="file" name="upFile" id="upFile" required="" aria-required="true">
</div>
<div class="file-path-wrapper">
<input class="file-path validate" type="text" placeholder="Upload file" required="" aria-required="true">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col s12 m6 l4 offset-m3 offset-l4">
<button class="waves-effect btn blue" type="submit" id="uploadButton">Upload</button>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
我很随意地添加了一些Materialize CSS-希望没问题:)