I guess the only option I have is to restrict my own Google API key to the domains of websites that I manage or control and to offer a public version of the app that requires as a parameter a different Google API key that is the responsibility of the using organisation (and they would be advised to restrict the key to domains they manage or control). Of course the API keys will still be exposed, but if they're restricted to trusted domains they should be safe from abuse - right?

Yes and no. Forcing a trusted domain will stop folks from stealing your key and also using it client side. This is of course better than nothing. It can't stop folks from using it server side and spoofing the referer header.

I'm not saying that the client side solution using the key should be taken off the table, just that I think there needs to be a big disclaimer in bold faced print somewhere so people understand the implications of doing it this way. I'm a big fan Tabletop and have been using it for ~10 years now. I plan on using this api key client side for private applications and in build steps where exposing the key has no real consequence. For public facing apps I'm not sure what I'll be doing yet but likely some form of server side code that hides the key and caches the response to an S3 bucket or something.

@mroswell

jwhazel the code I posted in comment #189 returns an object, but result.values is an array of arrays.

All I'm saying is that you don't need Papa Parse or jQuery or any other library for this. It's just an array of arrays in the response. So if you pull the raw data like this let rawData = await fetch(endpoint).then((res) => res.json());, then a couple lines of vanilla JS will give you an array of objects exactly like how Tabletop did it:

  //Use the first row as the header row
  let headers = rawData.values.shift();

  //Now loop through each subsequent row and bind each value to the corresponding header
  let data = rawData.values.map((row) => {
    return row.map((val, i) => {
      return { [headers[i]]: val };
    });
  });

If you want something besides a simple key:value pair with the key being the header value, you can modify that loop however you want. But the point is it's so much faster/simpler and doesn't require any external libraries.

Tabletop becoming obsolete :-( #187

Description

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions