Как я могу получить доступ к таблицам Google Sheet только с помощью Javascript?


101

Я хочу получить доступ к таблицам Google только с помощью JavaScript (без .NET, C #, Java и т. Д.)

Я пришел сюда и был шокирован, узнав, что для JavaScript НЕТ API для доступа к Google Таблицам.

Скажите, пожалуйста, как получить доступ к (СОЗДАТЬ / ИЗМЕНИТЬ / УДАЛИТЬ) Google Таблицы с помощью JavaScript или любой из его структур, например jQuery.


1
предоставленная вами ссылка содержит информацию об использовании JSON. вы должны иметь возможность использовать это в JavaScript.
GSto

1
@GSto было бы полезно, если бы вы могли дать мне некоторое представление об этом. Позвольте мне снова позвонить вам, я хочу получить доступ к электронной таблице Google через javascript.Спасибо.
Pratik

1
Это полный учебник developers.google.com/sheets/api/quickstart/js
FONGOH MARTIN

Возможно, стоит рассмотреть возможность использования Sheetsu. Это довольно просто для JSON API и ограничено бесплатной версией, но действительно упрощает то, что необходимо любому разработчику для использования электронных таблиц Google. Надеюсь, это поможет некоторым людям.
Jester

Ответы:


60

Я создал простую библиотеку javascript, которая извлекает данные электронной таблицы Google (если они опубликованы) через JSON api:

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

Вы можете увидеть это в действии здесь:

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


3
Это сэкономило мне массу времени. Спасибо вам большое! Однако я решил разветвить ваш код, чтобы иметь возможность обрабатывать пустые ячейки данных, а также организовывать их в строки (данные, возвращаемые как есть, представляют собой просто гигантский массив ячеек, но поскольку пустые ячейки не были принимая во внимание, не было простого способа систематизировать данные). Обновление коснулось вашего метода callbackCells (). Проверьте это: github.com/rw3iss/google-spreadsheet-javascript.git Еще раз спасибо, чувак!
Райан Вайс

5
Ответ Эвана Плейса stackoverflow.com/a/8666573/42082 содержит более подробную информацию об официальном API Google Docs и о том, как использовать электронную таблицу. Стоит посмотреть.
Ape-inago

новая версия API 3.0 и Oauth 2.0
PreguntonCojoneroCabrón

Похоже, что Google изменил политику, и теперь она не работает.
Чираг

51

ОБНОВЛЕНИЕ в январе 2018 г. Когда я отвечал на этот вопрос в прошлом году, я не упомянул о третьем способе доступа к API Google с помощью JavaScript, и это будет из приложений Node.js, использующих его клиентскую библиотеку, поэтому я добавил его ниже.

Это март 2017 года , и большинство ответов здесь устарели - принятый ответ теперь относится к библиотеке, которая использует более старую версию API. Более актуальный ответ: вы можете получить доступ к большинству API Google только с помощью JavaScript. Сегодня Google предлагает 3 способа сделать это:

  1. Как упоминалось в ответе Дэна Даскалеску , вы можете использовать Google Apps Script , облачное решение JavaScript в Google . То есть, серверные JS-приложения, не относящиеся к Node, вне браузера, которые работают на серверах Google.
  2. Вы также можете использовать клиентскую библиотеку Google API для JavaScript, чтобы получить доступ к последней версии Google Sheets REST API на стороне клиента.
  3. Третий способ доступа к API Google с помощью JavaScript - из приложений Node.js с использованием его клиентской библиотеки . Он работает аналогично использованию клиентской библиотеки JavaScript (клиентской), описанной чуть выше, только вы будете получать доступ к тому же API со стороны сервера. Вот пример быстрого запуска Node.js для Таблиц. Вы можете найти приведенные выше видеоролики на основе Python еще более полезными, поскольку они также обращаются к API со стороны сервера.

При использовании REST API вам необходимо управлять исходным кодом и хранить его, а также выполнять авторизацию путем развертывания собственного кода аутентификации (см. Примеры выше). Скрипт приложений обрабатывает это от вашего имени, управляя данными (уменьшая «боль», как упомянул Ape-inago в их ответе ), а ваш код хранится на серверах Google. Но ваша функциональность ограничена тем, какие службы предоставляет сценарий приложения, тогда как REST API предоставляет разработчикам гораздо более широкий доступ к API. Но эй, хорошо иметь выбор, правда? Таким образом, чтобы ответить на исходный вопрос OP, вместо нуля у разработчиков есть три способа доступа к Google Таблицам с помощью JavaScript.


36

Вот суть.

Вы можете создать электронную таблицу с помощью Google Sheets API . В настоящее время нет возможности удалить электронную таблицу с помощью API (прочтите документацию). Думайте о Google Docs API как о маршруте для создания и поиска документов.

Вы можете добавлять / удалять рабочие листы в электронной таблице, используя каналы на основе рабочих таблиц .

Обновление электронной таблицы выполняется с помощью каналов на основе списков или каналов .

Чтение электронной таблицы может быть выполнено либо с помощью API-интерфейсов Google Spreadsheets, упомянутых выше, либо, только для опубликованных листов , с помощью языка запросов API визуализации Google для запроса данных (который может возвращать результаты в формате таблицы CSV, JSON или HTML).


Забудьте о jQuery. jQuery действительно ценен только в том случае, если вы просматриваете DOM. Поскольку GAS (Google Apps Scripting) не использует DOM, jQuery не добавит ценности вашему коду. Придерживайтесь ванили.

Я очень удивлен, что пока никто не предоставил эту информацию в ответе. Это не только можно сделать, но и относительно легко сделать с помощью vanilla JS. Единственным исключением является API визуализации Google, который является относительно новым (по состоянию на 2011 год). API визуализации также работает исключительно через URI строки HTTP-запроса.


13

Есть решение, которое не требует публикации электронной таблицы. Тем не менее, лист должен быть «Общий». Более конкретно, нужно предоставить общий доступ к таблице таким образом, чтобы любой, у кого есть ссылка, мог получить доступ к электронной таблице. Как только это будет сделано, можно будет использовать HTTP API Google Таблиц.

Во-первых, вам понадобится ключ Google API. Зайдите сюда: https://developers.google.com/places/web-service/get-api-key NB. Помните о последствиях для безопасности публичного доступа к ключу API: https://support.google.com/googleapi/answer/6310037

Получить все данные для электронной таблицы - предупреждение, это может быть много данных.

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

Получить метаданные листа

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

Получите диапазон ячеек

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

Теперь, вооружившись этой информацией, можно использовать AJAX для извлечения данных, а затем манипулировать ими в JavaScript. Я бы рекомендовал использовать аксиомы .

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);                                                                                                                                                       
  });                

Что такое сеточные данные?
Уильям Энтрикен

@WilliamEntriken Содержимое ячеек.
Робско

11

Обновление 2016 г . : Самый простой способ - использовать Google Apps Script API, в частности службу SpreadSheet . Это работает для частных листов, в отличие от других ответов, которые требуют публикации электронной таблицы.

Это позволит вам привязать код JavaScript к листу Google и выполнять его, когда лист открыт или когда выбран пункт меню (который вы можете определить).

Вот краткое руководство / демонстрация . Код выглядит так:

// 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;
}

Вы также можете публиковать такие скрипты как веб-приложения .


6

edit: На это ответили до того, как был выпущен API-интерфейс Google. См . Ответы Эвана Плейса и Дэна Даскалеску для получения более свежей информации.

Выглядит так, как будто можно, но пользоваться им сложно. Это предполагает использование API данных Google.

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

«В клиентской библиотеке JavaScript есть вспомогательные методы для Календаря, Контактов, Blogger и Google Финансов. Однако вы можете использовать ее практически с любым API данных Google для доступа к аутентифицированным / частным фидам. В этом примере используется DocList API».

и пример написания гаджета, который взаимодействует с электронными таблицами: http://code.google.com/apis/spreadsheets/gadgets/


почему ты называешь это «болью». Что в этом плохого?
Pratik

1
Боль, потому что у него нет собственного api, а это значит, что вам нужно самостоятельно выполнять большой анализ и манипулировать данными. API для электронных таблиц предоставит вам их.
Ape-inago

4

«JavaScript для доступа к Документам Google» было бы утомительно реализовать, и, кроме того, документацию Google также не так просто получить. У меня есть несколько хороших ссылок, с помощью которых вы можете получить js-доступ к gdoc:

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/google-help-dataapi@googlegroups.com/msg01924.html

Может быть, это вам поможет ..


8
ссылка 1 будет прекращена 20 апреля 2015 г., ссылка 2 ошибка 404, ссылка 3 v2.0 устарела, ссылка 4 устарела
vladkras

2

Извините, это паршивый ответ. Похоже, это проблема уже почти два года, так что не задерживайте дыхание.

Вот официальная просьба о том, что вы можете "пометить"

Вероятно, самое близкое, что вы можете сделать, - это развернуть собственный сервис с помощью Google App Engine / Python и раскрыть любое нужное вам подмножество с помощью собственной библиотеки JS. Хотя я бы сам хотел найти лучшее решение.


2

В этом быстро меняющемся мире большая часть этих ссылок устарела.

Теперь вы можете использовать веб-API Google Диска :



хорошо, вот полный список продуктов Google, включая электронную таблицу (хотя ее легко найти, используя мою первую ссылку)
vladkras


1

Вы можете читать данные электронных таблиц Google Sheets на JavaScript с помощью коннектора листов RGraph:

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

Первоначально (несколько лет назад) это полагалось на некоторые функции RGraph, чтобы творить чудеса, но теперь он может работать автономно (т.е. не требует общей библиотеки RGraph).

Пример кода (в этом примере создается диаграмма RGraph):

<!-- 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>

И теперь есть PHP-версия утилиты импорта, доступная по тому же URL-адресу
Ричард

0

Для этого вам следует использовать Google Fusion Tables . API предназначен для этой цели.


Не хорошая идея. Google собирается закрыть его. Голосование против него.
A_01
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.