使用cURL和JavaScript操作线上Airtable API图文详解


带有cURL和JavaScript的Airtable API教程

如果您正在寻找一种快速简便的方式来保存应用程序数据，那么Airtable就是您的最佳选择。Airtable基本上是一个像数据库一样的Excel工作表，具有大量的灵活性和用于检查/创建数据的GUI。

目录

  • 基础入门
  • API
  • Postman中带有HTTP请求的CRUD操作
  • 使用JavaScript进行CRUD操作
  • 小结

最近，我已经将Airtable用作我的一些演示应用程序的数据库，我喜欢它。例如，还有其他一些不错的选择，例如Firebase，但是Airtable对我来说似乎最简单。在本文中，让我们探讨如何创建基础（Airtable的数据库词），然后以两种不同的方式对它执行CRUD（创建，读取，更新和删除）操作，即原始HTTP请求和NPM上的Airtable JavaScript包。

基础入门

与如今的大多数产品一样，您可以免费使用Airtable进行注册。他们确实有付费层，但免费层绰绰有余，并且可能会持续一段时间。点击在线注册
在这里插入图片描述
现在您已经注册，让我们创建我们的第一基地。您应该进入显示所有现有基准的屏幕。我已经有一些创建，您可以在这里看到。
在这里插入图片描述
出于演示目的，我们将使用现有模板，而不是从头开始创建模板。点击Add a base.然后，选择Start With a Template.
在这里插入图片描述
让我们使用Project Tracker模板。几秒钟后，您应该会看到列出的新基地。继续并打开它。完成后，请注意这里有很多虚拟数据。
在这里插入图片描述
我建议花几分钟在这里看看。执行操作时需要注意几件事。

  • 数据的结构与Excel工作表非常相似
  • 列类型是可自定义的（字符串，数字，日期等等）
  • 不同的表格有不同的标签（默认情况下，“设计项目”处于选中状态）
  • 您甚至可以将图片阵列存储为属性

仅仅基于这些虚拟数据，您就可以快速了解Airtable多么酷！

API

Airtable的文档是另一个优点。它遍历了可以对数据执行的所有CRUD操作的示例。你可以找到此处的API文档。
在这里插入图片描述
从那里，选择我们几分钟前创建的基础。很酷的事情是，文档现在将特定于该基础中的数据。
在这里插入图片描述
该Rate Limit部分位于docus页面顶部，这是一件事。这就解释了每秒可以向API发出的请求数量的限制。

“ API限制为每秒每基础5个请求”

您还可以购买会员，定制化需求，免费的是有一定限制的，但基本上学习测试个人使用足够用了。

在这里插入图片描述

认证方式

与其他所有API一样，您需要某种私有证书才能在您的API请求中传递给Airtable进行验证。在这种情况下，专用证书是“ API Key.如果您滚动到该Authentication部分，它会告诉您更多信息”。
在这里插入图片描述
当我们滚动浏览文档时，我已经show API Key选中了该复选框。这是找出密钥的最简单方法之一。尽管我在这些图像中共享我的图像，但是在您阅读本文时，我将对其进行更改。

切勿与任何人共享您的API密钥

设计项目表

在这里插入图片描述
我只是想澄清一下使用Airtable的方法。Fields指的是您为表中的每个表专门定义的属性。Airtable会自动创建一些属性（记录ID和创建的时间戳），但是这些属性未包含在其中。fields.您将在下面看到此属性。

API URL结构

API调用的工作方式如下。我正在使用示例的具体细节

  • 基本API网址- https://api.airtable.com/v0/
  • 表格 ID-appu53qW5mpKdJAW2
  • 表格名称 - “设计项目”

将所有这些放在一起，就会得到类似的结果。

1
https://api.airtable.com/v0/appu53qW5mpKdJAW2/Design%20projects

如前所述，您还需要同时传递API密钥 bearer token。

Postman中带有HTTP请求的CRUD操作

同样，这些文档确实很棒。

列出记录

向下滚动到该List Records部分，您可以看到HTTTP请求如何检索记录列表。

在这里插入图片描述

在他们给您的URL中，您可以看到我们上面引用的不同部分吗？还包括一些用于过滤的查询参数。

1
https://api.airtable.com/v0/appu53qW5mpKdJAW2/Design%20projects?maxRecords=3&view=All%20projects

让我们对此进行测试。我将使用Postman测试这些HTTP请求。在Postman内部，我选择发出一个Get请求，将其传递给URL，然后在该Headers部分中包含API密钥。

在这里插入图片描述
Airtable的每个响应都将返回一个对象，该对象的属性records将保存我们查询或删除的所有记录。很好而且很稳定！

检索记录

要检索特定记录，我们只需将要查找的记录的ID传递到API的末尾，然后删除查询字符串参数即可。您可以从上一个请求中从返回主体中获取一个ID。这是我的网址。

1
https://api.airtable.com/v0/appu53qW5mpKdJAW2/Design%20projects

您应该会收到这样的回复。

在这里插入图片描述

建立记录

要创建一条记录，我们使用与我们一直使用的相同的基本URL。

1
https://api.airtable.com/v0/appu53qW5mpKdJAW2/Design%20projects

不同之处在于这成为一个POST请求，并且我们将要包含在请求正文中的记录包括在内。要在Postman中传递JSON数据，我通常选择raw然后JSON (application/json).

与从Airtable返回的响应类似，我们发送一个对象，该对象的属性为records，然后为要创建的每个项目创建一条记录。

在这里插入图片描述

注意，在返回数据中，记录具有两个新属性，id和createdTime。这使您知道记录已成功创建。您也可以在GUI中查看新记录以进行验证。

在这里插入图片描述

更新记录

有两种不同的方式来更新记录。

  • PATCH-这将更新传入记录中指定的字段
  • PUT-这是一个破坏性更新，将清除所有未指定的字段

您必须确定其中哪一项对您更有意义，但我将使用演示一个例子Patch。同样，相同的基本URL。

1
https://api.airtable.com/v0/appu53qW5mpKdJAW2/Design%20projects

我要在体内更新的唯一内容是的名称 Testy Test Updated!!。

1
2
3
4
5
6
7
8
9
10
{
    "records": [
        {
            "id":"recBW7Qan7p8eedRy",
            "fields": {
                "Name": "Testy Test Updated!!"
            }
        }
    ]
}

检查GUI以查看更新的记录。

在这里插入图片描述

删除记录

最后，我们可以删除一条记录。为此，我们发送DELETE请求并将记录ID放在url的末尾。

1
https://api.airtable.com/v0/appu53qW5mpKdJAW2/Design%20projects?records[]=rec3u2SyIm7ZCktXU

回来的响应将验证记录已删除。您也可以再次在GUI中查看。

在这里插入图片描述

使用JavaScript进行CRUD操作

好了，我们涵盖了大多数细节。现在，让我们快速看一下 NPM上的Airtable.js 了解如何使用JavaScript完成同一件事。

在这里插入图片描述

由于我们正在重复步骤，因此我将跳过图像，仅显示代码片段。

设置和初始化

在您喜欢的编辑器中，打开一个文件夹并创建一个名为的文件，app.js.然后运行以下命令将您的项目初始化为JavaScript项目。

1
> npm init

然后安装Airtable软件包。

1
> npm install airtable

现在，我们需要在文件中初始化Airtable对象。

  • 需要航空表
  • 使用我们的API密钥和基本ID创建对我们基础的引用
  • 使用基本引用和表名创建对我们表的引用
1
2
3
4
5
6
const Airtable = require('airtable');
const base = new Airtable({ apiKey: '<YOUR_API_KEY>' }).base(
    'appqvc1jKHBIRRbSy'
);

const table = base('Design projects');

table从现在开始，对于CRUD操作，我们将使用该变量。我们进行的每个通话都会返回一个承诺。我正在使用async/await模式代替.then()和.catch()处理返回的promise。

获取记录

调用select()带对象的函数，您可以在其中包含查询参数。之前，我们使用maxRecords和view，所以我们可以在这里做同样的事情。

致电后，select()我们还需要致电firstPage()。这是因为分页。如果我们的表中有很多记录，我们可能一次不想要它们，因此我们可以致电firstPage()获取结果的第一页。

1
2
3
4
5
6
const getRecords = async () => {
    const records = await table
        .select({ maxRecords: 3, view: 'All projects' })
        .firstPage();
    console.log(records);
};

获取特定记录

要获取特定记录，我们可以调用find()并传递我们要查找的记录的ID。

1
2
3
4
const getRecordById = async (id) => {
    const record = await table.find(id);
    console.log(record);
};

如果您在此处注销结果，则可能会注意到有大量信息被返回。我使用的一个技巧是去除所有多余的数据id，fields.我创建了一个minify函数来执行此操作。

1
2
3
4
5
6
const minifyRecord = (record) => {
    return {
        id: record.id,
        fields: record.fields,
    };
};

有了minify，我的日志输出就从此开始。
在这里插入图片描述
为此…
在这里插入图片描述

建立记录

要创建记录，我们调用create()函数并传递一个对象来表示记录的字段。

1
2
3
4
const createRecord = async (fields) => {
    const createdRecord = await table.create(fields);
    console.log(minifyRecord(createdRecord));
};

更新记录

要更新记录，请调用update()函数并传递记录ID和要更新的字段。

1
2
3
4
const updateRecord = async (id, fields) => {
    const updatedRecord = await table.update(id, fields);
    console.log(minifyRecord(updatedRecord));
};

删除记录

要删除记录，请调用destroy()并传递您要删除的记录的ID。

1
2
3
4
const deleteRecord = async (id) => {
    const deletedRecord = await table.destroy(id);
    console.log(minifyRecord(deletedRecord));
};

处理错误

每当您发出HTTP请求时，都需要为处理错误做好准备。在上面的每个示例中，您都应该在API调用周围加上，try/catch这样就可以处理错误（如果有的话）。

1
2
3
4
5
6
7
8
const deleteRecord = async (id) => {
    try {
        const deletedRecord = await table.destroy(id);
        console.log(minifyRecord(deletedRecord));
    } catch (err) {
        console.error(err);
    }
};

小结

希望您能看到在您的应用程序中使用Airtable的便捷性。如果您使用的是JavaScript，那么这很容易，因为NPM软件包非常易于使用。更不用说，整体文档也很好。

给你的问题。您正在为应用程序使用哪种数据库？在评论中让我知道！