wake-up-neo.com

Wie kann ich nur mit Javascript auf Google Sheet-Tabellen zugreifen?

Ich möchte nur mit JavaScript auf Google Spreadsheets zugreifen (kein .NET, C #, Java usw.)

Ich kam hier und war schockiert zu wissen, dass es KEINE API für JavaScript gibt, um auf Google Sheets zuzugreifen.

Bitte sagen Sie mir, wie ich mit JavaScript oder einem seiner Frameworks wie jQuery auf Google Sheets zugreifen kann (ERSTELLEN/BEARBEITEN/LÖSCHEN).

93
Pratik

Ich habe eine einfache Javascript-Bibliothek erstellt, die Google-Tabellendaten (sofern veröffentlicht) über die JSON-API abruft:

https://github.com/mikeymckay/google-spreadsheet-javascript

Sie können es hier in Aktion sehen:

http://mikeymckay.github.com/google-spreadsheet-javascript/sample.html

53
Mike McKay

Januar 2018 UPDATE : Als ich letztes Jahr diese Frage beantwortete, habe ich es versäumt, eine dritte Möglichkeit für den Zugriff auf Google-APIs zu erwähnen mit JavaScript, und das wäre aus Node.js Apps mit its Client-Bibliothek, also habe ich es unten hinzugefügt.

Es ist März 2017, und die meisten Antworten hier sind veraltet - die akzeptierte Antwort bezieht sich jetzt auf eine Bibliothek, die verwendet eine ältere API-Version. Eine aktuellere Antwort: Sie können auf die meisten Google-APIs nur mit JavaScript zugreifen. Google bietet hierfür heute drei Möglichkeiten:

  1. Wie in Antwort von Dan Dascalesc erwähnt, können Sie Google Apps Script , die Cloud-Lösung von JavaScript in Google, verwenden. Das heißt, serverseitige JS-Apps von Drittanbietern außerhalb des Browsers, die auf Google-Servern ausgeführt werden.
  2. Sie können auch die Google APIs Client Library für JavaScript ​​verwenden, um auf die neuesten Google Sheets REST API auf der Clientseite zuzugreifen.
    • Hier sind einige allgemeine Beispiele zur Verwendung der Client-Bibliothek
    • Die neueste Sheets API (v4) war freigegeben bei Google I/O 2016; Es ist viel leistungsfähiger als alle früheren Versionen und bietet Entwicklern programmgesteuerten Zugriff auf die meisten Funktionen der Benutzeroberfläche von Sheets
    • Hier ist der JavaScript-Schnellstart ​​für die API, um Ihnen den Einstieg zu erleichtern
    • Hier sind Beispiel "Rezepte" (JSON-Nutzdaten) für Kern-API-Anforderungen
    • Wenn Sie nicht "allergisch" gegen Python (wenn Sie es sind, tun Sie einfach so, als wäre es Pseudocode;)) sind, habe ich mehrere Videos mit mehr "echten" Beispielen für die Verwendung der API gemacht, die Sie können Lernen Sie von JS und migrieren Sie auf Wunsch zu JS (HINWEIS: Auch wenn es sich um Python Code handelt, haben die meisten API-Anforderungen JSON und können problemlos auf JS portiert werden):
      1. Migrieren von SQL-Daten in ein Sheet ​​(Code Deep Dive Post )
      2. Formatieren von Text mit der Sheets-API (Code Deep Dive Post )
      3. Generieren von Folien aus Tabellenkalkulationsdaten (Code Deep Dive Post )
  3. Die dritte Möglichkeit, mit JavaScript auf Google-APIs zuzugreifen, besteht in den Apps von Node.j mit seiner Clientbibliothek . Es funktioniert ähnlich wie die oben beschriebene JavaScript-Clientbibliothek, nur dass Sie serverseitig auf dieselbe API zugreifen. Hier ist das Node.js-Schnellstart-Beispiel für Sheets. Möglicherweise sind die oben genannten Python-basierten Videos sogar noch nützlicher, da sie auch serverseitig auf die API zugreifen.

Wenn Sie die REST API verwenden, müssen Sie Ihren Quellcode verwalten und speichern sowie die Autorisierung durchführen, indem Sie Ihren eigenen Authentifizierungscode rollen (siehe Beispiele oben). Apps Script erledigt dies in Ihrem Auftrag und verwaltet Die Daten (Reduzierung der "Schmerzen", wie von Ape-inago in deren Antwort ​​erwähnt) und Ihr Code werden auf den Servern von Google gespeichert. Ihre Funktionalität ist jedoch auf die Dienste beschränkt, die App Script bereitstellt, und es ist älteres JS (ES3 + einige ES5-Funktionen und Google-Anpassungen), während die REST API Entwicklern einen viel breiteren Zugriff auf die API bietet Bei der ursprünglichen Frage haben Entwickler drei Möglichkeiten, mit JavaScript auf Google Sheets zuzugreifen.

44
wescpy

Hier ist das Wesentliche.

Mit Google Sheets API können Sie eine Tabelle erstellen. Es gibt derzeit keine Möglichkeit, eine Tabelle mithilfe der API zu löschen (lesen Sie die Dokumentation). Stellen Sie sich die Google Text & Tabellen-API als Weg zum Erstellen und Nachschlagen von Dokumenten vor.

Sie können Arbeitsblätter in der Tabelle mithilfe von arbeitsblattbasierte Feeds hinzufügen/entfernen.

Das Aktualisieren einer Tabelle erfolgt entweder über listenbasierte Feeds oder zellenbasierte Feeds .

Das Lesen der Tabelle kann entweder über die oben genannten Google Spreadsheets-APIs oder, nur für veröffentlichte Tabellen mithilfe von Google Visualization API Query Language zum Abfragen der Daten erfolgen ( die Ergebnisse im CSV-, JSON- oder HTML-Tabellenformat zurückgeben können).


Vergiss jQuery. jQuery ist nur dann wirklich wertvoll, wenn Sie das DOM durchlaufen. Da GAS (Google Apps Scripting) das DOM nicht verwendet, fügt jQuery Ihrem Code keinen Wert hinzu. Bleib bei Vanille.

Ich bin wirklich überrascht, dass noch niemand diese Informationen in einer Antwort angegeben hat. Es kann nicht nur durchgeführt werden, sondern es ist auch relativ einfach, Vanilla JS zu verwenden. Die einzige Ausnahme ist die relativ neue Google Visualization API (Stand 2011). Die Visualisierungs-API funktioniert auch ausschließlich über einen HTTP-Abfragezeichenfolge-URI.

34
Evan Plaice

2016 Update : Am einfachsten ist die Verwendung der Google Apps Script API, insbesondere des SpreadSheet Service . Dies funktioniert für private Arbeitsblätter im Gegensatz zu den anderen Antworten, für die die Veröffentlichung der Tabelle erforderlich ist.

Auf diese Weise können Sie JavaScript-Code an ein Google Sheet binden und ausführen, wenn das Sheet geöffnet wird oder wenn ein Menüelement (das Sie definieren können) ausgewählt wird.

Hier ist ein Schnellstart/Demo . Der Code sieht folgendermaßen aus:

// Let's say you have a sheet of First, Last, email and you want to return the email of the
// row the user has placed the cursor on.
function getActiveEmail() {
  var activeSheet = SpreadsheetApp.getActiveSheet();
  var activeRow = .getActiveCell().getRow();
  var email = activeSheet.getRange(activeRow, 3).getValue();

  return email;
}

Sie können auch solche Skripte als Web-Apps veröffentlichen .

11
Dan Dascalescu

Es gibt eine Lösung, für die keine zum Veröffentlichen der Tabelle erforderlich ist. Das Blatt muss jedoch "Freigegeben" sein. Insbesondere muss das Arbeitsblatt so freigegeben werden, dass jeder mit dem Link auf das Arbeitsblatt zugreifen kann. Sobald dies erledigt ist, kann die HTTP-API von Google Sheets verwendet werden.

Zunächst benötigen Sie einen Google-API-Schlüssel. Kopf hier: https://developers.google.com/places/web-service/get-api-key NB. Beachten Sie die Sicherheitsrisiken, die sich aus der Bereitstellung eines API-Schlüssels für die Öffentlichkeit ergeben: https://support.google.com/googleapi/answer/6310037

Holen Sie sich alle Daten für eine Tabellenkalkulation - Warnung, dies können viele Daten sein.

https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/?key={yourAPIKey}&includeGridData=true

Blatt-Metadaten abrufen

https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/?key={yourAPIKey}

Holen Sie sich eine Reihe von Zellen

https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/values/{sheetName}!{cellRange}?key={yourAPIKey}

Mit diesen Informationen kann man AJAX) verwenden, um Daten abzurufen und sie dann in JavaScript zu bearbeiten. Ich würde die Verwendung von Axios empfehlen.

var url = "https://sheets.googleapis.com/v4/spreadsheets/{spreadsheetId}/?key={yourAPIKey}&includeGridData=true";                                                             
axios.get(url)
  .then(function (response) {
    console.log(response);                                                                                                                                                    
  })
  .catch(function (error) {
    console.log(error);                                                                                                                                                       
  });                
7
robsco

edit: Dies wurde beantwortet, bevor die API des Google Docs veröffentlicht wurde. Weitere aktuelle Informationen finden Sie unter Evan Plaices Antwort und Dan Dascalescus Antwort .

Es sieht so aus, als ob Sie es können, aber es ist ein Schmerz, es zu benutzen. Hierbei wird die Google-Daten-API verwendet.

http://gdatatips.blogspot.com/2008/12/using-javascript-client-library-w-non.html

"Die JavaScript-Clientbibliothek verfügt über Hilfsmethoden für Kalender, Kontakte, Blogger und Google Finanzen. Sie können sie jedoch mit nahezu jeder Google Data-API für den Zugriff auf authentifizierte/private Feeds verwenden. In diesem Beispiel wird die DocList-API verwendet."

und ein Beispiel für das Schreiben eines Gadgets, das mit Tabellenkalkulationen verknüpft ist: http://code.google.com/apis/spreadsheets/gadgets/

6
Ape-inago

"JavaScript-Zugriff auf Google Text & Tabellen" wäre mühsam zu implementieren, und außerdem ist Google-Dokumentation nicht so einfach zu beschaffen. Ich habe einige gute Links zu teilen, mit denen Sie js Zugang zu gdoc erreichen können:

http://code.google.com/apis/documents/docs/3.0/developers_guide_protocol.html#UploadingDocs

http://code.google.com/apis/spreadsheets/gadgets/

http://code.google.com/apis/gdata/docs/js.html

http://www.mail-archive.com/[email protected]/msg01924.html

Könnte sein, dass diese Ihnen helfen würden.

4
Pratik

Sorry, das ist eine miese Antwort. Anscheinend ist dies seit fast zwei Jahren ein Problem . Halten Sie also nicht den Atem an.

Hier ist die offizielle Bitte, dass Sie "Stern"

Wahrscheinlich ist der nächste Schritt, den Sie unternehmen können, Rolling Ihres eigenen Dienstes mit Google App Engine/Python und das Anzeigen der von Ihnen benötigten Teilmenge mit Ihrer eigenen JS-Bibliothek. Ich hätte aber gerne selbst eine bessere Lösung.

2
mjhm

In dieser sich schnell verändernden Welt sind die meisten dieser Links obsolet.

Jetzt können Sie Google Drive-Web-APIs verwenden:

2
vladkras

Für diese Art von Dingen sollten Sie Google Fusion Tables verwenden. Das API wurde für diesen Zweck entwickelt.

1
Tim

sie können dies tun, indem Sie Sheetsee.js und tabletop.js verwenden

  1. Beispiel von Git
  2. ein weiteres Beispiel
1
Deep Shah

Ich baue Stein aus, um Ihnen dabei zu helfen. Es bietet auch eine reine HTML-Lösung, falls Sie Daten direkt vom Blatt anzeigen möchten. Schau es dir an unter steinhq.com .

0
Shiven Sinha

Mithilfe des RGraph-Blatt-Connectors können Sie Google Sheets-Arbeitsblattdaten in JavaScript lesen:

https://www.rgraph.net/canvas/docs/import-data-from-google-sheets.html

Ursprünglich (vor einigen Jahren) stützte sich dies auf einige RGraph-Funktionen, um seine Magie zu entfalten - aber jetzt kann es funktionieren Standalone (dh es wird keine gemeinsame RGraph-Bibliothek benötigt).

Beispielcode (in diesem Beispiel wird ein RGraph-Diagramm erstellt):

<!-- Include the sheets library -->
<script src="RGraph.common.sheets.js"></script>

<!-- Include these two RGraph libraries to make the chart -->
<script src="RGraph.common.key.js"></script>
<script src="RGraph.bar.js"></script>

<script>
    // Create a new RGraph Sheets object using the spreadsheet's key and
    // the callback function that creates the chart. The RGraph.Sheets object is
    // passed to the callback function as an argument so it doesn't need to be
    // assigned to a variable when it's created
    new RGraph.Sheets('1ncvARBgXaDjzuca9i7Jyep6JTv9kms-bbIzyAxbaT0E', function (sheet)
    {
        // Get the labels from the spreadsheet by retrieving part of the first row
        var labels = sheet.get('A2:A7');

        // Use the column headers (ie the names) as the key
        var key = sheet.get('B1:E1');

        // Get the data from the sheet as the data for the chart
        var data   = [
            sheet.get('B2:E2'), // January
            sheet.get('B3:E3'), // February
            sheet.get('B4:E4'), // March
            sheet.get('B5:E5'), // April
            sheet.get('B6:E6'), // May
            sheet.get('B7:E7')  // June
        ];

        // Create and configure the chart; using the information retrieved above
        // from the spreadsheet
        var bar = new RGraph.Bar({
            id: 'cvs',
            data: data,
            options: {
                backgroundGridVlines: false,
                backgroundGridBorder: false,
                xaxisLabels: labels,
                xaxisLabelsOffsety: 5,
                colors: ['#A8E6CF','#DCEDC1','#FFD3B6','#FFAAA5'],
                shadow: false,
                colorsStroke: 'rgba(0,0,0,0)',
                yaxis: false,
                marginLeft: 40,
                marginBottom: 35,
                marginRight: 40,
                key: key,
                keyBoxed: false,
                keyPosition: 'margin',
                keyTextSize: 12,
                textSize: 12,
                textAccessible: false,
                axesColor: '#aaa'
            }
        }).wave();
    });
</script>
0
Richard