суббота, 17 февраля 2018 г.

КАК ЗАГРУЗИТЬ ФАЙЛ НА ДИСК GOOGLE ЧЕРЕЗ ФОРМУ

КАК ЗАГРУЗИТЬ ФАЙЛ НА ДИСК GOOGLE ЧЕРЕЗ ФОРМУ

В Формах стала доступна загрузка файлов https://goo.gl/KHDGft
Постановка задачи в виде часто задаваемых вопросов:
  1. Как загрузить файл на Диск через Формы Гугл?
  2. Как разрешить пользователю загрузить файл на мой Диск?
  3. Как можно загружать файлы на Диск через форму.


Краткие ответы
  1. Никак, такого функционала не существует.
  2. Вы можете это сделать четырьмя более-менее доступными способами, все из них используют Диск Гугл как сервис: использовать свое приложение, подключив Google Drive API; использовать стороннее приложение, которое получает доступ к вашему Диску через Google Drive API; использовать Google Apps Script с клиентской частью либо как сервер-обработчик REST, который Google Drive API подключает автоматически.
  3. Из п. 2 вытекает, что возможно использовать собственную форму для загрузки файла на Диск.
Вариант с Google Apps Script с клиентской частью.


Ограничения: максимальный размер файла 10Мб; страшная полоска "This application was created by another user, not by Google."; сложность изготовления, для неподготовленного пользователя.
Для начала, наберитесь терпения.

Создайте директорию, в которой будете хранить файлы (она может быть публичной, если это задано условием).

Создайте Таблицу https://docs.google.com/spreadsheets, в которой будут храниться данные формы (эта Таблица может находиться в той же папке, если это задано условием. Рассмотрите варианты доступа подробнее исходя из условий вашей задачи).

Создайте скрипт https://script.google.com.

В скрипте вам необходимо создать два файла (один уже есть по умолчанию, это Code.gs). Второй файл формата HTML под названием index.html.

Содержимое этих файлов:
//глобальные переменные
var FOLDER_ID = '0Bztea6vSatozflJSckhvNk55VXNXVExHTlBQSl9Qd21nM0dDdTRnbWJPdjhLZmhKLXZidHM';
var SHEET_ID = '1toHBN8rPp9d0GFQQY8XEypMS-CkKoMAvcfQMkyulrR0';
//вместо инициализации
function onInstall() { }
//сервеер
function doGet(e) {
//возвращает страницу
return HtmlService.createHtmlOutputFromFile('index').addMetaTag('viewport', 'width=device-width, initial-scale=1').setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
//обработчик вызова сервера
function uploadFiles(form) {
//все в try, иначе придется обрабатывать исключения на клиенте
try {
//берем нашу папку
var folder = DriveApp.getFolderById(FOLDER_ID);
var res = [];
//сортировка полей по имени
var form_keys = Object.keys(form).sort();
/*
или задайте свою сортировку
var form_keys = ['file1', 'file2'];
*/
for (var i = 0; i < form_keys.length; i++) {
var key = form_keys[i];
if (form[key] && form[key].getBlob) {
if (form[key].length && form[key].contents) {
//берем контент file
var blob = form[key];
//создаем файл на Диске
var file = folder.createFile(blob);
file.setDescription('Uploaded by ' + form['name'] + ' ' + form['comment']);
res.push(file.getUrl());
} else {
// поле file оказалось пустым
res.push('Пусто');
}
}
}
//делаем запись в Таблице в первом найденном листе (Необходимо переписать для большей логики)
SpreadsheetApp.openById(SHEET_ID).getSheets()[0].appendRow([new Date(), form['name'], form['comment']].concat(res));
//ответ сервера
return 'Файл(ы) загружен(ы), йо!';
} catch (e) {
//обработаем любую ошибку как ответ сервера "ОК" 200
return e.toString();
}
}
view rawCode.gs hosted with ❤ by GitHub
<!doctype html>
<html>
<head>
<base target="_top">
<!-- CSS от Google Add-on -->
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
<!-- Немного своего стиля -->
<style>
#app {
margin: 55px auto;
width: 350px;
}
/* Перепишем кое-что из add-ons.css */
input {
width: 100%;
}
.form-group {
margin: 9px 0px 9px 0px;
}
</style>
<!-- googleanalytics.html -->
</head>
<body>
<!-- основное приложение -->
<div id="app">
<!-- форма -->
<form id="form">
<div class="form-group">
<label for="name">Имя</label>
<input type="text" name="name" placeholder="Имя" />
</div>
<div class="form-group">
<label for="comment">Комм</label>
<input type="text" name="comment" placeholder="Комментарий" />
</div>
<div class="form-group">
<input type="file" name="file1" />
</div>
<div class="form-group">
<input type="file" name="file2" />
</div>
<label><sub><i>Суммарный вес файлов не должен превышать 10Мб</i></sub></label>
<div class="form-group">
<input type="submit" value="Upload file" />
</div>
</form>
<div id="output"></div>
</div>
<script>
//Обработка события onsubmit
var frm = document.getElementById('form');
var otp = document.getElementById('output');
if (frm.addEventListener)
frm.addEventListener('submit', submit, false);
//функция кнопки submit
function submit(event) {
event.preventDefault();
frm.style.display = 'none';
//меняем надпись
otp.innerHTML = 'Идет загрузка...';
//вызываем сервер для обработки данных формы. Функция на стороне сервера uploadFiles(form)
google.script.run.withSuccessHandler(onSuccess).withFailureHandler(onFailure).uploadFiles(this);
}
//функция по завершению работы с сервером
function onSuccess(status) {
frm.style.display = 'block'; //прячем форму
frm.reset();
otp.innerHTML = status; //показываем, что ответил сервер
}
function onFailure(e) {
frm.style.display = 'block'; //прячем форму
otp.innerHTML = JSON.stringify(e);
}
</script>
<!-- inject:sh -->
<!-- endinject -->
</body>
</html>
view rawindex.html hosted with ❤ by GitHub
Далее публикуем скрипт.
Эта публикация необходима здесь для того, чтобы показать, что это возможно. Код приведенный здесь, хоть и работает, но не является достаточным для полноценного функционирования. Тут не рассмотрены вопросы создания скриптов с нуля, публикации версий, режимов работы скриптов. Для дополнительной информации воспользуйтесь файлом 1. Google Apps Script. Начало. Нужны они вам или нет? 
Директория со скриптом, Таблицей и папкой файлов тут <-- ВАТТУТ ВОТ
Отправить файл на мой Диск вы можете через опубликованный скрипт
Посмотреть результат работы

0 коммент.:

Отправить комментарий