ローコードでオリジナルのAPIを作る3つの方法まとめ
下記の2記事の続きです。
これまで、プログラミングを始めたい人が、開発環境を準備して、自分のWebサービスをインターネットに公開して、ChatGPTのAPIをつかってオリジナルのChatGPTクライアントを実装するところまでを解説してきました。
ここまでの技術があれば、既存のAPIを組み合わせて、アイデア次第でかなりいろいろなWebサービスを開発できると思います。
今回は、さらにもう一歩ステップアップして、オリジナルのAPIを開発する方法を紹介します。この技術を身につければ、拡張性とかセキュリティとかはともかく、思いついたアイデアはなんでも実装できるようになるはずです。
【初級】Zapierでつくる
Zapierとは
一番簡単なAPI開発手法として紹介したいのは、データ連携ツールのZapier（ザピアー）です。クラウドサービス間のデータ連携を自動化できるツールで、ノーコード界隈では有名なので、使っている方もいらっしゃるかもしれません。
例えば僕は「HubSpotの問い合わせフォームに入ってきた情報をSalesforceに転送する」という処理をZapierで作っています。
さて、残念ながら有料プラン限定にはなってしまうのですが、実はZapierには、作ったフロー（Zap）をAPI化する機能があり、それがとても便利です。
ZapierでAPIをつくる
新しいZapをつくり、トリガーとして「Webhook」を選択してください。
イベントは「Catch Hook」を選択して「Continue」。
「Trigger」を指定すると受け取るパラメーターを限定できるのですが、とりあえず無視して「Continue」。
すると、APIのURLが出てきます。このURLをたたくと、いま編集しているフローが動くということです。コピーしましょう。
ここでAPIに送り込みたいパラメータを定義します。例えば、コピーしたURLに、「?a=10&b=test」と付与してたたいてみました。すると、「このAPIにはa, bという2つのパラメーターを送るよ」という合図になります。値はサンプル値を適当に考えて設定します。
Zapierから応答が帰ってきますね。
その後、Zapierの画面に戻って「Test Trigger」を押すと、いま設定したパラメータがZapierで認識されています。
あとは、Zapierを使ったことがある方はなんとなくわかるはずです。このAPIがたたかれることをトリガーとして、いろんな処理を動かすことができます。
例えばこれは、「受け取った値をGoogleスプレッドシートに記録するAPI」です。
このように、ノーコードで簡単にAPIを自作できます。
Zapierの弱点は、条件分岐を作りにくいところです。ですから、複雑な処理を実装するというよりは、Reactで作ったシステムからスプレッドシートなどデータベースとなるツールにデータを送り込んだり、他のシステムを起動したりするAPIとして有効に使えます。
【中級】Google Apps Script(GAS)でつくる
GASとは
2つ目の方法は、Googleドライブの拡張機能として使えるGoogle Apps Script(GAS)です。特に、GoogleスプレッドシートをDBとして、そこにデータを書き込んだり、データを読み出したりするAPIを実装するのが便利です。
GASでAPIをつくる
新しいスプレッドシートを開いて、拡張機能＞Apps Scriptを選びましょう。
これがGASの開発画面です。
API開発するためには、GET用とPOST用のテンプレートプログラムを持っておいて、これをコピペして使います。
//GETされたときに呼ばれる処理
function doGet(e) {
//パラメータ「p」の値を取得
var param = e.parameter.p;
//スプレッドシートと連携する処理を書く
//APIの応答を返却
return ContentService.createTextOutput("{body:" + param + "}");
}//POTされたときに呼ばれる処理
function doPost(e) {
//パラメータ「p」の値を取得
var param = e.parameter.p;
//スプレッドシートと連携する処理を書く
//APIの応答を返却
return ContentService.createTextOutput("{body:" + param + "}");
}「doGet」と「doPost」が違うだけですね。呼び出し側の要件に応じて使い分けます。
プログラムが書けたら、右上の「デプロイ」から「新しいデプロイ」を選択します。
種類の選択：ウェブアプリ
名前：適当につける
アクセスできるユーザー：全員
と指定してデプロイします。
デプロイが完了すると、APIのURLが出てきます。このURLをたたくと、doGetやdoPostが起動する、ということですね。
試してみましょう。出てきたURLの後ろに「?p=testmessage」を付与して叩きます。doGetのプログラムが動作していることがわかりますね。
【上級】AWS Lambdaでつくる
Lambdaとは
たいていの処理はGASでも実装できるのですが、処理が遅いとか、ログが出ないので運用が大変とか、細かい問題がいろいろあります。将来的に拡大していく計画があるAPIの場合は、もう少し運用しやすい形態で開発したいものです。
そこでおすすめなのが、AWSのローコードツール「Lambda（ラムダ）」です。PythonやJavaScriptで書いたプログラムをAPI化することができます。
LambdaでAPIをつくる
AWSにログインしたら、検索ウインドウから「Lambda」を検索します。
Lambdaの画面で、「関数の作成」ボタンを押しましょう。
関数の新規作成画面では、以下の部分を設定します。
関数名：自由に名前をつけます
ランタイム：「Node.js 16.x」を選びます。
※最新は「18.x」なのですが、プログラムの文法が少し変わりました。しかし、公式ヘルプは16.x時代の文法で書かれていたりして難しいので、あえて旧バージョンを選択。実行ロール：「AWSポリシーテンプレートから新しいロールを作成」→ポリシーテンプレートとして「DynamoDB」を選択します。ロール名は自由に設定します。ここでLambda以外のサービスとの接続設定を行っています。
関数URLを有効化：ONにします。自動的にAPIとしての呼び出しURLが発行されます。
認証タイプ：とりあえずNONEに設定します。将来的に個人情報など重要な情報をあつかうときは、ちゃんと設定します。
オリジン間リソース共有(CORS)を設定：ONにします。これをONに設定しないと、Reactのプログラムから呼び出したときにエラーが発生します。
デフォルトで、「Hello from Lambda!」と返却するAPIのプログラムが書かれています。
設定＞関数URLを開くと、このプログラムをAPIとして呼び出すURLが書かれています。
ブラウザで関数URLをたたくと、確かに「Hello from Lambda!」と返ってきます。
あとはプログラムを自由に書き換えるだけです。
パラメーターの受け取り方が重要ですね。
//GETパラメータを受け取る。event['queryStringParameters']['パラメータ名']
exports.handler = async (event) => {
// TODO implement
const response = {
statusCode: 200,
body: JSON.stringify('parameter is ' + event['queryStringParameters']['p']),
};
return response;
};//POSTパラメータを受け取る。
exports.handler = async (event) => {
//まずは要求のJSONを取り出す
const eventbody = JSON.parse(event['body']);
//JSONからパラメータの値を取り出す
const response = {
statusCode: 200,
body: JSON.stringify('parameter is ' + eventbody['p']),
};
return response;
};DyanamoDBとLambdaを接続する
AWSにはDBのサービスが複数ありますが最も使いやすいのはDynamoDBです。使いやすいポイントとしては、GUIで項目を追加したり削除したりできることです。AWSの他のDBは、SQLを書かないと操作できません。
DynamoDBは、かなり直感的に操作できます。
新しいデータを管理したい場合には、左メニューから「テーブル」＞「テーブルの作成」ボタンを押します。
パーティションキーは必須項目です。「ID」など、データの1つ1つで、必ず一意になる項目を用意しなければなりません。
テーブルを作成したら、左メニュー「項目を探索」で値の追加・更新・削除ができます。最終的には全部Lambdaから登録することになるはずですが、テスト用のデータなどを手投入して、いろいろ検証するのに便利ですね。
DynamoDBのテーブルが準備できたら、あとはLabmdaからDynamoDBにアクセスする処理を書きます。
基本的なDB操作処理をテンプレートプログラムとして使いまわすのが良いでしょう。
//検索
function scanDynamo(params) {
return new Promise((resolve) => {
dynamo.scan(params, (err, data) => {
if(err){
console.log('dynamo_err:', err);
} else {
resolve(data);
}
});
});
}
//更新
function updateDynamo(params) {
return new Promise((resolve) => {
dynamo.update(params, (err, data) => {
if(err){
console.log('dynamo_err:', err);
} else {
resolve(data);
}
});
});
}
//追加
function putDynamo(params) {
return new Promise((resolve) => {
dynamo.put(params, (err, data) => {
if(err){
console.log('dynamo_err:', err);
} else {
resolve(data);
}
});
});
}たとえば、こんな風に使います。
var AWS = require('aws-sdk');
var dynamo = new AWS.DynamoDB.DocumentClient();
exports.handler = async (event) => {
// TODO implement
//１．検索条件の指定
let getuserparams = {
TableName : 'icp_users', //検索するテーブル名
FilterExpression: '#key1 = :user_id', //検索する項目名
ExpressionAttributeNames:{ //検索条件（key1=user_idと設定）
'#key1':'user_id',
},
ExpressionAttributeValues: { //「user_id」の値を指定
':user_id': event['queryStringParameters']['user_id'],
}
};
//２．検索を実行
let getuser = await scanDynamo(getuserparams);
const response = {
statusCode: 200,
body: JSON.stringify(getuser),
};
return response;
};
function scanDynamo(params) {
return new Promise((resolve) => {
dynamo.scan(params, (err, data) => {
if(err){
console.log('dynamo_err:', err);
} else {
resolve(data);
}
});
});
}これは、「icp_users」というDyanamoのテーブルから、「user_id = GETのパラメータで受け取ったuser_idの値」となるレコードを取得して返却するプログラムです。
これを書いて「Deploy」ボタンを押したら、関数URLにパラメータ「?user_id=～」をつけて叩きます。
このように応答が帰ってきました。
あとは１と２の部分を書き換えれば、いろいろなDB操作ができます。ここで難しいのが、１の部分ですね。一般的なSQLとはまったく違う文法で、かなりクセがあります。
公式ドキュメントに、検索、更新、追加それぞれの例が書かれているので、これを見ながら作ります。難しいですが、1回動かせばコツがつかめると思います。
まとめ
APIを自作できるようになると、開発の幅が大きく広がります。ローコードツールを駆使して、いろんなAPIを作ってみてください！
この記事が気に入ったらサポートをしてみませんか？