Google Drive Upload-Formular mit Google Apps Skript programmieren
In diesem Tutorial erstellen wir mit HTML, CSS, JavaScript und Google Apps Script ein Formular, mit dem User ohne Google-Account Dateien in dein Google Drive hochladen können. 📁
Das Skript baut auf einem öffentlich zugänglichen Skript von Doug Saunders auf, für welches viele Anleitungen zum Copy-Paste kuriseren (siehe etwa • Create a Public Dropbox for Google Dr... ). Ergänzt habe ich unter anderem eine Passwortabfrage, den Upload von mehreren Dateien, mehrere Textfelder und ein individuelles Design. Und natürlich wird der Code Schritt für Schritt erklärt.
📝 Quellcode
● Code: https://script.google.com/d/1sOuFP2j3...
⏱ Zeitmarken
● Vorstellung: 00:00:00
● Zugriff auf einen Ordner mit der DriveApp: 00:03:14
● Erstellung und Einbindung der HTML-Datei: 00:07:07
● Erstellung von Login- und Upload-Formulars in HTML: 00:10:46
● Styling mit CSS: 00:22:13
● JavaScript und CSS auslagern: 00:34:35
● Login-Formular verschwinden lassen: 00:38:42
● Erstellung eines Unterordners mit der DriveApp: 00:39:40
● Regulärer Ausdruck fürs Datum: 00:47:00
● Vorbereitung für Upload einer Datei: 00:49:32
● Base 64 Daten: 00:55:18
● Datei Upload: 00:59:16
● Demonstration des Datei Uploads: 01:05:10
● Meldung für erfolgreichen Upload: 01:06:14
● Plan für den Upload mehrerer Dateien: 01:07:07
● Rekursiver Aufruf des Uploads mit User Object: 01:09:28
● Statusmeldungen während des Uploads: 01:11:44
● Demonstration des mehrfachen Datei Uploads: 01:13:17
● Statusmeldung vor dem Upload: 01:14:07
● Deaktivierung des Uploadformulars: 01:14:41
● Sperrung des Loginformulars bei falschem Passwort: 01:15:56
● Serverseitige Passwortabfrage: 01:18:42
● Falschmeldung: 01:25:22
● Veröffentlichung und finale Demonstration: 01:25:54
● Benachrichtigung per Mail: 01:27:54
● Google-Formulare: 01:31:08
● Abschluss: 01:33:40
📺 Empfehlenswerte YouTube-Kanäle
● Meth Meth Method: / @meth-method
● freeCodeCamp: / @freecodecamp
● The Coding Train: / @thecodingtrain
● Code Bullet: / @codebullet
📙 Quellen
● Google Apps Script Referenz: https://developers.google.com/apps-sc...
● W3Schools (Referenz für HTML, JavaScript, CSS): https://www.w3schools.com/
● Skript "Work Collector" von Doug Saunders: https://script.google.com/d/1x3p9ZAv-...
● Stackoverflow (Fragen und Antworten): https://stackoverflow.com/questions/
💻 Verwendete Software
● Code Editor: Visual Studio Code: https://code.visualstudio.com/
● Aufnahme: OBS: https://obsproject.com/de
● Video Editor: Davinci Resolve 15: https://www.blackmagicdesign.com/de/p...
#GoogleAppsScript #GoogleDrive #JavaScript