Chris Collins

Tools · everyday

Google Docs connector

An experiment in connecting browser tools to Google Docs — sign in with Google, pick or create a document, read it, and append notes from a scratchpad (at the end, under a heading, or into a section a tool keeps up to date). The app can only see documents you pick or create here.

Added

How to use it

This is an experiment: can tools on a static website talk to Google Docs directly from your browser, with no server of their own? It can. Sign in with Google, choose a document, and send text to it from the scratchpad. Other tools on this site can reuse the same connection (the gdocs.js module) to send their results — dictation, talk notes, measurements — to a document.

Using it

  1. Do the one-time setup below and paste your Client ID and API key into Settings.

  2. Sign in with Google. A Google window asks you to allow access; this page never sees your password.

  3. Pick a document… opens Google’s own file picker, or New document… creates one. The chosen document is remembered in this browser.

  4. Write in the Scratchpad and Send to document:

    • Append at the end adds a paragraph at the end (optionally with a timestamp).

    • Append under a heading adds it at the end of that heading’s section, creating the heading (as Heading 2) if it doesn’t exist.

    • Replace a marked section replaces everything between the lines [gw:start name] and [gw:end name] — they’re added at the end the first time. A tool can keep such a block up to date without touching the rest of the document.

The document’s text is shown beside the scratchpad (headings as #, bullets as •) and read again after every change.

What it can see, and what is stored

  • Only the documents you pick or create here. The only permission asked for is Google’s drive.file: no access to the rest of your Drive, no email or profile scope. (The account name shown comes from the Drive "about" call that permission already allows.)

  • Your sign-in is never stored. The access token Google returns lives in memory and lasts about an hour. Browser-only apps can’t hold a long-lived refresh token, so after a reload or an hour you Reconnect with one click — Google remembers that you allowed access, so there is no password and usually no question.

  • Stored in this browser: your Client ID and API key (not secrets — Google only accepts them from the web addresses you list in your Cloud project), the chosen document’s id and title, the scratchpad text, and your choices. Sign out revokes the token.

Google addresses it contacts

Only after you sign in or open the picker:

  • accounts.google.com — Google Identity Services and the sign-in window

  • oauth2.googleapis.com — revoking access when you sign out

  • apis.google.com and docs.google.com — the Google Picker

  • docs.googleapis.com — reading, creating and editing documents

  • www.googleapis.com/drive/v3/about — your account name for display

One-time setup

You need your own Google Cloud project; it’s free and takes about ten minutes.

  1. In the Google Cloud console, create a project.

  2. APIs & Services → Library: enable the Google Docs API, Google Drive API and Google Picker API.

  3. Google Auth Platform (OAuth consent screen): user type External, publishing status Testing; give the app a name and your email; add yourself under Test users; under data access add the scope …/auth/drive.file.

  4. Clients → Create client → Web application. Under Authorized JavaScript origins add https://geekychris.github.io and, for the local preview, http://127.0.0.1:8790. No redirect URI is needed. Copy the Client ID.

  5. APIs & Services → Credentials → Create credentials → API key. Restrict it to the websites https://geekychris.github.io/* and http://127.0.0.1:8790/\*, and to the Google Picker API. Copy the key.

  6. Paste both into Settings, Save, and Sign in with Google.

In Testing mode Google shows an "unverified app" notice when you sign in — that’s expected for a personal project, and only the test users you listed can sign in at all.

For other tools

/tools/gdocs.js defines window.GDOCS: ready(), signIn(), signOut(), pickDoc(), createDoc(title), readText(id), appendText(id, text, { heading, timestamp }), replaceSection(id, name, text), and currentDoc() / setCurrentDoc() — the chosen document is shared between tools. The header comment in the file documents each call.

Runs entirely in your browser — network requests go only to the services named on this page.