Coda API table access

I hope somebody can enlighten me a little bit on working with the API.

What I would like to accomplish is showing a couple of fields from a table from a non-publicly-shared coda document on a page on a website, preferably in the middle of some other (already existing and non-changing) text items. An example of what I am trying to do is retrieving the text from the column messages from the 3 newest rows in the table Updates.

I know how to get the API token for the table and how to get the ID of the table or the columns. I would like to get this information by using some javascript or perhaps through a URL. I tried some variations on https:\coda.io\apis\v1 … , but I could not retrieve the info from the table.

I assume that by using an API key to only one table, I am not exposing other parts of my coda doc to the outside world?

Hopefully somebody can help me getting started with his. Thanks in advance for some tips.

Greetings, Joost

From my recollection, the API key exposes both read and write access to your table, so it wouldn’t be very secure to expose it in client-side Javascript.

Instead, you probably want to create a little thing on Google Apps Script, which the API docs have some tutorials on. Your design would be:

  • Google Apps Script has your secret API key, and pulls the relevant cells from the table
  • Google Apps Script is published as a web app, and when you hit its URL, it is triggered and responds with this data (maybe as JSON)
  • In your client-side Javascript, you reach out to your Google Apps Script’s URL to get the data

The caveat is that this will not be particularly fast to load - 5-10 seconds I would guess.

1 Like

Hey @Nick_HE ,

Thank you for your suggestion, I had not realized that I could do this through a google script/app. There are indeed quite a few examples available.

On the record: you can create an Coda API key in your choice of read/write or read only, Nevertheless, I do agree with your statement about exposing the API key through javascript code.

About the speed: that is indeed an issue in some situations, for this particular job it’s not a big deal.

Thanks again,
Greetings, Joost

That’s interesting about the read-only API key for a particular table, yeah. If you’re ok exposing the whole table to a motivated adversary, you could probably increase performance (and reduce infrastructure complexity) by using Fetch() right from the client, putting your API key in the header. Details of Coda’s authentication headers here, and then Google for examples of headers in Fetch.

It is something to think about twice, but this table has only messages that appear on my website anyway. So for this particular situation I think it might be OK.

Up to the drawing board - I will get some help from people with a lot more experience working with API’s and google scripts than I will ever get - not enough hours in a day…

My problem is: I don’t know what this URL should look like. The samples in Python or Google script give me some idea, but it has to be exactly right. Just trying to put a string together and hope for an answer from the coda API interpreter is a bit rough road to go.

I hope someone will show me a working sample string and I can go from there, replacing table ID and tokens.

Here’s an example of authorization and getting the URL.

To find the URL for the type of resource you’re after, check out the right-side column of the API Docs

:warning: WARNING TO OTHERS READING THIS LATER :warning: Make sure any API keys you’re putting into client-side code (i.e. embedding in your web page) are restricted only to the doc or table you want to expose, and that they’re set to read-only. Ask if you need help with this. Possible negative outcomes include someone viewing and/or deleting everything in your Coda account.

const codaApiToken = '<yourApiToken>'; // replace with your (safe!) API token
const baseUrl = 'https://coda.io/apis/v1';
const docId = '<yourDocId>'; // replace with your doc id
const tableId = '<yourTableId>'; // replace with your table id
const url = baseUrl + '/docs/' + docId + '/tables/' + tableId + '/rows';
// in other words, https://coda.io/apis/v1/docs/<docId>/tables/<tableId>/rows
// Check out the API docs for other endpoints (right column of the docs will show
// you everything that comes after the "https://coda.io/apis/v1/")

fetch(url, {
  headers: {
    // this is how you get the API Key authorization in there
    'Authorization' : 'Bearer ' + codaApiToken
  }
})
.then(function (response) {
  // some boilerplate fetch() stuff for handling status problems
  if (response.ok) {
		return response.json();
	} else {
		return Promise.reject(response);
	}
})
.then(function (data){
  // this is where your magic happens - I'm logging an array of rows to 
  // to the console but you can loop over them and do whatever you like,
  // such as inject them into the page somewhere.
  console.log(data.items);
})
.catch(function (err){
  console.warn("Error: " + err);
});
2 Likes

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.