Загрузка формы и файла с помощью htmlService и скрипта приложения не работает
Я пытаюсь загрузить файл в определенную папку Google Диска вместе с данными формы в электронную таблицу. Часть электронной таблицы этого кода работает, но функция загрузки файла не работает. Любая помощь на ретины.
код.gs
var submissionSSKey = 'SS ID';
function doGet(e) {
var template = HtmlService.createTemplateFromFile('Form.html');
template.action = ScriptApp.getService().getUrl();
return template.evaluate();
}
function doPost(e) {
var template = HtmlService.createTemplateFromFile('Thanks.html');
var LoanType = template.name = e.parameter.name;
var borrower = template.department = e.parameter.department;
var amount = template.message = e.parameter.message;
var emailed = template.email = e.parameter.email;
var comp = 'N/A'
var sheet = SpreadsheetApp.openById(submissionSSKey).getSheets()[0];
var lastRow = sheet.getLastRow();
var targetRange = sheet.getRange(lastRow+1, 1, 1, 5).setValues([[comp,LoanType,borrower,amount,emailed]]);
var fileBlob = e.paramater.thefile
var doc = DriveApp.getFolderById('folder ID');
doc.createFile(fileBlob)//.rename('New Name');
return template.evaluate();
}
форма.HTML-код
<html>
<head>
<title></title>
</head>
<body>
<form action="<?= action ?>" enctype="multipart/form-data" method="post">
<table border="0" cellpadding="1" cellspacing="0" style="width: 500px;">
<tbody>
<tr>
<td>
Name:</td>
<td>
<input name="name" type="text" /></td>
</tr>
<tr>
<td>
Department:</td>
<td>
<select name="department">
<option>Select Option</option>
<option>Cashier</option>
<option>Greeter</option>
<option>Runner</option>
<option>Line Control</option>
<option>IDB</option>
<option>Unknown</option>
</select></td>
</tr>
<tr>
<td>
Email:</td>
<td>
<input name="email" type="text" /></td>
</tr>
<tr>
<td>
Message:</td>
<td>
<textarea name="message" style="margin: 2px; height: 148px; width: 354px;"></textarea></td>
</tr>
<tr>
<td>
<p>
School Schedule (Image Files Only):</p>
</td>
<td>
<p>
<input type="file" id="thefile" name="thefile">
</p></td>
</tr>
<tr>
<td>
<input type="submit" value="Submit" /></td>
<td>
You will receive an email confirmation upon submission</td>
</tr>
</tbody>
</table>
</form></body>
</html>
спасибо.HTML-код
<html>
<body>
<h1>Thanks</h1>
<p>Thank you for your submission.</p>
Name: <?= name ?><br/>
Department: <?= department ?><br/>
Message: <?= message ?><br/>
Email: <?= email ?><br/>
</body>
</html>
1 ответов
Edit: пример работающего
HtmlService не поддерживает post
метод для HTML-форм. Входные элементы, собранные формой, могут быть переданы серверной функции с помощью функции обработчика. Дополнительные сведения см. В разделе служба HTML: связь с функциями сервера.
вот пример, основанный на коде, который вы разместили в своем вопрос.
форма.HTML-код
<script>
// Javascript function called by "submit" button handler,
// to show results.
function updateOutput(resultHtml) {
toggle_visibility('inProgress');
var outputDiv = document.getElementById('output');
outputDiv.innerHTML = resultHtml;
}
// From blog.movalog.com/a/javascript-toggle-visibility/
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
</script>
<div id="formDiv">
<!-- Form div will be hidden after form submission -->
<form id="myForm">
Name: <input name="name" type="text" /><br/>
Department: <select name="department">
<option>Select Option</option>
<option>Cashier</option>
<option>Greeter</option>
<option>Runner</option>
<option>Line Control</option>
<option>IDB</option>
<option>Unknown</option>
</select><br/>
Email: <input name="email" type="text" /><br/>
Message: <textarea name="message" style="margin: 2px; height: 148px; width: 354px;"></textarea><br/>
School Schedule (Image Files Only): <input name="myFile" type="file" /><br/>
<input type="button" value="Submit"
onclick="toggle_visibility('formDiv'); toggle_visibility('inProgress');
google.script.run
.withSuccessHandler(updateOutput)
.processForm(this.parentNode)" />
</form>
</div>
<div id="inProgress" style="display: none;">
<!-- Progress starts hidden, but will be shown after form submission. -->
Uploading. Please wait...
</div>
<div id="output">
<!-- Blank div will be filled with "Thanks.html" after form submission. -->
</div>
спасибо.HTML-код
<div>
<h1>Thanks</h1>
<p>Thank you for your submission.</p>
Name: <?= name ?><br/>
Department: <?= department ?><br/>
Message: <?= message ?><br/>
Email: <?= email ?><br/>
File URL: <?= fileUrl ?><br/>
</div>
код.gs
var submissionSSKey = '--Spreadsheet-key--';
var folderId = "--Folder-Id--";
function doGet(e) {
var template = HtmlService.createTemplateFromFile('Form.html');
template.action = ScriptApp.getService().getUrl();
return template.evaluate();
}
function processForm(theForm) {
var fileBlob = theForm.myFile;
var folder = DriveApp.getFolderById(folderId);
var doc = folder.createFile(fileBlob);
// Fill in response template
var template = HtmlService.createTemplateFromFile('Thanks.html');
var name = template.name = theForm.name;
var department = template.department = theForm.department;
var message = template.message = theForm.message;
var email = template.email = theForm.email;
var fileUrl = template.fileUrl = doc.getUrl();
// Record submission in spreadsheet
var sheet = SpreadsheetApp.openById(submissionSSKey).getSheets()[0];
var lastRow = sheet.getLastRow();
var targetRange = sheet.getRange(lastRow+1, 1, 1, 5).setValues([[name,department,message,email,fileUrl]]);
// Return HTML text for display in page.
return template.evaluate().getContent();
}
оригинальный ответ, который был сосредоточен на базовой отладке:
откуда взялся этот код? Были несколько вопросов, и было бы полезно увидеть оригинальный учебник или пример, из которого он был взят.
когда вы запускаете этот код как опубликованное веб-приложение и отправляете файл, ошибка, которую вы получаете TypeError: Cannot read property "thefile" from undefined.
больше не копая, это говорит вам, что есть undefined
"объект" используется в коде. Что это? Пока не знаю, но подсказка в том, что код ищет свойство с именем "thefile"
.
если у вас есть скрипт, открытый в редакторе, и запустил webapp оттуда (нажав на Test web app for your latest code
в диалоговом окне опубликовать / развернуть как веб-приложение), затем вы также можете проверить транскрипт выполнения для получения дополнительной информации. (под меню "Вид") Вы найдете, что он содержит что-то вроде этого:
[13-12-25 07:49:12:447 EST] Starting execution
[13-12-25 07:49:12:467 EST] HtmlService.createTemplateFromFile([Thanks.html]) [0 seconds]
[13-12-25 07:49:12:556 EST] SpreadsheetApp.openById([--SSID--]) [0.089 seconds]
[13-12-25 07:49:12:557 EST] Spreadsheet.getSheets() [0 seconds]
[13-12-25 07:49:12:626 EST] Sheet.getLastRow() [0.067 seconds]
[13-12-25 07:49:12:627 EST] Sheet.getRange([1, 1, 1, 5]) [0 seconds]
[13-12-25 07:49:12:629 EST] Range.setValues([[[N/A, , Select Option, , ]]]) [0.001 seconds]
[13-12-25 07:49:12:983 EST] Execution failed: TypeError: Cannot read property "thefile" from undefined. (line 20, file "Code") [0.17 seconds total runtime]
мы видим ту же ошибку, но теперь мы знаем номер строки. Эта строка содержит орфографическую ошибку:
var fileBlob = e.paramater.thefile
^^^^^^^^^