it-swarm.com.ru

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

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

Я пришел здесь и был шокирован, узнав, что для JavaScript нет доступа к API Google.

Скажите, пожалуйста, как получить доступ (СОЗДАТЬ/РЕДАКТИРОВАТЬ/УДАЛИТЬ) к Google Sheets, используя JavaScript или любую из его платформ, таких как jQuery.

92
Pratik

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

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

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

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

53
Mike McKay

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

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

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

При использовании API REST вам необходимо управлять и хранить исходный код, а также выполнять авторизацию, используя собственный код авторизации (см. Примеры выше). Apps Script обрабатывает это от вашего имени, управляя данными (уменьшая "боль", о которой упоминает Ape-inago в их ответ ), и ваш код хранится на серверах Google. Но ваша функциональность ограничена тем, какие сервисы предоставляет App Script, и он более старый JS (ES3 + некоторые функции ES5 и настройки Google), тогда как API REST предоставляет разработчикам гораздо более широкий доступ к API. Но, эй, хорошо иметь выбор, верно? Таким образом, чтобы ответить на оригинальный вопрос OP, вместо нуля разработчики имеют три способа доступа к Google Sheets с помощью JavaScript.

41
wescpy

Вот суть.

Вы можете создать электронную таблицу, используя 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-запроса.

34
Evan Plaice

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

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

Вот Быстрый старт/Демо . Код выглядит так:

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

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

10
Dan Dascalescu

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

Прежде всего, вам нужен ключ API Google. Отправляйтесь сюда: 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. Я бы порекомендовал использовать axios .

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

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

Похоже, вы можете, но это боль в использовании. Это связано с использованием API данных Google.

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

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

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

6
Ape-inago

Использовать 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/[email protected]/msg01924.html

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

4
Pratik

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

Вот официальный запрос, который вы можете "звезда"

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

2
mjhm

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

Теперь вы можете использовать Google Drive Web API :

2
vladkras

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

2
Tim

вы можете сделать это, используя Sheetsee.js и tabletop.js

  1. пример из git
  2. другой пример
1
Deep Shah

Я строю Штейна, чтобы помочь тебе сделать это. Он также предоставляет решение только для HTML, если вы хотите отображать данные прямо с листа. Проверьте это на steinhq.com .

0
Shiven Sinha

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

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>
0
Richard