Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fetch data from Airtable *securely* #46

Open
Weihua4455 opened this issue Aug 22, 2022 · 2 comments
Open

Fetch data from Airtable *securely* #46

Weihua4455 opened this issue Aug 22, 2022 · 2 comments
Assignees

Comments

@Weihua4455
Copy link
Collaborator

For this project, we compiled a list of ARPA spendings in Airtable, which will feed into a story component will readers can shuffle through them.

The first thing I tried is using Makefile + baseGL + cURL request to request the dataset in command line, then moving the file under src/assets/data

It worked, but obviously the data would only update if someone pulls it manually.

Now I'm trying to fetch the data in graphic.js directly, but it exposes our authorization key. I'd love some help and guidance on

  1. Should I be alarmed by this?
  2. How should we fix this and fetch Airtable data securely?

Not sure who to tag because I feel like everyone but me would know exactly what to do lol, maybe start with @GabeIsman and @eads?

Here's snippet:

function getWTFData() {
  try {
    return fetch("https://api.baseql.com/airtable/graphql/appjNDCHFduMTVuRA", {
      "headers": {
        "accept": "application/json",
        "accept-language": "en-US,en;q=0.9",
        "authorization": "Bearer MTJhNGIzNjgtZmRkZS00MWJiLWIxMjAtYzU4NzVkNDM2YTI5",
        "cache-control": "no-cache",
        "content-type": "application/json",
        "pragma": "no-cache",
      },
      "referrer": "https://app.baseql.com/",
      "referrerPolicy": "strict-origin-when-cross-origin",
      "body": "{\"query\":\"query MyQuery {\\n  requests {\\n    budget\\n    category\\n    description\\n    obligations\\n    place\\n    projectName\\n    state\\n    wtf\\n  }\\n}\\n\",\"variables\":null,\"operationName\":\"MyQuery\"}",
      "method": "POST",
      "mode": "cors",
      // "credentials": "include"
    })
    .then(r => r.json());
  } catch(err) {
    console.log("fetching error while getting data:", err);
  }
}

@Weihua4455 Weihua4455 self-assigned this Aug 22, 2022
@eads
Copy link
Collaborator

eads commented Aug 22, 2022

We should just switch to static for publication -- this needs to be dev/preview only. We should not be loading live in production.

You don't actually need those auth tokens, but they'll expire in any case so if we ever open sourced this, we'd be safe.

@Weihua4455
Copy link
Collaborator Author

Ah awesome that made me feel so much better.

I'll leave this one open so I don't forget to switch off to the static version!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants