Hexabase(ヘキサベース)は企業においても安心して利用できるBaaS(Backend as a Service)を提供しています。多くのBaaSがそうであるように、主にフロントエンド開発者に利用してもらいたいと考えています。そこで現在、TypeScript SDKの開発が進められています。
この記事ではHexabase TypeScript SDKのインストールと、ファイルアップロードを行う方法を解説します。
インストール
インストールはnpmやyarnを使って行います。
# npmの場合
npm install @hexabase/hexabase-js
# yarnの場合
yarn add @hexabase/hexabase-js
インポート
インポートすると、 HexabaseClient
というオブジェクトが取得できます。
import { HexabaseClient } from "@hexabase/hexabase-js";
初期化
HexabaseClientを初期化します。
const client = new HexabaseClient();
認証
Hexabaseでは業務利用を想定しているため、利用する際に認証情報が必須になります。最初はメールアドレスとパスワードで認証し、その後はトークンを使ってGraphQLにアクセスします。 client
を使って処理します。
初回の認証は次のようになります。emailとパスワード、またはトークンが必須です。
await client.login({email, password, token});
後はこの client
に対して処理を行います。
プロジェクトを取得する
データレポートはプロジェクトに紐付きます。そこで、まず利用するプロジェクトを取得します。
現在のワークスペースを取得する
ログインした時点でHexabaseClientのcurrentWorkspaceが現在のワークスペースオブジェクトになっています。
client.currentWorkspace
ワークスペースを切り替える場合には、 setWorkspace
メソッドを使います。
client.setWorkspace(newWorkspaceId);
そのワークスペースに紐付いているプロジェクトを取得します。
const project = await client.currentWorkspace.projects(projectId);
データストアへのアクセス時に必要な情報について
データストアへアクセスする際には以下の情報が必要です。
- データストアID
datastoreId
- (オプション) プロジェクトID
projectId
さらにデータ取得を行う際の情報(ページ数、取得件数など) params
が指定できます。以下がアクセス例です。
const project = client.currentWorkspace.project(projectId);
const datastore = project.datastore(datastoreId);
const items = await datastore.items();
const item = items[0];
ファイルを作成する
ファイルは item.file()
を使って、FileObjectのインスタンスを取得します。そして、 name
と data
を指定します。
const file = item.file();
const blob = new Blob(['Hello world'], { type: 'text/plain' });
file
.set('name', 'test_file.txt')
.set('data', blob);
アイテムと紐付ける際には、 set
メソッドを使います。この時、フィールドは管理画面で添付ファイル型として指定します。
await item
.set('test_file', [file])
.save();
添付ファイルは複数指定できます。単数ではないので注意してください。
ファイルを取得する
ファイルを取得する際には、 get
メソッドを使います。FileObjectの配列が返ってきます。
const files = item.get('test_file') as FileObject[];
実データを取得する
実データを取得する際には download
メソッドを使ってください。 Blob型でデータが取得できます。
const data = await files[0].download() as Blob;
取得した内容は data
にもセットされています。初回は必ず download
を実行してください。
const data = files[0].get('data') as Blob;
ファイルを追加する
既存のデータに添付ファイルを追加する場合には、 add
メソッドを使ってください。
const file = item.file();
const blob = new Blob(['Hello world'], { type: 'text/plain' });
file
.set('name', 'test_file.txt')
.set('data', blob);
await item
.add('test_file', blob)
.save();
まとめ
ファイルアップロード、ダウンロード機能を使えば、データに紐付いたファイルを登録できます。画像やドキュメントなど自由にアップロードできますので、利用してください。