从 static html 表单在 airtable base 中创建一行

Question

我有一个静态登陆页面，我想在 airtable 中创建一个简单的候补名单，仅使用普通 html/javascript。

我在登陆页面上创建了一个简单的表单，它只接受电子邮件。按“提交”按钮后，我想 post 这封电子邮件到我的 airtable 基地。我想这可以通过一个简单的 POST 请求来完成。

有人有这方面的例子吗？

Answer 1

你可以这样做，但这样做需要你在面向 HTML 的 public 页面中公开你的 Airtable API 键，不推荐。任何人都可以在您的页面中找到该密钥，然后使用它。

您可以提出 POST 请求在数据库中创建新记录。要想成功，您需要：

您的 API 密钥
基地编号
Table 您希望在

您可以看到 https://airtable.com/api for more details. The fetch 代码看起来像这样：

var myHeaders = new Headers();
myHeaders.append("Authorization", `Bearer ${YOUR_API_KEY}`);
myHeaders.append("Content-Type", "application/json");

var data = {
  fields: {
    Email: `${email_in_form_submission}`
  }
}
var raw = JSON.stringify(data);

var requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
};

fetch(`https://api.airtable.com/v0/${YOUR_BASE_ID}/${YOUR_TABLE_ID}`, requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

航空table形式

如果您想在您拥有和控制的页面上插入表单，还建议查看 Airtable 的原生 Form Views which allow you to create a public facing form that people can submit and have the data go directly into your base. The forms can also be embedded as iframes。

从 static html 表单在 airtable base 中创建一行

Create a row in an airtable base from static html form

javascript

html

airtable

航空table形式